Fix Astro template test

.github/workflows/templates.yml

@@ -15,7 +15,7 @@ jobs:
           [
             'npx create-next-app --example "https://github.com/sumup-oss/circuit-ui/tree/main/packages/cna-template/template" test-app',
             'npx create-remix@latest ./test-app --template https://github.com/sumup-oss/circuit-ui/tree/main/packages/remix-template --install --no-git-init',
-            'npx create-astro@latest ./test-app --template sumup-oss/circuit-ui/packages/astro-template',
+            'npx create-astro@latest ./test-app --template sumup-oss/circuit-ui/packages/astro-template --install --no-git --typescript=strictest',
           ]
     steps:
       - name: Checkout repository
@@ -39,4 +39,4 @@ jobs:
 
       - name: Test app
         working-directory: ./test-app
-        run: npx start-server-and-test start 0.0.0.0:3000 "node ../scripts/verify-template.js"
+        run: npx start-server-and-test 'npm run start -- --port=3000' localhost:3000 "node ../scripts/verify-template.js"

packages/astro-template/src/layouts/Root.astro

@@ -1,4 +1,7 @@
 ---
+import '@sumup/design-tokens/light.css';
+import '@sumup/circuit-ui/styles.css';
+
 import { SumUpLogo } from '@sumup/icons';
 
 interface Props {

packages/astro-template/src/pages/index.astro

@@ -1,7 +1,4 @@
 ---
-import '@sumup/design-tokens/light.css';
-import '@sumup/circuit-ui/styles.css';
-
 import { Title, BodyLarge } from '@sumup/circuit-ui';
 import Root from '../layouts/Root.astro';
 import DocCard from '../components/DocCard.astro';

scripts/verify-template.js

@@ -22,7 +22,9 @@ const puppeteer = require('puppeteer');
   const expected = 'Welcome to Circuit UI';
 
   try {
-    const browser = await puppeteer.launch();
+    const browser = await puppeteer.launch({
+      headless: 'new',
+    });
     const page = await browser.newPage();
 
     await page.goto('http://localhost:3000');