# Browser

Drives a real browser with Playwright using a snapshot-and-selector pattern to complete web tasks.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="eve" agent="browser-agent" />

<AgentPreview
  agent="browser-agent"
  framework="eve"
  inputFields="[
  {
    name: &#x22;task&#x22;,
    label: &#x22;Task&#x22;,
    placeholder:
      &#x22;Go to news.ycombinator.com and list the top 3 story titles.&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

The **Browser Agent** completes tasks on the live web by driving a real Chromium
browser. It uses a snapshot-and-selector loop — the model sees a stable list of
interactive elements instead of brittle CSS — to navigate, click, and type. Reach
for it to automate flows, scrape interactive pages, or test UIs.

## Install [#install]

```bash
npx shadcn@latest add @agentcn/eve/browser-agent
```

## Composition [#composition]

```text
agent/
├── agent.ts                  # Agent definition (model + config)
├── instructions.md           # Snapshot-then-act loop instructions
├── lib/
│   └── browser.ts            # Shared Playwright page + snapshot helper
└── tools/
    ├── browser_goto.ts       # Navigate to a URL
    ├── browser_snapshot.ts   # Read the current page + elements
    ├── browser_click.ts      # Click an element by selector
    └── browser_type.ts       # Type into an input by selector
```

## Customization [#customization]

* **Use hosted browsers.** Set `BROWSER_CDP_URL` to run against Browserbase or a
  remote Chrome.
* **Richer snapshots.** Extend `lib/browser.ts` to include roles, ARIA, or
  bounding boxes.
* **Add actions.** Add tools for scrolling, file uploads, or screenshots.
* **Swap the model.** Edit `agent/agent.ts`.