mirror of
https://github.com/Memo-2023/mana-monorepo.git
synced 2026-05-14 16:41:08 +02:00
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>
55 lines
2 KiB
TypeScript
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.
|
|
});
|