dev-browser

Control a Chrome browser to validate frontend features via manual UI interactions.

1|Updated Jul 11, 2019
One-click install
npx skills add https://github.com/crsiebler/dotfiles --skill dev-browser-crsiebler
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: dev-browser
Source: https://github.com/crsiebler/dotfiles/tree/main/ai/opencode/skills/dev-browser
Command: npx skills add https://github.com/crsiebler/dotfiles --skill dev-browser-crsiebler

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Helps QA and frontend teams verify UI behavior by interacting with a live browser, ensuring features render correctly and interact as expected.

Core Features & Use Cases

  • Initialize: Launch the browser and navigate to the local or remote URL.
  • Interact: Use click, type, or scroll tools to simulate user behavior for the new feature.
  • Inspect: Use take_snapshot to view the Accessibility Tree and the UI state.
  • Validate: Check the Console for errors and the Network tab for API calls.

Quick Start

Launch the browser, navigate to the target URL, and begin manual verification of the new feature.

Frequently Asked Questions about dev-browser

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

FAQPage Schema
How do I manually verify frontend features in a live browser?

To manually verify frontend features, you need a chrome MCP server, a stable app URL, and explicit success criteria. The Skill launches the browser, loads pages, simulates user interactions like clicks and typing, and captures UI behavior results end-to-end.

Can I check the Accessibility Tree and console errors during manual UI testing?

Yes, during manual UI testing you can inspect the Accessibility Tree and UI state using a snapshot tool. You can also validate frontend debugging by checking the browser Console for errors and the Network tab for API calls.

What do I need to set up before performing manual browser QA?

Before performing manual browser QA, you must configure a chrome MCP server, ensure your local or remote application URL is stable, and define explicit success criteria to guide feature verification interactions and result capture.

How do I simulate user behavior for local or remote frontend debugging?

You simulate user behavior for frontend debugging by initializing the browser, navigating to the target URL, and using click, type, or scroll tools to interact with the UI, ensuring features render and interact as expected.

Does manual browser QA work for both local and remote environments?

Manual browser QA works across both local and remote environments. You launch the browser, navigate to the local or remote URL, and begin manual verification of the new feature to ensure it renders correctly and interacts as expected.