managarten/tests/personas/playwright.config.ts
Till JS 79d112657c feat(personas): M5.a — Playwright visual suite scaffold
Smallest possible foundation for the persona-driven visual regression
suite (M5 in docs/plans/mana-mcp-and-personas.md). One flow, two
viewports, one persona — enough to prove the stack end-to-end:
seed-script → mana-auth → API login → cookie injection → web app →
screenshot → disk. Extending is copy-paste per flow.

tests/personas/
  playwright.config.ts
    Own config separate from the root tests/e2e/ suite. Two viewports
    (1440×900 desktop Chrome + Pixel 5 mobile) — more can be added
    once baselines settle without quadrupling the review load.
    Diff threshold 0.2 %, animations disabled, snapshots land under
    __snapshots__/{spec}/{arg}-{project}.png. No auto-webServer —
    the whole point is to catch regressions against the real stack
    the user runs, not a hermetic one; if the stack is down, tests
    fail loud.

  fixtures/persona-auth.ts
    Typed Playwright `test.extend` with a `personaKey` worker option
    and a `personaPage` fixture that returns a pre-logged-in Page
    pointed at `/`. Login is API-side: POST /api/v1/auth/login with
    the deterministic HMAC-SHA256 password, parse Set-Cookie headers,
    inject into the browser context. Derivation is a bit-identical
    mirror of scripts/personas/password.ts and
    services/mana-persona-runner/src/password.ts — a 3-way contract.
    Changing one without the others locks the suite out of every
    persona. PERSONAS map exports all 10 catalog emails for typed
    access.

  flows/home.spec.ts
    One smoke flow. Asserts the persona isn't redirected to /login,
    hides any [data-testid="live-time"] so clock widgets don't
    invalidate diffs, captures a full-page screenshot. When this
    goes green, the whole pipeline is plumbed. Copy this file to
    add per-module tours.

  package.json
    @mana/tests-personas workspace. Scripts: `test`, `test:update`,
    `report` (HTML diff viewer).

  README.md
    Prerequisites (stack up + seeded + ideally persona-runner ticked
    once), run recipe, env vars, architecture diagram, extension
    pattern.

root package.json: `pnpm test:personas` + `:update`.
.gitignore: playwright-report-personas/ + test-results/ so generated
artefacts never get committed.

Type-check / list: `playwright test --list` succeeds, 2 tests (one
per viewport) registered for home.spec.ts.

Not attempted in this commit (user action to run the stack):
- Actual baseline capture (needs docker up + db:push + seed:personas
  + ANTHROPIC_API_KEY + diag/tick).
- Additional flows (todo, journal, notes, habits, calendar). They're
  copy-paste per README. Land when the stack is smoked.
- Nightly CI job. Will land once baselines are stable.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-23 14:33:06 +02:00

55 lines
2 KiB
TypeScript

/**
* Persona visual regression suite.
*
* Separate from the repo's main Playwright config (`../../playwright.config.ts`)
* because this suite has different defaults: fewer viewports (baselines
* cost disk + review time), tighter diff threshold, and a deterministic
* animation/font-loading setup so the same code produces the same
* pixels across runs.
*
* Plan: docs/plans/mana-mcp-and-personas.md (M5).
*/
import { defineConfig, devices } from '@playwright/test';
const BASE = process.env.PERSONAS_BASE_URL ?? 'http://localhost:5173';
export default defineConfig({
testDir: './flows',
// Baselines are stable across OS as long as `--project=…` is pinned
// and the server is the same. Diff threshold is tight; expect a few
// real-UI-change updates per week.
expect: {
toHaveScreenshot: {
maxDiffPixelRatio: 0.002,
animations: 'disabled',
},
},
snapshotPathTemplate: '{testDir}/__snapshots__/{testFilePath}/{arg}-{projectName}{ext}',
fullyParallel: true,
forbidOnly: !!process.env.CI,
retries: process.env.CI ? 1 : 0,
// Avoid cross-contamination — each persona has its own storageState,
// running in parallel is safe but keep it modest to not thrash mana-auth.
workers: process.env.CI ? 2 : undefined,
reporter: [['html', { outputFolder: 'playwright-report-personas' }], ['list']],
use: {
baseURL: BASE,
trace: 'retain-on-failure',
screenshot: 'only-on-failure',
video: 'retain-on-failure',
},
// Two viewports as a starting point — one desktop, one mobile. Add
// more later (iPad, large desktop) once the baselines are stable.
projects: [
{
name: 'desktop',
use: { ...devices['Desktop Chrome'], viewport: { width: 1440, height: 900 } },
},
{ name: 'mobile', use: { ...devices['Pixel 5'] } },
],
// webServer stays OFF here — this suite expects the full local stack
// (mana-auth, mana-sync, web app) to already be running. Persona
// tests assume real data has been seeded; auto-starting only the web
// app would give a meaningless pass. Run-recipe lives in README.md.
});