What problem does it solve?
Rendered frontend changes often pass builds while still breaking visually or interactively in the browser. This Skill enforces a structured validation loop for local dev servers, UI regressions, interaction bugs, console errors, responsive layout, and visual QA so fixes are verified against the actual rendered app.
Core Features & Use Cases
- Browser-first validation: Detects whether the Browser plugin is available and uses its tab, DOM snapshot, console log, and screenshot APIs before falling back to regular Playwright with a recorded reason.
- Required rendered checks: Verifies page identity, non-blank content, absence of framework error overlays, console health, screenshot evidence, and at least one exercised interaction.
- Structured QA report: Produces a final response with summary, environment, pass/fail check table, interaction loop, evidence screenshots, and remaining risks.
- Use Case: After editing a dashboard search filter, run the loop to reload the page, exercise the filter, capture screenshots on desktop and mobile viewports, and confirm no console errors before reporting the fix.
Quick Start
Use the frontend testing skill to debug this localhost app and fix the broken interaction, then show me the QA report with screenshots.