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):