add proper CI

.github/workflows/ci.yml

@@ -0,0 +1,35 @@
+name: CI
+on: [ push, pull_request ]
+
+jobs:
+  test:
+    # Prevent workflow being run twice, https://github.com/orgs/community/discussions/57827#discussioncomment-6579237
+    if: github.event_name != 'pull_request' || github.event.pull_request.head.repo.full_name != github.event.pull_request.base.repo.full_name
+
+    name: ${{ matrix.cmd }} (${{ matrix.os }})
+
+    runs-on: ${{ matrix.os }}
+
+    strategy:
+      matrix:
+        os:
+          - ubuntu-latest
+          - windows-latest
+        cmd:
+          - pnpm run test:e2e
+          - pnpm run test:units
+          - pnpm run test:types
+
+    steps:
+      - uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v3
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 21
+          cache: "pnpm"
+
+      - run: pnpm install
+      - run: pnpm exec playwright install chromium
+      - run: pnpm run build
+
+      - run: ${{ matrix.cmd }}

examples/basic/.test.ts

@@ -0,0 +1,56 @@
+import { test, expect, run, fetchHtml, page, getServerUrl, autoRetry } from '@brillout/test-e2e'
+
+runTest()
+
+function runTest() {
+  run('pnpm run dev')
+
+  testUrl({
+    url: '/',
+    title: 'My Vike + React App',
+    text: 'My Vike + React app',
+    counter: true
+  })
+
+  testUrl({
+    url: '/star-wars',
+    title: '6 Star Wars Movies',
+    text: 'A New Hope'
+  })
+
+  testUrl({
+    url: '/star-wars/3',
+    title: 'Return of the Jedi',
+    text: '1983-05-25'
+  })
+}
+
+function testUrl({ url, title, text, counter }: { url: string; title: string; text: string; counter?: true }) {
+  test(url + ' (HTML)', async () => {
+    const html = await fetchHtml(url)
+    expect(html).toContain(text)
+    expect(getTitle(html)).toBe(title)
+  })
+  test(url + ' (Hydration)', async () => {
+    await page.goto(getServerUrl() + url)
+    const body = await page.textContent('body')
+    expect(body).toContain(text)
+    if (counter) {
+      await testCounter()
+    }
+  })
+}
+
+function getTitle(html: string) {
+  const title = html.match(/<title>(.*?)<\/title>/i)?.[1]
+  return title
+}
+
+async function testCounter() {
+  expect(await page.textContent('button')).toBe('Counter 0')
+  // autoRetry() for awaiting client-side code loading & executing
+  await autoRetry(async () => {
+    await page.click('button')
+    expect(await page.textContent('button')).toContain('Counter 1')
+  })
+}

package.json

@@ -5,10 +5,11 @@
     "========= Basics": "",
     "dev": "cd ./packages/vike-react/ && pnpm run dev",
     "build": "pnpm --recursive --filter {packages/*} run build",
-    "test": "cd ./packages/vike-react-query/ && pnpm run test",
-    "========= Release": "",
-    "release": "cd ./packages/vike-react/ && pnpm run release",
-    "release:commit": "cd ./packages/vike-react/ && pnpm run release:commit",
+    "========= Test": "",
+    "test": "pnpm run test:units && pnpm run test:e2e && pnpm run test:types",
+    "test:e2e": "test-e2e",
+    "test:units": "pnpm --recursive --sequential --filter {packages/*} run test",
+    "test:types": "test-types",
     "========= Clean": "",
     "clean": "git clean -Xdf",
     "reset": "pnpm run clean && pnpm install && pnpm run build",
@@ -17,6 +18,9 @@
     "format:prettier": "git ls-files | egrep '\\.(json|js|jsx|css|ts|tsx|vue|mjs|cjs)$' | grep --invert-match package.json | xargs pnpm exec prettier --write",
     "format:biome": "biome format --write .",
     "format:check": "biome format . || (echo 'Fix formatting by running `$ pnpm run -w format`.' && exit 1)",
+    "========= Release": "",
+    "release": "cd ./packages/vike-react/ && pnpm run release",
+    "release:commit": "cd ./packages/vike-react/ && pnpm run release:commit",
     "========= Only allow pnpm; forbid yarn & npm": "",
     "preinstall": "npx only-allow pnpm"
   },
@@ -29,6 +33,9 @@
   "packageManager": "pnpm@8.6.12",
   "devDependencies": {
     "@biomejs/biome": "^1.5.3",
+    "@brillout/test-e2e": "^0.5.29",
+    "@brillout/test-types": "^0.1.10",
+    "playwright": "^1.42.1",
     "prettier": "^3.2.5"
   }
 }