ci: update ci.yml to separate unit and e2e tests

.env.test

@@ -2,7 +2,7 @@
 NODE_ENV=test
 # DATABASE_URL is not actually used in tests, but prisma will complain if the URL is incorrect
 # pglite is used in tests instead.
-DATABASE_URL=postgres://root:root@localhost:5432/test
+DATABASE_URL="postgres://root:root@localhost:5432/test"
 SESSION_SECRET=random_session_secret_that_is_at_least_32_characters
 
 OTP_EXPIRY=600

.github/workflows/ci.yml

@@ -0,0 +1,91 @@
+name: CI
+
+on:
+  push:
+    branches:
+      - main
+      # add more branches here for this job to run on
+      # - staging
+      # - production
+  pull_request:
+    types: [opened, synchronize]
+
+jobs:
+  install:
+    name: Install dependencies
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: 'npm'
+      - run: npm ci
+
+  unit-integration-tests:
+    name: Unit & integration tests
+    needs:
+      - install
+    timeout-minutes: 15
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: 'npm'
+      - run: npm ci
+      - name: Test
+        run: npm run test:vitest
+
+  end-to-end-tests:
+    name: End-to-end tests
+    needs:
+      - install
+    timeout-minutes: 15
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: 'npm'
+      - run: npm ci
+      - name: Install Playwright (Chromium)
+        run: npx playwright install chromium
+      - name: Load .env file
+        uses: xom9ikk/dotenv@v2
+        with:
+          mode: test
+      - name: Next.js cache
+        uses: actions/cache@v4
+        with:
+          # See here for caching with `yarn` https://github.com/actions/cache/blob/main/examples.md#node---yarn or you can leverage caching with actions/setup-node https://github.com/actions/setup-node
+          path: |
+            ~/.npm
+            ${{ github.workspace }}/.next/cache
+          # Generate a new cache whenever packages or source files change.
+          key: ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json') }}-${{ hashFiles('**/*.js', '**/*.jsx', '**/*.ts', '**/*.tsx') }}
+          # If source files changed but packages didn't, rebuild from a prior cache.
+          restore-keys: |
+            ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json') }}-
+
+      - name: Build app
+        run: npm run build
+
+      - name: Start test containers
+        run: npm run setup:test
+
+      - name: Run Playwright tests
+        run: npm run test-ci:e2e
+
+      - name: Stop test containers
+        run: npm run teardown
+
+      - name: Upload test results
+        if: ${{ !cancelled() }}
+        uses: actions/upload-artifact@v4
+        with:
+          name: playwright-report
+          path: playwright-report/
+          retention-days: 7

package.json

@@ -21,12 +21,12 @@
     "migrate:dev": "prisma migrate dev",
     "migrate": "prisma migrate deploy",
     "test": "run-s test:*",
-    "test:unit": "dotenv -e .env.test vitest run",
-    "test:load:build": "webpack --config tests/load/webpack.config.js",
+    "test:vitest": "dotenv -e .env.test vitest run",
+    "test-dev:vitest": "dotenv -e .env.test vitest",
     "test:e2e": "dotenv -e .env.test playwright test",
-    "test-dev": "start-server-and-test dev http://127.0.0.1:3000 test",
-    "test-dev:unit": "dotenv -e .env.test vitest",
-    "test-start": "start-server-and-test start http://127.0.0.1:3000 test",
+    "test-ci:e2e": "start-server-and-test start http://127.0.0.1:3000 test:e2e",
+    "test-dev:e2e": "start-server-and-test dev http://127.0.0.1:3000 test:e2e",
+    "load-test:build": "webpack --config tests/load/webpack.config.js",
     "postinstall": "npm run generate && npm run build:theme",
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build"