skills.rest
samymity
samymityCOMMUNITY
Explore all skills by this author →
GitHub

Browser QA — Automated Visual Testing & Interaction

Automate browser navigation, form, auth, and journey checks on a target URL.

1|Updated Mar 3, 2026
Search Tags:#accessibility#browser automation#playwright#ui testing#visual regression#core web vitals#staging verification
One-click install
npx skills add https://github.com/samymity/bridge-ventures-backend --skill browser-qa-automated-visual-testing-interaction
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: Browser QA — Automated Visual Testing & Interaction
Source: https://github.com/samymity/bridge-ventures-backend/tree/main/.claude/skills/browser-qa
Command: npx skills add https://github.com/samymity/bridge-ventures-backend --skill browser-qa-automated-visual-testing-interaction

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Prevents broken frontend behavior from reaching users by validating that pages render correctly, interactions work as expected, and accessibility requirements are met after changes.

Core Features & Use Cases

  • Smoke testing on live pages: Detects console issues, verifies HTTP/network health, validates Core Web Vitals, and captures above-the-fold screenshots on desktop and mobile viewports.
  • Interaction testing across critical flows: Exercises navigation links, form submissions (valid and invalid), and authentication journeys, then validates key user journeys.
  • Visual regression and accessibility checks: Compares screenshot breakpoints against baselines when available, flags layout problems and overflow, and runs axe-core (or equivalent) to find WCAG AA issues and keyboard/screen-reader problems.

Use case: After deploying a frontend change to staging, run this workflow to ensure the checkout and onboarding flows work, the UI doesn’t shift unexpectedly across viewports, and key accessibility failures are caught early.

Quick Start

Use the Browser QA workflow on your staging URL to run smoke, interaction, visual regression (multi-breakpoint), and accessibility checks, then return a verdict with any issues found.

Frequently Asked Questions about Browser QA — Automated Visual Testing & Interaction

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

FAQPage Schema
How do I automate visual regression and accessibility checks on a staging URL?▼

Automated visual regression and accessibility checks run by navigating real-user journeys on a target staging URL, capturing multi-breakpoint screenshots for baseline comparison, and executing axe-core to flag WCAG AA violations. This validates UI correctness before release.

How does browser automation test critical frontend flows like auth and form submissions?▼

Browser automation tests critical frontend flows by exercising real-user interactions via a browser MCP, navigating links, submitting valid and invalid forms, and running authentication journeys to verify expected behavior and page correctness.

Can I capture Core Web Vitals and console errors during UI testing?▼

Yes, capturing Core Web Vitals and console errors during UI testing is a core smoke testing feature. The workflow automates navigation on live pages to collect network health data, validate vitals, and detect console issues across desktop and mobile viewports.

Do I need a browser MCP to run Playwright-style accessibility audits?▼

Yes, a browser MCP is required to run Playwright-style accessibility audits. The workflow relies on browser automation via a browser MCP to navigate pages, interact with elements, and execute axe-core or equivalent tools to detect keyboard and screen-reader issues.

What's the best way to catch UI layout shifts and overflow across responsive breakpoints?▼

The best way to catch UI layout shifts and overflow across responsive breakpoints is automated visual regression detection. The workflow captures above-the-fold screenshots at common desktop and mobile breakpoints and compares them against baselines to flag layout problems.

When should I run staging verification for frontend changes?▼

Staging verification for frontend changes should run after deploying to staging or during PR review. The workflow validates that critical user journeys like checkout and onboarding work, ensuring UI correctness and accessibility before reaching production users.

Related Skills

Explore More Software Engineering Skills→
Davie521Davie521
7

browser-qa

Automate browser-based visual QA and accessibility checks on live web pages.

Community
Advanced
gsarmaonlinegsarmaonline

review-comments

Analyze pull request review comments and resolve failing GitHub Actions checks.

Community
Advanced
fideguchfideguch
1

playwright-skill

Automate Playwright browser tasks with auto-detected dev servers and scripts in /tmp.

Community
Advanced
omarrohit20omarrohit20

Axe-core Accessibility

Automate axe-core accessibility scans with Playwright for WCAG 2.1 AA compliance.

Community
Advanced