browser-test

Verifies frontend and backend changes through real-browser regression checks via chrome-devtools MCP.

Updated Jul 24, 2026
One-click install
npx skills add https://github.com/shoji9x9/portfolio --skill browser-test-shoji9x9
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: browser-test
Source: https://github.com/shoji9x9/portfolio/tree/main/.agents/skills/browser-test
Command: npx skills add https://github.com/shoji9x9/portfolio --skill browser-test-shoji9x9

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Code changes can silently break page rendering, console output, API responses, or component behavior, and manually clicking through every affected page after each change is slow and error-prone. This Skill automates regression verification in a real browser while enforcing strict safety rules around destructive or billable actions. ## Core Features & Use Cases - Scope-driven impact analysis: Derives affected pages from uncommitted changes, branch diffs, or custom targets by mapping changed files to router definitions and reverse-looking-up API consumers. - Real-browser verification: Uses chrome-devtools MCP to navigate pages, check console for errors and warnings, inspect snapshots and network requests, and exercise side-effect-free interactions. - Safety-gated operations: Honors per-environment forbidden_actions, treats undefined environments as read-only, and requires user approval before any create/update/delete, billing, or notification action. - Cross-environment triage: Reproduces discovered issues on an environment without the changes to determine whether they are change-caused, pre-existing, or environment-caused. - Use Case: After modifying a shared UI component and an API handler, run the Skill to identify all impacted pages, confirm console cleanliness and correct rendering on each, and receive a report table of check items × pages × results. ## Quick Start Ask the AI to run browser-test to verify in the browser that your current uncommitted changes cause no regressions on the affected pages.

Frequently Asked Questions about browser-test

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

FAQPage Schema
How do I run browser regression tests on my code changes?▼

Invoke browser-test with a scope such as uncommitted changes or a branch diff. The Skill maps changed files to affected pages via router definitions, then opens each page in a real browser through chrome-devtools MCP to check console errors, rendering, and interactions.

How to verify backend API changes through the UI?▼

The Skill identifies the API paths exposed by changed handlers, then reverse-looks-up the screens that call them. It checks data display correctness, empty states, error handling, and network request statuses on those pages without triggering side-effecting APIs without approval.

Does browser-test work without chrome-devtools MCP?▼

No, chrome-devtools MCP is a hard prerequisite. If it is disabled or unconfigured, the Skill prompts you to enable it and aborts, but first records the planned verification targets and check items so the session can resume later.

Can browser-test click delete or save buttons during verification?▼

Side-effecting operations like create, update, delete, billing, or notifications require explicit user approval before execution. Actions listed in an environment's forbidden_actions are never performed unless you pass --ignore-forbidden-actions, and undefined environments are treated as read-only.

How do I configure environments for browser-test?▼

Run browser-test setup to interactively record environments, startup commands, authentication, and forbidden actions into .config/skills/shoji9x9/skills.yml. Without configuration, the Skill infers settings from package.json scripts and README files, then confirms with you.

Why does browser-test ask me to start the dev server myself?▼

The Skill never auto-executes pre_commands or start commands to avoid triggering builds or code generation without approval. It first checks liveness via check_urls with curl, and only if the server is down does it present the commands for you to run.