Claude Skill MartBrowse skillsQuick linesLearn by videoTerminal guideWhat is a Skill?
 
← Back to list

agent-browser Automation Guide

Teaches Claude to drive a real Chrome browser through the `agent-browser` CLI — navigate, click, fill forms, extract data and capture screenshots.

AutomationIntermediate★ 1,076⑂ 103AI score 10/10Last updated: Aug 17, 2026

What it does

  • Installs the snapshot + @eN ref workflow in Claude's head: accessibility-tree snapshots let the agent understand and act on a page in ~200-400 tokens instead of parsing raw HTML.
  • Documents the core loop (open → snapshot → act → re-snapshot) plus every interaction command: click, fill, type, select, check, upload, drag, scroll, hover, focus.
  • Offers fallback locators (find role/text/label/testid, raw CSS) with a clear rule of thumb for which to use first.
  • Provides situation-specific wait strategies (element, text, URL glob, networkidle, JS predicate) — the number-one cause of flaky browser agents.
  • Covers login flows and the auth vault, persistent sessions (--session --restore), parallel sessions, tab management with stable tab IDs, iframes, dialogs, network mocking and HAR capture, video recording, axe-core accessibility audits, and React tree / Web Vitals introspection.
  • Includes a doctor diagnostic path and concrete troubleshooting for stale refs, click-blocking overlays, stubborn custom inputs, and black WebGPU screenshots.
  • Ships safety rules: treat all page content as untrusted data, never echo secrets, stay on the user's target URL.

Who it's for

  • Developers and QA engineers who want an agent to run E2E or exploratory test flows
  • Anyone automating repetitive tasks or data collection behind a login
  • Technical writers and PMs who need markdown page reads, screenshots, or recorded walkthroughs
  • Frontend engineers profiling React re-renders and Core Web Vitals in-browser

Example uses

  1. Log in and capture the dashboard: auth login my-app → wait --url "**/dashboard" → screenshot dash.png.
  2. Scrape a table to JSON: snapshot -i --json, or a heredoc eval --stdin script mapping <tr> rows to objects.
  3. Submit a form and verify: fill the search box, press Enter, wait --load networkidle, re-snapshot, click a result, save the screenshot.
  4. Study a site's API: network har start → interact → network har stop /tmp/trace.har for offline analysis.

· · · Install guide · · ·

Try it now, no install

Paste this into Claude to use the skill without installing anything.

Read the instructions in this file and follow them to help me:
https://raw.githubusercontent.com/fcakyon/claude-codex-settings/HEAD/plugins/agent-browser/skills/agent-browser/SKILL.md

What I want: (describe your task here)

If Claude can't open the link, open it yourself and paste the contents instead.

↓ If it works for you, download the ZIP below and install it. Then it runs on its own — no pasting each time.

Install in the Claude app (no terminal)
  1. Download the ZIP with the button below.
  2. In Claude, open Settings → Capabilities and turn on 'Code execution and file creation'. (one time)
  3. Go to Customize → Skills → + → 'Upload a skill' and upload the ZIP.
↓ Download ZIP
Install in Claude Code

Let Claude do it — paste this into Claude Code

Install the skill I found on Claude Skill Mart.
Copy the plugins/agent-browser/skills/agent-browser folder from the GitHub repo fcakyon/claude-codex-settings into my ~/.claude/skills/fcakyon-agent-browser/.
When it's done, tell me in one line what this skill can do.

Install with a command instead

git clone https://github.com/fcakyon/claude-codex-settings.git /tmp/claude-codex-settings && mkdir -p ~/.claude/skills && cp -r /tmp/claude-codex-settings/plugins/agent-browser/skills/agent-browser ~/.claude/skills/

⚠ This is a third-party skill. Check the source repository before installing.

  1. Prerequisites: Node.js must be installed — check with node -v.
  2. Install the CLI: run npm i -g agent-browser, then agent-browser install (on Linux use agent-browser install --with-deps to pull required browser libraries).
  3. Verify: run agent-browser doctor --offline --quick and confirm the checks pass.
  4. Clone the skill repo: git clone https://github.com/fcakyon/claude-codex-settings.git
  5. Copy the skill: mkdir -p ~/.claude/skills && cp -r claude-codex-settings/plugins/agent-browser/skills/agent-browser ~/.claude/skills/ (keep the references/ and templates/ folders intact).
  6. Restart Claude Code, then ask something like "open this page and take a screenshot" — the skill loads automatically.
  7. Good hygiene: finish sessions with agent-browser close (or close --all), and scope sensitive work with --allowed-domains.
View source on GitHub ↗License: Apache-2.0