What problem does it solve? UI changes often get declared done after a successful compile, leaving broken layouts, console errors, and theme or viewport regressions undiscovered until review. This Skill enforces a repeatable verification workflow that produces visual evidence before any UI change is reported as complete. ## Core Features & Use Cases - End-to-end verification workflow: Boots the app on a dedicated port, interacts with the change via a throwaway Playwright spec, and asserts real state changes rather than mere visibility. - Screenshot evidence matrix: Captures before/after shots across light and dark themes and desktop and phone viewports, with animations disabled and time elements masked for stable images. - Guardrail test integration: Runs the relevant e2e spec, visual inventory tests, and responsive tests, and fails verification on any new console error or warning. - Use Case: After editing a React component that changes a settings page layout, use this Skill to boot the app, click through the new layout, capture light/dark and desktop/phone screenshots, confirm zero console errors, and attach the evidence to the PR. ## Quick Start Verify the UI change I just made to the settings page by booting the app, interacting with it in Playwright, and capturing before and after screenshots in light and dark mode.
