frontend-testing-debugging

Validates rendered frontend apps through Browser-first testing loops with Playwright fallback.

Updated Jul 31, 2026
One-click install
npx skills add https://github.com/AarnavBaddam/skills --skill frontend-testing-debugging-aarnavbaddam
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-testing-debugging
Source: https://github.com/AarnavBaddam/skills/tree/main/frontend-testing-debugging
Command: npx skills add https://github.com/AarnavBaddam/skills --skill frontend-testing-debugging-aarnavbaddam

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires playwright.

What problem does it solve? Rendered frontend changes often pass builds while hiding UI regressions, console errors, broken interactions, and responsive layout issues. This Skill enforces a structured validation loop that tests the actual rendered app before claiming a change works. ## Core Features & Use Cases - Browser-First Validation: Detects whether the Browser plugin is available and uses it for navigation, DOM snapshots, console logs, screenshots, and interaction checks, falling back to regular Playwright only with a recorded reason. - Structured QA Reporting: Produces a QA-style final report with pass/fail checks for page identity, blank-page detection, framework overlays, console health, screenshot evidence, and interaction proof. - Use Case: After editing a dashboard search component, run the validation loop to reload the page, exercise the search interaction, capture before/after screenshots, and deliver a reviewer-ready QA report. ## Quick Start Use the frontend testing skill to debug this localhost app and verify the broken interaction is fixed.

Frequently Asked Questions about frontend-testing-debugging

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
What checks should a frontend QA validation include?▼

Verify page URL and title, confirm the page is not blank, check for framework error overlays, review console errors and warnings, capture screenshot evidence, and exercise at least one target-flow interaction with a state check.