메뉴
Browser automation CLI for AI agents. Use for website interaction, form automation, screenshots, scraping, and web app verification. Prefer snapshot refs (@e1, @e2) for deterministic actions.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Accessibility testing for web applications using Playwright (@playwright/test) with TypeScript and axe-core. Use when asked to write, run, or debug automated accessibility checks, keyboard navigation tests, focus management, ARIA/semantic validations, screen reader compatibility, or WCAG 2.1 Level AA compliance testing. Covers axe-core integration, POUR principles (perceivable, operable, understandable, robust), color contrast, form labels, landmarks, and accessible names.
To ensure the application is usable by people with disabilities, complying with WCAG standards and improving SEO/UX. Use when: During development of UI components; Before major releases.
Accessibility testing toolkit using Selenium WebDriver 4+ with Java 21+ and axe-core engine. Use when asked to validate WCAG 2.1/2.2 compliance, scan pages or components for a11y violations, test keyboard navigation, audit color contrast, check ARIA semantics, generate accessibility reports, filter axe rules, debug screen reader issues, or implement POUR principles (perceivable, operable, understandable, robust).
To allow incompatible interfaces to work together by wrapping an object in an adapter that translates its interface into one that a client expects. Use when: When integrating a third-party library whose interface doesn't match your application's internal requirements; When you want to standardize multiple different implementations of a service (e.g., different payment gateways); When you need to provide a stable interface while the underlying dependency is subject to change.
To implement a scalable permission system where users have roles, and roles have granular permissions. Use when: B2B SaaS applications (Admin, Editor, Viewer); Systems with complex access requirements.
Visual UI annotation tool for AI agents. Drop the React toolbar into any app — humans click elements and leave feedback, agents receive structured CSS selectors, bounding boxes, and React component trees to find exact code. Supports MCP watch-loop, platform-specific hooks (Claude Code / Codex / Gemini CLI / OpenCode), webhook delivery, and autonomous self-driving critique with agent-browser.
| name | agent-browser |
| description | Browser automation CLI for AI agents. Use for website interaction, form automation, screenshots, scraping, and web app verification. Prefer snapshot refs (@e1, @e2) for deterministic actions. |
| allowed-tools | Read Write Bash Grep Glob |
| metadata | {"tags":"browser-automation, headless-browser, ai-agent, web-testing, web-scraping, verification","platforms":"Claude, Gemini, Codex, ChatGPT","version":"1.1.0","source":"vercel-labs/agent-browser"} |
Always use the deterministic ref loop:
agent-browser open <url>agent-browser snapshot -i@e1, @e2, ...)agent-browser snapshot -i again after page/DOM changesagent-browser open https://example.com/form
agent-browser wait --load networkidle
agent-browser snapshot -i
agent-browser fill @e1 "user@example.com"
agent-browser click @e2
agent-browser snapshot -i
Use && chaining when intermediate output is not needed.
# Good chaining: open -> wait -> snapshot
agent-browser open https://example.com && agent-browser wait --load networkidle && agent-browser snapshot -i
# Separate calls when output is needed first
agent-browser snapshot -i
# parse refs
agent-browser click @e2
High-value commands:
open, closesnapshot -i, snapshot -i -C, snapshot -s "#selector"click, fill, type, select, check, pressdiff snapshot, diff screenshot --baseline <file>screenshot, screenshot --annotate, pdfwait --load networkidle, wait <selector|@ref|ms>Use explicit evidence after actions.
# Baseline -> action -> verify structure
agent-browser snapshot -i
agent-browser click @e3
agent-browser diff snapshot
# Visual regression
agent-browser screenshot baseline.png
agent-browser click @e5
agent-browser diff screenshot --baseline baseline.png
wait --load networkidle or selector/ref waits over fixed sleeps.eval --stdin (or base64) to avoid shell escaping breakage.--session <name>.Optional hardening examples:
# Wrap page content with boundaries to reduce prompt-injection risk
export AGENT_BROWSER_CONTENT_BOUNDARIES=1
# Limit output volume for long pages
export AGENT_BROWSER_MAX_OUTPUT=50000
# Restrict navigation and network to trusted domains
export AGENT_BROWSER_ALLOWED_DOMAINS="example.com,*.example.com"
# Restrict allowed action types
export AGENT_BROWSER_ACTION_POLICY=./policy.json
Example policy.json:
{"default":"deny","allow":["navigate","snapshot","click","fill","scroll","wait","get"],"deny":["eval","download","upload","network","state"]}
CLI-flag equivalent:
agent-browser --content-boundaries --max-output 50000 --allowed-domains "example.com,*.example.com" --action-policy ./policy.json open https://example.com
command not found: install and run agent-browser install.snapshot -i again and use fresh refs.--load networkidle or targeted wait selector.--session names and close each session.-i, -c, -d, -s) and extract only needed text.Deep-dive docs in this skill:
Related resources:
Ready templates:
./templates/form-automation.sh./templates/capture-workflow.sh