mcpField
A
agent-browser

agent-browser

github.com/emdash-cmsTesting & quality14.1k65 installsUpdated today
Repository

About agent-browser

agent-browser is a skill guide for verifying rendered interfaces with the installed agent-browser CLI. It describes an evidence-driven interaction loop using accessibility snapshots, observable results, console and network checks, and screenshots.

Key features

  1. 01Load version-matched CLI instructions
  2. 02Inspect interfaces with accessibility snapshots
  3. 03Interact using roles and labels
  4. 04Check console errors and network requests
  5. 05Capture and inspect screenshots

Use cases

  1. 01Verify a user-facing page after a UI change
  2. 02Test a flow that depends on session state
  3. 03Collect visual and behavioral evidence for a test

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/emdash-cms/emdash --skill agent-browser

After installing, type/agent-browserin Claude Code to confirm it loaded.

Details

From the project README

Test interfaces with agent-browser

Use the installed agent-browser CLI for rendered, user-facing verification. Load its version-matched instructions before relying on command syntax:

agent-browser skills get core --full

Use a specialized bundled guide when the target requires one. agent-browser skills list shows the available guides.

Verification loop

  1. Start or identify the target application and record the exact URL and viewport.
  2. Open the page in a named session.
  3. Take an accessibility snapshot and identify controls by role, label, or snapshot reference.
  4. Perform the user action.
  5. Wait for the resulting state, then take a fresh snapshot. References can become stale after navigation or a substantial DOM update.
  6. Verify the observable result, console errors, and relevant network behavior.
  7. Capture screenshots when visual evidence helps establish the result.

For EmDash admin testing, authenticate through the development bypass rather than attempting to automate passkeys:

agent-browser open 'http://localhost:4321/_emdash/api/setup/dev-bypass?redirect=/_emdash/admin'

Use auth/dev-bypass instead when setup is already complete.

Interaction guidance

  • Prefer role and label locators when they express the user-facing control clearly. Use snapshot references for efficient exploration.
  • Re-snapshot after a dialog opens, a route changes, or content is replaced.
  • Wait for a selector or visible state instead of adding a fixed delay unless timing itself is under test.
  • Use a named session for flows that depend on cookies or storage. Close sessions that are no longer needed.
  • Check agent-browser console and agent-browser errors when the UI behaves unexpectedly.
  • Use agent-browser network requests when the result depends on a request or response boundary.

Evidence

Record the path tested, inputs, viewport, expected result, actual result, and any console or request failures. For UI changes, capture before-and-after screenshots of every affected screen.

Save screenshots inside the task workspace with descriptive filenames. Inspect the saved image before reporting success; a completed screenshot command does not prove that the intended state was visible.

Browser exploration does not replace a regression test when stable automated coverage can protect the behavior. Convert a confirmed defect into the narrowest meaningful automated test when the task includes implementation.

Comments

Markdown supported