Allie Jones
Allie Jones allierays

Head of Applied AI at Go1

· Updated

5 Ways to Give Claude Access to Your Browser

claude-codemcpbrowser-automation

Claude Code can write code, read files, and run commands. But until recently, it couldn’t see your browser. It couldn’t check if the UI you just shipped actually looks right. It couldn’t fill out a form to test a workflow. It couldn’t read the error in your console. It couldn’t take a long task and just go do it. And if the page wanted a login, it couldn’t get in at all.

Now there are five tools that give Claude browser access. They overlap, but each one is good at something the others aren’t.

1. Claude in Chrome

Claude in Chrome
Anthropic

Claude in Chrome is a Chrome extension from Anthropic. It takes screenshots of your browser, understands what it sees, and clicks where it needs to. It works in your real browser with your real login sessions — no setup, no fake accounts.

Claude Code v2.1.84
Opus 4.6 · ~/my-app
> fill out the support ticket form in Chrome with my info
●I'll navigate to the support page and fill out the form.
Navigate to support.company.com/tickets/new
Screenshot taken — I can see the ticket form
Filling in Name: Allie Jones
Filling in Email: allie@company.com
Click Submit
>
Opus 4.6 (1M context)|ctx:19%|~/my-app
▸▸ bypass permissions on (shift+tab to cycle)

When to use it:

  • Testing a UI change you just made — “does this look right?”
  • Filling out forms, clicking through workflows
  • Anything where you’d normally say “let me show you what I see”
  • When you need Claude to use your logged-in sessions (Salesforce, Jira, internal tools)

Good to know:

  • Works with any web app you’re already logged into
  • Can record GIFs of what it does
  • Requires a Claude Max plan
  • Higher token cost because of screenshots
1. Install the Claude in Chrome extension from the Chrome Web Store
 https://chromewebstore.google.com/detail/claude/fcoeoabgfenejglbffodgkkbkcdhcgfn

2. Restart Claude Code (close and reopen)

3. Inside Claude Code, run:
 /chrome

4. Select "Enabled by default" so you don't have to pass --chrome every session

5. Manage which sites Claude can access in the Chrome extension settings

Works with Google Chrome and Microsoft Edge. Not yet supported on Brave, Arc, or other Chromium browsers.

2. Playwright MCP

Playwright MCP
Microsoft

Playwright is Microsoft’s browser automation tool. The Playwright MCP server lets Claude control a browser programmatically. Instead of taking screenshots, it reads the page structure as text. It knows there’s a button called “Sign in” without needing to see it.

Claude Code v2.1.84
Opus 4.6 · ~/my-app
> go to localhost:3000 and test the login flow
●I'll use Playwright to test the login flow.
Navigate to localhost:3000
Snapshot: heading "Welcome back", textbox "Email", textbox "Password", button "Sign in"
Fill "Email" with test@example.com
Fill "Password" with ••••••••
Click "Sign in"
●Login successful. Redirected to /dashboard.
>
Opus 4.6 (1M context)|ctx:19%|~/my-app
▸▸ bypass permissions on (shift+tab to cycle)

When to use it:

  • Testing flows (login, checkout, form submission)
  • Scraping data from a page
  • Automating repetitive browser tasks
  • When you don’t need your logged-in sessions

Good to know:

  • Works with Chrome, Firefox, and WebKit
  • Opens a clean browser — no saved passwords, no cookies
  • Free and open source
  • Lower token cost than Claude in Chrome
1. Add the Playwright MCP server to Claude Code:
 claude mcp add playwright npx @playwright/mcp@latest

2. Verify it's registered:
 claude mcp list

3. Inside Claude Code, check it's connected:
 /mcp

4. When prompting, say "use Playwright MCP" in your first message.
 Claude sometimes defaults to running Playwright through Bash
 if you don't mention MCP by name.

Tip: Pin the version instead of using @latest to avoid
breaking changes. Requires Node.js 18+.

3. Chrome DevTools MCP

Chrome DevTools MCP
Google

Chrome DevTools MCP gives Claude access to the same developer tools panel that engineers use to debug websites. It can read error messages, check network requests, and find performance problems that you can’t see on the page itself.

Claude Code v2.1.84
Opus 4.6 · ~/my-app
> check the console logs on localhost:3000 for errors
●I'll connect to Chrome DevTools and check the console.
Console: Error — Failed to load /api/auth 500
Console: TypeError — Cannot read property 'token'
Network: bundle.js — 842 KB (consider splitting)
●Found 2 errors. The auth endpoint is returning 500, and there's an unhandled null token.
>
Opus 4.6 (1M context)|ctx:19%|~/my-app
▸▸ bypass permissions on (shift+tab to cycle)

When to use it:

  • Finding errors that don’t show up visually
  • Debugging slow page loads
  • Checking if API calls are failing
  • Performance optimization

Good to know:

  • Reads console errors, network requests, and performance data
  • Can simulate slow connections and throttled CPUs
  • Connects to your running Chrome — keeps your sessions
  • Lower token cost (text only, no images)
1. Add the DevTools MCP server to Claude Code:
 claude mcp add chrome-devtools npx chrome-devtools-mcp@latest

2. Verify it's registered:
 claude mcp list

3. For basic use (headless, no login sessions):
 claude mcp add chrome-devtools npx chrome-devtools-mcp@latest --slim --headless

4. For sites that need your login sessions, launch Chrome
 with a debug port:
 /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222

 Then connect DevTools MCP to that port.

5. For persistent logins, use a separate Chrome profile:
 --user-data-dir=/tmp/chrome-debug-profile
 Chrome saves cookies and sessions in that directory.

4. browser-use

browser-use
Browser Use

The first three tools all work the same way underneath: Claude drives the browser one step at a time. browser-use inverts that. It’s a browser agent of its own — you hand it a task in one sentence, and it plans, clicks, and reports back. Claude Code shells out to the browser-use CLI and waits for the result.

It reads the page as a numbered list of interactive elements. Every clickable thing gets an index, and anything new since the last step is marked with a star, so the agent can tell “this button just appeared” from “this button was always here.”

Claude Code v2.1.84
Opus 4.6 · ~/my-app
> use browser-use to find the top 5 trending Python repos and summarize them
●I'll hand this off to browser-use.
Bash: browser-use run "find top 5 trending Python repos, summarize each"
Step 1 — Navigate to github.com/trending
Step 2 — Click [13]<select Language /> → Python
Step 3 — Extract repo names, stars, descriptions
●Done. 5 repos found. Here's the summary...
>
Opus 4.6 (1M context)|ctx:19%|~/my-app
▸▸ bypass permissions on (shift+tab to cycle)

When to use it:

  • Multi-step tasks you don’t want to narrate — “book the cheapest flight,” “pull last month’s invoices”
  • Scraping across many pages where you don’t want to script every click
  • Running browser work on a headless machine or in CI
  • When you’d rather describe the outcome than the steps

Good to know:

  • Python library, MIT licensed, plus a hosted cloud option
  • Can drive local Chrome over CDP and reuse your existing profile and logins
  • The cloud tier adds proxies, CAPTCHA solving, and persistent profiles
  • Cheap for Claude Code specifically — the sub-agent burns its own tokens, and Claude only sees the final answer
  • Because it decides its own steps, you get less control over exactly what it does
1. Install the CLI (needs Python 3.11+):
 uv tool install browser-use

2. Check the install:
 browser-use doctor

3. Register the Claude Code skill:
 browser-use skill install

4. Sign up at cloud.browser-use.com, then authenticate:
 browser-use auth login

5. Prompt Claude Code normally, naming the tool:
 "use browser-use to open github.com/trending and summarize the top repos"

Claude Code runs it through Bash, so there is no MCP server to add.
To use your own local Chrome instead of a cloud browser, point
BU_CDP_URL at a Chrome running with --remote-debugging-port=9222.

5. Agent Reach

Agent Reach
Panniantong

The first four tools assume the page will let you in. Plenty won’t. Reddit throttles you, X wants a login, Instagram blocks anything that isn’t a browser, and half the internet returns a JavaScript shell with no content in it.

Agent Reach is the odd one out here — it isn’t a browser driver at all. It’s a router. It keeps an ordered list of backends for each platform, probes them to see which actually works on your machine, and hands the job to whichever one wins. Some of those backends are CLIs (yt-dlp, gh, rdt-cli), some are APIs (Jina Reader for clean article text, Exa for search), and some borrow the Chrome session you’re already logged into.

Claude Code v2.1.84
Opus 4.6 · ~/my-app
> use agent-reach to find what people are saying about Claude Code on Reddit and X
●I'll route this through Agent Reach.
Probe backends — rdt-cli ✓, twitter-cli ✓, Jina Reader ✓
Reddit r/ClaudeAI — 42 threads, top 10 by score
X via cookie session — 87 posts
Jina Reader — 3 linked posts → clean text
●Three themes: hooks are underused, MCP setup is the top complaint, and everyone wants better subagent control.
>
Opus 4.6 (1M context)|ctx:19%|~/my-app
▸▸ bypass permissions on (shift+tab to cycle)

When to use it:

  • Research across social platforms that block scrapers
  • Reading something behind a login you already have
  • Pulling YouTube transcripts, RSS feeds, or clean article text out of a cluttered page
  • When a platform’s API is gated, expensive, or doesn’t exist

Good to know:

  • MIT licensed and free — the tools it routes to are open source and the APIs it leans on have free tiers
  • Covers X, Reddit, YouTube, Bilibili, XiaoHongShu, Instagram, Facebook, LinkedIn, GitHub, RSS, and any URL via Jina Reader
  • Cookies and browser sessions stay on your machine
  • Because it’s a router, what works depends on what’s installed — the installer tells you which backends came up
  • Not the tool for testing your own UI. Use one of the other four for that.
1. Paste this into Claude Code and let it run the installer:
 Install Agent Reach: https://raw.githubusercontent.com/Panniantong/agent-reach/main/docs/install.md

2. The Python installer checks your dependencies and reports
 which backends are available. Read that output — it tells you
 which platforms will work before you try them.

3. For gated platforms (X, XiaoHongShu), export cookies with the
 Cookie-Editor browser extension. They stay local.

4. For Reddit, Instagram, and Facebook, it reuses the Chrome
 session you're already signed into. Desktop only.

5. To update later:
 Update Agent Reach: https://raw.githubusercontent.com/Panniantong/agent-reach/main/docs/update.md

There is no MCP server to add. Claude Code calls the underlying
tools directly once they are installed.

Quick Comparison

Which One Should You Use?

Start with Claude in Chrome if you’re not sure. It’s the most intuitive — Claude sees what you see. If you’re testing a UI, checking a layout, or need Claude to interact with a logged-in app, this is the one.

Use Playwright when you want Claude to automate browser tasks or test flows without your login sessions. It’s faster, cheaper, and works across browsers.

Use DevTools when something is broken and you can’t see why. The page looks fine but the API is failing silently, or the page is slow and you need to know what’s causing it.

Use browser-use when the task is long and you don’t care how it gets done. The first three keep Claude in the driver’s seat, step by step. This one hands the wheel over.

Use Agent Reach when the problem isn’t driving the browser, it’s getting in at all. If the answer is on Reddit or X or behind a login wall, none of the other four will help much — they can see the page fine, they just can’t reach it.

You can use all five in the same project. They solve different problems.