AgentAlley

Skills · Coding

Browser Automation Skill

Unverified●29/40

Web browser automation with AI-optimized snapshots for claude-flow agents

Originally by ruvnet · MIT

Claude Code◐PartialHas SKILL.md but declares no allowed-tools — Claude Code will ask for permission each time
Cursor·UnknownWe have not crawled the repo tree, so we will not guess
Codex·UnknownWe have not crawled the repo tree, so we will not guess
Gemini CLI·UnknownThe spec defines no detection rule for Gemini
Copilot·UnknownWe have not crawled the repo tree, so we will not guess
npx agentalley add browser

This command does not work yet — the CLI is still being built. Until then, use Raw in the reader below to take the file.

Who is stuck, and on what

Web browser automation with AI-optimized snapshots for claude-flow agents

The whole source

No sign-in, no blur, nothing truncated
browser/SKILL.md205 lines5.2 KBRawView on GitHub
Frontmatter — 5 properties
namebrowser
descriptionWeb browser automation with AI-optimized snapshots for claude-flow agents
version1.0.0
triggers - /browser - browse - web automation - scrape - navigate - screenshot
tools - browser/open - browser/snapshot - browser/click - browser/fill - browser/screenshot - browser/close
1---
2name: browser
3description: Web browser automation with AI-optimized snapshots for claude-flow agents
4version: 1.0.0
5triggers:
6 - /browser
7 - browse
8 - web automation
9 - scrapeA4 — This skill pulls in web or user content but never says to treat that content as data. A signal, not proof.
10 - navigate
11 - screenshot
12tools:
13 - browser/open
14 - browser/snapshot
15 - browser/click
16 - browser/fill
17 - browser/screenshot
18 - browser/close
19---A5 — No allowed-tools declared — no way to tell what this skill may touch
20 
21# Browser Automation Skill
22 
23Web browser automation using agent-browser with AI-optimized snapshots. Reduces context by 93% using element refs (@e1, @e2) instead of full DOM.
24 
25## Core Workflow
26 
27```bash
28# 1. Navigate to page
29agent-browser open <url>
30 
31# 2. Get accessibility tree with element refs
32agent-browser snapshot -i # -i = interactive elements only
33 
34# 3. Interact using refs from snapshot
35agent-browser click @e2
36agent-browser fill @e3 "text"
37 
38# 4. Re-snapshot after page changes
39agent-browser snapshot -i
40```
41 
42## Quick Reference
43 
44### Navigation
45| Command | Description |
46|---------|-------------|
47| `open <url>` | Navigate to URL |
48| `back` | Go back |
49| `forward` | Go forward |
50| `reload` | Reload page |
51| `close` | Close browser |
52 
53### Snapshots (AI-Optimized)
54| Command | Description |
55|---------|-------------|
56| `snapshot` | Full accessibility tree |
57| `snapshot -i` | Interactive elements only (buttons, links, inputs) |
58| `snapshot -c` | Compact (remove empty elements) |
59| `snapshot -d 3` | Limit depth to 3 levels |
60| `screenshot [path]` | Capture screenshot (base64 if no path) |
61 
62### Interaction
63| Command | Description |
64|---------|-------------|
65| `click <sel>` | Click element |
66| `fill <sel> <text>` | Clear and fill input |
67| `type <sel> <text>` | Type with key events |
68| `press <key>` | Press key (Enter, Tab, etc.) |
69| `hover <sel>` | Hover element |
70| `select <sel> <val>` | Select dropdown option |
71| `check/uncheck <sel>` | Toggle checkbox |
72| `scroll <dir> [px]` | Scroll page |
73 
74### Get Info
75| Command | Description |
76|---------|-------------|
77| `get text <sel>` | Get text content |
78| `get html <sel>` | Get innerHTML |
79| `get value <sel>` | Get input value |
80| `get attr <sel> <attr>` | Get attribute |
81| `get title` | Get page title |
82| `get url` | Get current URL |
83 
84### Wait
85| Command | Description |
86|---------|-------------|
87| `wait <selector>` | Wait for element |
88| `wait <ms>` | Wait milliseconds |
89| `wait --text "text"` | Wait for text |
90| `wait --url "pattern"` | Wait for URL |
91| `wait --load networkidle` | Wait for load state |
92 
93### Sessions
94| Command | Description |
95|---------|-------------|
96| `--session <name>` | Use isolated session |
97| `session list` | List active sessions |
98 
99## Selectors
100 
101### Element Refs (Recommended)
102```bash
103# Get refs from snapshot
104agent-browser snapshot -i
105# Output: button "Submit" [ref=e2]
106 
107# Use ref to interact
108agent-browser click @e2
109```
110 
111### CSS Selectors
112```bash
113agent-browser click "#submit"
114agent-browser fill ".email-input" "[email protected]"
115```
116 
117### Semantic Locators
118```bash
119agent-browser find role button click --name "Submit"
120agent-browser find label "Email" fill "[email protected]"
121agent-browser find testid "login-btn" click
122```
123 
124## Examples
125 
126### Login Flow
127```bash
128agent-browser open https://example.com/login
129agent-browser snapshot -i
130agent-browser fill @e2 "[email protected]"
131agent-browser fill @e3 "password123"
132agent-browser click @e4
133agent-browser wait --url "**/dashboard"
134```
135 
136### Form Submission
137```bash
138agent-browser open https://example.com/contact
139agent-browser snapshot -i
140agent-browser fill @e1 "John Doe"
141agent-browser fill @e2 "[email protected]"
142agent-browser fill @e3 "Hello, this is my message"
143agent-browser click @e4
144agent-browser wait --text "Thank you"
145```
146 
147### Data Extraction
148```bash
149agent-browser open https://example.com/products
150agent-browser snapshot -i
151# Iterate through product refs
152agent-browser get text @e1 # Product name
153agent-browser get text @e2 # Price
154agent-browser get attr @e3 href # Link
155```
156 
157### Multi-Session (Swarm)
158```bash
159# Session 1: Navigator
160agent-browser --session nav open https://example.com
161agent-browser --session nav state save auth.json
162 
163# Session 2: Scraper (uses same auth)
164agent-browser --session scrape state load auth.json
165agent-browser --session scrape open https://example.com/data
166agent-browser --session scrape snapshot -i
167```
168 
169## Integration with Claude Flow
170 
171### MCP Tools
172All browser operations are available as MCP tools with `browser/` prefix:
173- `browser/open`
174- `browser/snapshot`
175- `browser/click`
176- `browser/fill`
177- `browser/screenshot`
178- etc.
179 
180### Memory Integration
181```bash
182# Store successful patterns
183npx @claude-flow/cli memory store --namespace browser-patterns --key "login-flow" --value "snapshot->fill->click->wait"
184 
185# Retrieve before similar task
186npx @claude-flow/cli memory search --query "login automation"
187```
188 
189### Hooks
190```bash
191# Pre-browse hook (get context)
192npx @claude-flow/cli hooks pre-edit --file "browser-task.ts"
193 
194# Post-browse hook (record success)
195npx @claude-flow/cli hooks post-task --task-id "browse-1" --success true
196```
197 
198## Tips
199 
2001. **Always use snapshots** - They're optimized for AI with refs
2012. **Prefer `-i` flag** - Gets only interactive elements, smaller output
2023. **Use refs, not selectors** - More reliable, deterministic
2034. **Re-snapshot after navigation** - Page state changes
2045. **Use sessions for parallel work** - Each session is isolated
205 

Reviews

Installed this one?Write the first review and take the Trailblazer badge.

Reviews only open after a real install, so this is empty — and we leave it empty rather than invent one.

Alternatives

Also in Coding
Subagent Driven DevelopmentUse when executing implementation plans with independent tasks in the current sessionCoding · MIT◐◐◐◐◐●36/40Python Code Style & DocumentationPython code style, linting, formatting, naming conventions, and documentation standards. Use when writing new code, reviewing style, configuring linters, writing docstrings, or establishing project standards.Coding · MIT◐····●35/40Competitor Price Analysis 💲Competitor pricing strategy analysis and market positioning. Price mapping, pricing gaps identification, elasticity signals evaluation, and strategic pricing optimization. Use when the user asks about competitor pricing, price analysis, pricing strategy, or coCoding · MIT◐····●34/40Competitor Price Tracker 📊Set up competitor price tracking and monitoring workflows. Track price changes, detect promotions, analyze pricing patterns, and get alerts for competitive price movements.Coding · MIT◐····●34/40