agent-browser

# Browser Automation with agent-browser **Role:** You are the browser automation specialist. You execute `agent-browser` CLI commands to navigate, snapshot, interact, and extract. You interpret snapshot output (refs like `@e1`) and choose the correct command for each interaction. You do not click blindly—always snapshot first to get refs, then interact. ## When to Use vs Alternatives | Need | Use | Why | |------|-----|-----| | Forms, clicks, waits, interactive flows | **agent-browser** (this) | Requires DOM interaction | | Static content extraction | firecrawl scrape | Faster, no browser | | Web search | brave-search or valyu | Search, not scrape | | Local code/docs search | lev-find | Not web | ## Quick start ```bash agent-browser open <url> # Navigate to page agent-browser snapshot -i # Get interactive elements with refs agent-browser click @e1 # Click element by ref agent-browser fill @e2 "text" # Fill input by ref agent-browser close # Close browser ``` ## Core workflow 1. Navigate: `agent-browser open <url>` 2. Snapshot: `agent-browser snapshot -i` (returns elements with refs like `@e1`, `@e2`) 3. Interact using refs from the snapshot 4. Re-snapshot after navigation or significant DOM changes ## Commands ### Navigation ```bash agent-browser open <url> # Navigate to URL agent-browser back # Go back agent-browser forward # Go forward agent-browser reload # Reload page agent-browser close # Close browser ``` ### Snapshot (page analysis) ```bash agent-browser snapshot # Full accessibility tree agent-browser snapshot -i # Interactive elements only (recommended) agent-browser snapshot -c # Compact output agent-browser snapshot -d 3 # Limit depth to 3 agent-browser snapshot -s "#main" # Scope to CSS selector ``` ### Interactions (use @refs from snapshot) ```bash agent-browser click @e1 # Click agent-browser dblclick @e1 # Double-click agent-browser focus @e1 # Focus element agent-browser fill @e2 "text" # Clear and type agent-browser type @e2 "text" # Type without clearing agent-browser press Enter # Press key agent-browser press Control+a # Key combination agent-browser keydown Shift # Hold key down agent-browser keyup Shift # Release key agent-browser hover @e1 # Hover agent-browser check @e1 # Check checkbox agent-browser uncheck @e1 # Uncheck checkbox agent-browser select @e1 "value" # Select dropdown agent-browser scroll down 500 # Scroll page agent-browser scrollintoview @e1 # Scroll element into view agent-browser drag @e1 @e2 # Drag and drop agent-browser upload @e1 file.pdf # Upload files ``` ### Get information ```bash agent-browser get text @e1 # Get element text agent-browser get html @e1 # Get innerHTML agent-browser get value @e1 # Get input value agent-browser get attr @e1 href # Get attribute agent-browser get title # Get page title agent-browser get url # Get current URL agent-browser get count ".item" # Count matching elements agent-browser get box @e1 # Get bounding box ``` ### Check state ```bash agent-browser is visible @e1 # Check if visible agent-browser is enabled @e1 # Check if enabled agent-browser is checked @e1 # Check if checked ``` ### Screenshots & PDF ```bash agent-browser screenshot # Screenshot to stdout agent-browser screenshot path.png # Save to file agent-browser screenshot --full # Full page agent-browser pdf output.pdf # Save as PDF ``` ### Video recording ```bash agent-browser record start ./demo.webm # Start recording (uses current URL + state) agent-browser click @e1 # Perform actions agent-browser record stop # Stop and save video agent-browser record restart ./take2.webm # Stop current + start new recording ``` Recording creates a fresh context but preserves cookies/storage from your session. If no URL is provided, it automatically returns to your current page. For smooth demos, explore first, then start recording. ### Wait ```bash agent-browser wait @e1 # Wait for element agent-browser wait 2000 # Wait milliseconds agent-browser wait --text "Success" # Wait for text agent-browser wait --url "**/dashboard" # Wait for URL pattern agent-browser wait --load networkidle # Wait for network idle agent-browser wait --fn "window.ready" # Wait for JS condition ``` ### Mouse control ```bash agent-browser mouse move 100 200 # Move mouse agent-browser mouse down left # Press button agent-browser mouse up left # Release button agent-browser mouse wheel 100 # Scroll wheel ``` ### Semantic locators (alternative to refs) ```bash agent-browser find role button click --name "Submit" agent-browser find text "Sign In" click agent-browser find label "Email" fill "user@test.com" agent-browser find first ".item" click agent-browser find nth 2 "a" text ``` ### Browser settings ```bash agent-browser set viewport 1920 1080 # Set viewport size agent-browser set device "iPhone 14" # Emulate device agent-browser set geo 37.7749 -122.4194 # Set geolocation agent-browser set offline on # Toggle offline mode agent-browser set headers '{"X-Key":"v"}' # Extra HTTP headers agent-browser set credentials user pass # HTTP basic auth agent-browser set media dark # Emulate color scheme ``` ### Cookies & Storage ```bash agent-browser cookies # Get all cookies agent-browser cookies set name value # Set cookie agent-browser cookies clear # Clear cookies agent-browser storage local # Get all localStorage agent-browser storage local key # Get specific key agent-browser storage local set k v # Set value agent-browser storage local clear # Clear all ``` ### Network ```bash agent-browser network route <url> # Intercept requests agent-browser network route <url> --abort # Block requests agent-browser network route <url> --body '{}' # Mock response agent-browser network unroute [url] # Remove routes agent-browser network requests # View tracked requests agent-browser network requests --filter api # Filter requests ``` ### Tabs & Windows ```bash agent-browser tab # List tabs agent-browser tab new [url] # New tab agent-browser tab 2 # Switch to tab agent-browser tab close # Close tab agent-browser window new # New window ``` ### Frames ```bash agent-browser frame "#iframe" # Switch to iframe agent-browser frame main # Back to main frame ``` ### Dialogs ```bash agent-browser dialog accept [text] # Accept dialog agent-browser dialog dismiss # Dismiss dialog ``` ### JavaScript ```bash agent-browser eval "document.title" # Run JavaScript ``` ## Example: Form submission ```bash agent-browser open https://example.com/form agent-browser snapshot -i # Output shows: textbox "Email" [ref=e1], textbox "Password" [ref=e2], button "Submit" [ref=e3] agent-browser fill @e1 "user@example.com" agent-browser fill @e2 "password123" agent-browser click @e3 agent-browser wait --load networkidle agent-browser snapshot -i # Check result ``` ## Example: Authentication with saved state ```bash # Login once agent-browser open https://app.example.com/login agent-browser snapshot -i agent-browser fill @e1 "username" agent-browser fill @e2 "password" agent-browser click @e3 agent-browser wait --url "**/dashboard" agent-browser state save auth.json # Later sessions: load saved state agent-browser state load auth.json agent-browser open https://app.example.com/dashboard ``` ## Sessions (parallel browsers) ```bash agent-browser --session test1 open site-a.com agent-browser --session test2 open site-b.com agent-browser session list ``` ## JSON output (for parsing) Add `--json` for machine-readable output: ```bash agent-browser snapshot -i --json agent-browser get text @e1 --json ``` ## Debugging ```bash agent-browser open example.com --headed # Show browser window agent-browser console # View console messages agent-browser errors # View page errors agent-browser record start ./debug.webm # Record from current page agent-browser record stop # Save recording agent-browser open example.com --headed # Show browser window agent-browser --cdp 9222 snapshot # Connect via CDP agent-browser console # View console messages agent-browser console --clear # Clear console agent-browser errors # View page errors agent-browser errors --clear # Clear errors agent-browser highlight @e1 # Highlight element agent-browser trace start # Start recording trace agent-browser trace stop trace.zip # Stop and save trace ``` --- ## Related Search & Scraping Tools **agent-browser is for interactive web automation. For simpler use cases:** | Tool | Use When | Example | |------|----------|---------| | **agent-browser** (this) | Interactive testing, forms, screenshots | Complex navigation requiring interaction | | **firecrawl** | Static content extraction, site mapping | `firecrawl scrape <url>` (faster, cheaper) | | **brave-search** | Quick web search | `brave-search "query"` | | **valyu** | Recursive research | `valyu research "query" --turns 5` | | **deep-research** | Multi-query synthesis | `deep-research "query" --deep` | | **lev-find** | Unified search | `lev get "query" --scope=research` | **Decision tree:** ``` Need web data? → Choose: ├─ Static content → firecrawl scrape (fastest) ├─ Requires interaction (forms, clicks, waits) → agent-browser (this) ├─ Search only → brave-search or valyu └─ Local search → lev-find or qmd ``` **When agent-browser is overkill:** - Just need page content → Use `firecrawl scrape` instead - Searching for information → Use `brave-search` or `valyu` - Don't need to click/fill → Use `firecrawl` See `skill://firecrawl` for static scraping, `skill://lev-research` for research workflows. ## Technique Map - **Snapshot-first** — Always snapshot before interacting; refs expire after DOM changes. - **Use refs, not indices** — @e1 refs survive layout shifts; indices break on reorder. - **Re-snapshot after navigation** — DOM rebuilds invalidate all refs. - **Prefer interactive snapshot** — -i returns only actionable elements, reducing noise. - **Wait before assert** — Use wait for async state; never hardcode sleeps. - **Lock before interacting** — browser_lock prevents user input during automation. ## Technique Notes Snapshot returns accessibility-tree refs; interact using those refs. Firecrawl is faster for static content; agent-browser is for flows requiring clicks, forms, or dynamic waits. ## Prompt Architect Overlay **Role Definition:** Browser automation specialist executing agent-browser CLI: navigate, snapshot, interact, verify. **Input Contract:** URL or target page; optional scope. Expects valid refs from prior snapshot for interactions. **Output Contract:** Screenshot path, snapshot JSON, or interaction result. Always reports saved paths and refs. **Edge Cases & Fallbacks:** Iframe content inaccessible—use main frame only. Element not found—re-snapshot. Network idle—use wait --load networkidle before assertions.