What problem does it solve? Automated tests and DOM metrics can pass while a rendered page still looks broken to a human. This Skill closes that gap by forcing screenshot-backed inspection of every user-visible surface a change touches before the work is called done. ## Core Features & Use Cases - Screenshot-backed verification: Captures every touched surface across desktop and narrow viewports, themes, and empty/loading/error states using tools like the Playwright MCP. - Absurdity ledger: Records each visual defect with screenshot path, viewport, user impact, and a disposition (ready, fixed, intentionally accepted, out of scope, needs review). - Fix-and-recapture loop: Patches the highest-signal defect, then re-captures evidence from the fixed build, with an optional subagent review gate for non-trivial changes. - Use Case: After refactoring a Next.js dashboard layout, render the affected routes at 1920x1080 and mobile widths, log a clipped sidebar and an unreadable contrast issue in the ledger, fix both, and attach fresh screenshots as proof. ## Quick Start Use the visual-qa-dogfood skill to screenshot every surface touched by this diff and report any visual defects before we call it done.
