skills.rest
SeemSeam
SeemSeamCOMMUNITY
Explore all skills by this author →
GitHub

browser-quality

Validate frontend quality with visual QA, responsive screenshots, accessibility, and performance metrics.

17|2|Updated Jun 2, 2026
Search Tags:#quality assurance#frontend#responsive design#visual testing#performance testing
One-click install
npx skills add https://github.com/SeemSeam/agent-roles-spec --skill browser-quality
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: browser-quality
Source: https://github.com/SeemSeam/agent-roles-spec/tree/main/roles/frontend-engineer/skills/browser-quality
Command: npx skills add https://github.com/SeemSeam/agent-roles-spec --skill browser-quality

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill provides a means to validate frontend quality claims with concrete evidence, such as visual QA, responsive screenshots, accessibility snapshots, and performance metrics.

Core Features & Use Cases

  • Visual QA: Inspects the target frontend across desktop and mobile viewports.
  • Responsive Screenshots: Captures images to review layout and design on various devices.
  • Accessibility: Uses browser evidence for accessibility checks.
  • Performance Metrics: Evaluates performance risks like LCP, INP, and CLS.
  • Use Case: Use this Skill to ensure that a frontend application meets quality standards before release.

Quick Start

Use the browser-quality skill to inspect the 'index.html' page for visual QA, responsive screenshots, and accessibility compliance.

Frequently Asked Questions about browser-quality

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

FAQPage Schema
How do I validate frontend quality across mobile and desktop viewports?▼

Frontend quality validation uses automated visual QA to inspect layout and interaction issues across viewports. It captures responsive screenshots and accessibility snapshots to provide concrete browser evidence for design review.

What is the best way to check frontend accessibility compliance using browser evidence?▼

Checking accessibility compliance uses browser APIs to capture accessibility snapshots within a testing framework. This evaluates the target frontend directly to identify layout and interaction barriers.

How do I measure frontend performance metrics like LCP, INP, and CLS?▼

Measuring frontend performance metrics like LCP, INP, and CLS requires running automated performance analysis within a browser environment. This evaluates performance risks to ensure the application meets quality standards before release.

Can I perform visual testing on an index.html file without external dependencies?▼

Performing visual testing on an index.html file is possible within a browser environment. The validation uses automated testing frameworks to identify layout and interaction issues without requiring external dependencies.

Does responsive design testing require access to specific browser APIs?▼

Responsive design testing requires access to browser APIs and testing frameworks. This access is necessary to execute the automated validation checks that capture responsive screenshots and evaluate layout risks.

Related Skills

Explore More Software Engineering Skills→
yunaameliayunaamelia

webapp-testing

Guide web application testing with Playwright for E2E, integration, and component tests.

Community
Intermediate
antriksh-29antriksh-29

qa-only

Generate structured QA reports with health scores, screenshots, and reproducible steps.

Community
Advanced
VidyaBodepudiVidyaBodepudi
2

frontend-ui-engineering

Review web components for accessibility, responsiveness, and performance.

Community
Advanced
TheGoat395TheGoat395
117

browser-inspection-workflow

Automate browser inspection for visual, functional, and performance issues.

Community
Intermediate