feat: add visual review workflow for automated PR screenshot comparison

Adds a label-triggered GitHub Actions workflow that automatically generates
before/after screenshots when web UI changes are made in a PR. Uses smart
dependency analysis to only screenshot pages affected by the changed files.

Key components:
- Reverse dependency analyzer: traces changed files through the import graph
  to find which +page.svelte routes are affected
- Screenshot scenarios: Playwright tests using existing mock-network infrastructure
  (no Docker/backend needed) for fast, deterministic screenshots
- Pixel comparison: generates diff images highlighting changed pixels
- GitHub Actions workflow: triggered by 'visual-review' label, posts results
  as a PR comment with change percentages per page

https://claude.ai/code/session_01XSTqDJXuR4jaLN7SGm3uES
This commit is contained in:
Claude
2026-02-26 13:17:50 +00:00
committed by Zack Pollard
parent f4e156494f
commit 5c11d15008
8 changed files with 1178 additions and 1 deletions
+4 -1
View File
@@ -18,7 +18,10 @@
"format:fix": "prettier --write .",
"lint": "eslint \"src/**/*.ts\" --max-warnings 0",
"lint:fix": "pnpm run lint --fix",
"check": "tsc --noEmit"
"check": "tsc --noEmit",
"screenshots": "pnpm exec playwright test --config playwright.screenshot.config.ts",
"screenshots:compare": "npx tsx src/screenshots/compare.ts",
"screenshots:analyze": "npx tsx src/screenshots/analyze-deps.ts"
},
"keywords": [],
"author": "",