Fingers crossed for working CI e2e tests

README.md

@@ -32,6 +32,8 @@ This project uses **pnpm** as the package manager. After cloning, run `pnpm inst
 | `pnpm run build`    | SvelteKit build → `dist/`, then Critters inlines critical CSS                  |
 | `pnpm run preview`  | Serve `dist/` (Critters-processed) at http://localhost:4173 — same as deployed |
 | `pnpm test`         | Run unit tests (Vitest)                                                        |
+| `pnpm run test:e2e` | Run Playwright visual regression (e2e)                                         |
+| `pnpm run test:e2e:update-snapshots` | Regenerate e2e snapshots in CI Docker image (see below)        |
 | `pnpm run lint`     | ESLint (JS/TS/Svelte)                                                          |
 | `pnpm run lint:css` | Stylelint (global CSS + Svelte styles)                                         |
 | `pnpm run format`   | Prettier (JS/TS/Svelte/CSS/JSON)                                               |
@@ -74,6 +76,20 @@ pnpm run dev
 
 The site is served at **http://localhost:5173** (or the port shown) with live reload (port forwarded automatically).
 
+### Visual regression (e2e)
+
+E2e tests use Playwright and compare full-page screenshots to committed snapshots. CI runs in `mcr.microsoft.com/playwright:v1.58.0-noble`; the **Linux** snapshot (`home-chromium-linux.png`) must be generated in that same environment or CI will fail (e.g. different height due to font/layout rendering).
+
+If CI fails with a snapshot mismatch (e.g. "Expected 1280×5985px, received 1280×5782px"):
+
+1. Regenerate the Linux snapshot in the CI Docker image:
+   ```bash
+   pnpm run test:e2e:update-snapshots
+   ```
+2. Commit the updated file(s) under `tests/visual.spec.ts-snapshots/`.
+
+Local `pnpm run test:e2e` uses the **Darwin** snapshot on macOS; the Linux snapshot is only used in CI.
+
 ### Option 4: Docker (Production-like Test)
 
 To test the production nginx image locally (same as deployed):

package.json

@@ -20,6 +20,7 @@
         "test": "vitest run",
         "test:unit": "vitest run",
         "test:e2e": "playwright test",
+        "test:e2e:update-snapshots": "bash scripts/update-e2e-snapshots.sh",
         "test:all": "vitest run && playwright test",
         "test:watch": "vitest"
     },

scripts/update-e2e-snapshots.sh

@@ -0,0 +1,41 @@
+#!/usr/bin/env bash
+# Regenerate Playwright visual regression snapshots.
+# - When Docker is available: runs in the same image as CI (Playwright Noble) for a CI-accurate baseline.
+# - When Docker is not available (e.g. devcontainer): runs Playwright in the current environment;
+#   the Linux snapshot may still differ slightly from CI — if CI fails, run this script on the host with Docker.
+set -e
+
+SCRIPT_DIR="${BASH_SOURCE%/*}"
+PROJECT_ROOT="${SCRIPT_DIR}/.."
+cd "$PROJECT_ROOT"
+
+if command -v docker >/dev/null 2>&1; then
+    PLAYWRIGHT_IMAGE="${PLAYWRIGHT_IMAGE:-mcr.microsoft.com/playwright:v1.58.0-noble}"
+    echo "Using Docker image: $PLAYWRIGHT_IMAGE (same as CI)"
+    echo "Project root: $PROJECT_ROOT"
+    echo ""
+
+    docker run --rm \
+      -v "$PROJECT_ROOT:/app" -w /app \
+      -e CI=1 \
+      "$PLAYWRIGHT_IMAGE" \
+      bash -c '
+        corepack enable && corepack prepare pnpm@10.28.2 --activate
+        pnpm install --frozen-lockfile || pnpm install
+        pnpm run build
+        npx serve dist -p 4173 &
+        sleep 2
+        pnpm exec playwright test --update-snapshots
+      '
+else
+    echo "Docker not found — updating snapshots in the current environment."
+    echo "If CI later fails with a snapshot mismatch, run this script on a host with Docker for a CI-accurate baseline."
+    echo ""
+
+    # Unset CI so Playwright config starts the preview server
+    unset CI
+    pnpm exec playwright test --update-snapshots
+fi
+
+echo ""
+echo "Snapshots updated. Commit the changed files under tests/visual.spec.ts-snapshots/ if needed."

site/assets/js/ga-init.js

@@ -1,8 +0,0 @@
-window.dataLayer = window.dataLayer || [];
-function gtag(){ window.dataLayer.push(arguments); }
-
-gtag("js", new Date());
-gtag("config", "G-36F29PDKRT", {
-    // optional, but often helpful:
-    anonymize_ip: true,
-});