Frontend Visual Qa
ytvee-dev/webdev-agent-kitVerify rendered frontend evidence after implementation, including screenshot comparison, responsiveness, overflow, visible states, and scoped visual regression. Use available browser tooling only; exclude static lookup, routine code review, lint, builds, onboarding, and tool detection.
At a glance
This skill is for Code Review & Testing and helps you compare screenshots for visual changes, verify responsive design across breakpoints, and detect visual overflow and layout issues.
/plugin marketplace add ytvee-dev/webdev-agent-kit
/plugin install frontend-visual-qa
Setup, runtime and requirements describe ytvee-dev/webdev-agent-kit, the repo this skill ships in.
Screenshot ComparisonResponsive DesignVisual TestingBrowser ToolingFrontend QaRegression
Also in ytvee-dev/webdev-agent-kit
View the repoCreate, evaluate, or edit this .agents WebDev Agent Kit, including AGENTS.md, common/**, project/**, skills/**, metadata, validators, and pr...
Turn user-supplied screenshots, copied inspect values, exports, assets, or design notes into a strict frontend Design Implementation Spec. L...
Create, resume, analyze, or converge standard and deep frontend execution plans with traceable slices, evidence, and stop/resume state. Skip...
Plan architecture and ownership for standard or deep React/Next.js work across routing, state, data, styling, forms, builds, migrations, and...
Diagnose and fix frontend defects from evidence, including unclear UI/runtime errors, broken routes, styling regressions, and hydration or c...
Set subject-grounded visual direction for standard or deep UI work, redesign, polish, critique, anti-template review, or design handoff. Ski...
Ground standard or deep UI work in product category, page pattern, design dials, domain UX risks, and anti-patterns before visual direction....
Implement an approved Design Implementation Spec or screenshot-derived spec in React/Next.js using existing CSS Modules, Redux, TanStack, an...
Run scoped frontend lint verification, repair related lint failures, or plan explicitly requested lint setup. Prefer existing commands; depe...
Review frontend quality from evidence across code, UI, architecture, TypeScript, security, performance, verification, decomposition, UX, and...
Perform bounded, behavior-preserving frontend refactors such as component extraction, file moves, prop or interface cleanup, state simplific...
Define user goal, scope, constraints, and done criteria before standard or deep frontend work. Skip micro-fixes, obvious type errors, tiny s...
Other Code Review & Testing skills
Migrate test files from `as` type assertions to @total-typescript/shoehorn. Use when user mentions shoehorn, wants to replace `as` in tests,...
A relentless interview to sharpen a plan or design, which also creates docs (ADR's and glossary) as we go.
Move issues and external PRs through a state machine of triage roles — categorise, verify, grill if needed, and write agent-ready briefs.
Create exercise directory structures with sections, problems, solutions, and explainers that pass linting. Use when user wants to scaffold e...
Use when you need to resolve an in-progress git merge/rebase conflict.
A relentless interview that asks every frontier question at once, round by round.