Back to Blog

Deep Dive

Browser Automation in Arcana: MCP-Powered Chrome Control

Arcana agents can control a real Chrome browser. Not a headless scraper, not a Puppeteer abstraction, but a visible Chrome window that you can watch, interact with, and debug. This is browser automation via the Model Context Protocol.

Most AI coding assistants treat the browser as a black box. They can fetch URLs, but they cannot click buttons, fill forms, or see what a page actually looks like after JavaScript renders. Arcana takes a different approach: the agent gets full control of a real browser instance, with all the capabilities of a human user plus the speed and precision of automation.

This matters because modern web applications are not static HTML. They are JavaScript-heavy single-page apps with dynamic content, authentication states, and complex interaction flows. A tool that can only fetch raw HTML misses everything that happens after the page loads. A tool that controls a real browser sees exactly what a human sees.

The Agent-Browser MCP Server

Browser automation in Arcana is built on agent-browser, an MCP server that exposes Chrome DevTools Protocol (CDP) operations as tools. The agent sees 29 distinct tools: navigate, click, type, screenshot, evaluate JavaScript, manage tabs, and more.

The MCP architecture means the browser is a separate process from the agent. The agent sends commands over stdio, the MCP server executes them against Chrome, and results flow back. This separation means the browser can be on a different machine, a different user profile, or a different Chrome instance entirely.

This separation also means the browser process can crash without taking down the agent. If Chrome runs out of memory or encounters a rendering error, the MCP server catches the failure and reports it back to the agent, which can retry or adapt. The agent remains stable regardless of what happens in the browser.

Setup

# Add agent-browser to your config
arcana mcp add agent-browser

# Or configure manually in config.json
{
  "mcp": {
    "agent-browser": {
      "command": "npx",
      "args": ["-y", "@anthropic/agent-browser"]
    }
  }
}

What the Agent Can Do

The full tool set includes:

  • Navigation: go to URL, go back, go forward, reload
  • Interaction: click, type, select, hover, scroll
  • Extraction: get text, get HTML, screenshot (full page or element), accessibility tree
  • Execution: run arbitrary JavaScript in the page context
  • Management: open/close tabs, switch tabs, manage cookies

Practical Use Cases

Browser automation shines when the agent needs to interact with web apps that lack APIs. Consider these real scenarios:

  • Deployment verification. After pushing to production, the agent opens the live site, takes screenshots of key pages, and compares them against expected layouts. It can detect broken images, missing content, and layout regressions that a curl-based check would miss.
  • Form testing. The agent fills out a multi-step form, validates error states, checks required field behavior, and submits with test data. This catches JavaScript validation bugs that static analysis cannot find.
  • Dashboard extraction. Many internal tools have no API. The agent logs in (using your existing session), navigates to the right page, and extracts the data you need by reading the DOM or taking screenshots.
  • Visual regression. The agent takes screenshots of a page before and after a change, then compares them. This catches subtle visual regressions that code review misses.

Working with Screenshots

Screenshots are one of the most powerful browser automation capabilities. The agent can capture full-page screenshots, viewport screenshots, or screenshots of specific elements. These screenshots are returned as images that the agent can analyze, compare, or save.

# Example: the agent might take a screenshot like this
# (this is the tool call, not something you type)

# Linux / macOS
screenshot --full-page --output /tmp/deploy-check.png

# Windows
screenshot --full-page --output %TEMP%\deploy-check.png

The agent can also take element-level screenshots. If you say "screenshot the login form," the agent finds the form element and captures just that portion of the page. This is useful for focused visual checks without downloading entire page images.

Security Considerations

The browser runs under your user profile. The agent has access to your cookies, your logged-in sessions, and your browsing history. This is by design (you want the agent to use your authenticated sessions) but it means you should be deliberate about what you ask the agent to do in the browser.

Arcana's permission system gates browser actions. By default, the agent must ask before navigating to new URLs or executing JavaScript. You can adjust this with the trust configuration.

A few safety guidelines:

  • Do not ask the agent to submit real financial transactions or make irreversible purchases through browser automation.
  • Be aware that the agent can see your logged-in sessions. If you are logged into a sensitive service, the agent can access it.
  • Consider using a separate Chrome profile for agent-driven browsing if you want to isolate the agent's access from your personal browsing.
  • Review the permission prompts carefully. The agent will ask before navigating to new domains, which gives you a chance to verify the destination is safe.