From 4fa108dd4867f6eff398c9481a93df0ce4c48eaa Mon Sep 17 00:00:00 2001 From: Danijel Martinek Date: Wed, 13 May 2026 08:24:55 +0200 Subject: [PATCH] docs(work): scaffold visual-regression-v1 epic + stories --- docs/work/_state.json | 67 ++++++++++++++++++- .../01-playwright-install/_story.md | 16 +++++ .../02-storybook-visual-tests/_story.md | 15 +++++ .../03-ci-integration/_story.md | 15 +++++ docs/work/visual-regression-v1/_epic.md | 27 ++++++++ 5 files changed, 137 insertions(+), 3 deletions(-) create mode 100644 docs/work/visual-regression-v1/01-playwright-install/_story.md create mode 100644 docs/work/visual-regression-v1/02-storybook-visual-tests/_story.md create mode 100644 docs/work/visual-regression-v1/03-ci-integration/_story.md create mode 100644 docs/work/visual-regression-v1/_epic.md diff --git a/docs/work/_state.json b/docs/work/_state.json index b21483a..90b6e2b 100644 --- a/docs/work/_state.json +++ b/docs/work/_state.json @@ -1,5 +1,5 @@ { - "updated_at": "2026-05-13T06:22:09.611Z", + "updated_at": "2026-05-13T06:24:57.743Z", "epics": { "agent-workflow-docs-v1": { "status": "done", @@ -306,6 +306,44 @@ } } }, + "visual-regression-v1": { + "status": "in-progress", + "title": "Visual regression v1 — Playwright screenshot infrastructure", + "stories": { + "01-playwright-install": { + "status": "in-progress", + "title": "Install @playwright/test + playwright.config.ts", + "ac_total": 3, + "ac_completed": 0, + "depends_on": [], + "blocks": [ + "02-storybook-visual-tests" + ] + }, + "02-storybook-visual-tests": { + "status": "todo", + "title": "Visual test harness in apps/storybook", + "ac_total": 2, + "ac_completed": 0, + "depends_on": [ + "01-playwright-install" + ], + "blocks": [ + "03-ci-integration" + ] + }, + "03-ci-integration": { + "status": "todo", + "title": "CI workflow runs pnpm test:visual", + "ac_total": 2, + "ac_completed": 0, + "depends_on": [ + "02-storybook-visual-tests" + ], + "blocks": [] + } + } + }, "work-system-v1": { "status": "done", "title": "Work system v1 (MVP) — state tracking + pnpm work CLI", @@ -321,6 +359,29 @@ } } }, - "ready": [], - "blocked": [] + "ready": [ + { + "epic": "visual-regression-v1", + "story": "01-playwright-install", + "title": "Install @playwright/test + playwright.config.ts" + } + ], + "blocked": [ + { + "epic": "visual-regression-v1", + "story": "02-storybook-visual-tests", + "title": "Visual test harness in apps/storybook", + "waiting_on": [ + "visual-regression-v1/01-playwright-install" + ] + }, + { + "epic": "visual-regression-v1", + "story": "03-ci-integration", + "title": "CI workflow runs pnpm test:visual", + "waiting_on": [ + "visual-regression-v1/02-storybook-visual-tests" + ] + } + ] } diff --git a/docs/work/visual-regression-v1/01-playwright-install/_story.md b/docs/work/visual-regression-v1/01-playwright-install/_story.md new file mode 100644 index 0000000..2966679 --- /dev/null +++ b/docs/work/visual-regression-v1/01-playwright-install/_story.md @@ -0,0 +1,16 @@ +--- +id: 01-playwright-install +epic: visual-regression-v1 +title: Install @playwright/test + playwright.config.ts +type: technical-story +status: in-progress +feature: tooling +depends-on: [] +blocks: [02-storybook-visual-tests] +--- + +## Tasks + +- [ ] Story scaffold +- [ ] Add @playwright/test to root devDependencies +- [ ] Create playwright.config.ts (single browser, fixed viewport, screenshot diff threshold) diff --git a/docs/work/visual-regression-v1/02-storybook-visual-tests/_story.md b/docs/work/visual-regression-v1/02-storybook-visual-tests/_story.md new file mode 100644 index 0000000..ff1711a --- /dev/null +++ b/docs/work/visual-regression-v1/02-storybook-visual-tests/_story.md @@ -0,0 +1,15 @@ +--- +id: 02-storybook-visual-tests +epic: visual-regression-v1 +title: Visual test harness in apps/storybook +type: technical-story +status: todo +feature: tooling +depends-on: [01-playwright-install] +blocks: [03-ci-integration] +--- + +## Tasks + +- [ ] apps/storybook/tests/visual.spec.ts — iterates Storybook's stories.json +- [ ] pnpm test:visual script at root diff --git a/docs/work/visual-regression-v1/03-ci-integration/_story.md b/docs/work/visual-regression-v1/03-ci-integration/_story.md new file mode 100644 index 0000000..7082ef9 --- /dev/null +++ b/docs/work/visual-regression-v1/03-ci-integration/_story.md @@ -0,0 +1,15 @@ +--- +id: 03-ci-integration +epic: visual-regression-v1 +title: CI workflow runs pnpm test:visual +type: technical-story +status: todo +feature: ci +depends-on: [02-storybook-visual-tests] +blocks: [] +--- + +## Tasks + +- [ ] Add visual regression step to .github/workflows/ci.yml +- [ ] Final verification + closeout diff --git a/docs/work/visual-regression-v1/_epic.md b/docs/work/visual-regression-v1/_epic.md new file mode 100644 index 0000000..8fc761b --- /dev/null +++ b/docs/work/visual-regression-v1/_epic.md @@ -0,0 +1,27 @@ +--- +id: visual-regression-v1 +prd: null +title: Visual regression v1 — Playwright screenshot infrastructure +type: epic +status: in-progress +features: [tooling, ci] +created: 2026-05-13 +--- + +## Goal + +Install Playwright and wire a screenshot test harness against Storybook so +the moment the first component+story lands, the visual regression gate +is already active. + +## Why + +Per the frontend-work-shape guide, visual regression is the CI gate that +locks in component appearance. Setting up the infrastructure now means +zero ramp-up when components arrive. + +## Stories + +- [ ] [01 — Install Playwright + config](01-playwright-install/_story.md) +- [ ] [02 — Storybook visual test harness](02-storybook-visual-tests/_story.md) +- [ ] [03 — CI integration](03-ci-integration/_story.md)