# Agent Browser

> Advanced browser automation for AI agents with snapshot-ref interaction pattern - navigate, snapshot interactive elements with refs, click/fill/select by refs, manage sessions, and extract structured data

- Skill: `chainlesschain/agent-browser` (Agent Skill, multi-file: 2 files)
- Install (CLI): `npx skillmds@latest add chainlesschain/agent-browser`
- Raw SKILL.md: https://api.skillmd.com/api/skills/chainlesschain/agent-browser/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- License: MIT
- Author: chainlesschain (https://skillmd.com/u/chainlesschain)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/chainlesschain/agent-browser

---


# Agent Browser Skill

Advanced browser automation using the snapshot-ref interaction pattern.

## Core Workflow

Every browser automation follows this pattern:

1. **Navigate**: `open <url>`
2. **Snapshot**: Get interactive elements with refs (`@e1`, `@e2`, ...)
3. **Interact**: Use refs to click, fill, select
4. **Re-snapshot**: After DOM changes, get fresh refs

```
/agent-browser open https://example.com
/agent-browser snapshot
# Output: @e1 [input email], @e2 [input password], @e3 [button] "Login"
/agent-browser fill @e1 "user@example.com"
/agent-browser fill @e2 "secret"
/agent-browser click @e3
/agent-browser snapshot   # Check result
```

## Commands

| Command | Description | Example |
| --- | --- | --- |
| `open` | Navigate to URL | `open https://example.com` |
| `snapshot` | Get interactive elements with refs | `snapshot` |
| `click` | Click element by ref | `click @e1` |
| `fill` | Clear and type into element | `fill @e2 "text"` |
| `type` | Type without clearing | `type @e2 "text"` |
| `select` | Select dropdown option | `select @e3 "option"` |
| `screenshot` | Capture page screenshot | `screenshot` |
| `extract` | Extract text/data from element | `extract @e5` |
| `wait` | Wait for element or condition | `wait @e1` or `wait 2000` |

## Session Management

```
/agent-browser session-save auth.json     # Save cookies/state
/agent-browser session-load auth.json     # Restore state
```

## Common Patterns

### Form Submission

```
open https://example.com/signup → snapshot → fill fields → click submit → snapshot
```

### Data Extraction

```
open <url> → snapshot → extract @e5 → extract body
```

### Multi-Page Navigation

```
open <url> → snapshot → click @link → wait → snapshot → repeat
```

## Element Refs

- Refs like `@e1`, `@e2` are assigned by snapshot to interactive elements
- Refs are reset on each new snapshot
- Use descriptive selectors as fallback: `click "Login button"`