Chrome Integration

Claude Code integrates with the Chrome browser extension to provide browser automation capabilities. After writing code, you can test and debug it in the browser directly from the terminal.

Beta Feature

Chrome integration is currently in beta. It is only supported on Google Chrome and Microsoft Edge. Other Chromium-based browsers such as Brave and Arc, as well as WSL, are not yet supported.

Prerequisites

Chrome integration requires the following:

Item	Requirement
Browser	Google Chrome or Microsoft Edge
Extension	Claude in Chrome v1.0.36 or later
Claude Code	v2.0.73 or later
Plan	Anthropic paid plan (Pro, Max, Teams, Enterprise)

Third-Party Provider Limitation

If you use Claude through a third-party provider such as Amazon Bedrock, Google Cloud Vertex AI, or Microsoft Foundry, you need a separate claude.ai account for Chrome integration.

Getting Started

Step 1: Install the Chrome Extension

1. Search for Claude in Chrome in the Chrome Web Store
2. Install the official Anthropic extension
3. Verify it is enabled at chrome://extensions

Step 2: Launch Chrome from Claude Code

# Start with the --chrome flag
claude --chrome

Or activate it in an existing session using the /chrome command:

/chrome

Step 3: Request a Browser Action

Go to localhost:3000, fill the login form with test data,
and check if the validation works correctly

Claude opens a new tab and performs browser actions. All actions run in a visible Chrome window in real time.

Enable by Default

If adding the --chrome flag every time is cumbersome, run /chrome and select "Enabled by default".

Watch Your Context Usage

When enabled by default, browser tools are always loaded, which increases context usage. If context consumption is a concern, launching with --chrome only when needed is more efficient.

Main Capabilities

Once Chrome is connected, you can link browser and coding tasks in a single workflow:

Capability	Description
Live Debugging	Read console errors and DOM state directly, then fix the source code on the spot
Design Verification	Build UI from a Figma mockup, then verify it matches in the browser
Web App Testing	Form validation, visual regression testing, user flow verification
Authenticated Apps	Interact with logged-in apps like Google Docs, Gmail, Notion
Data Extraction	Extract structured information from web pages and save it locally
Task Automation	Automate data entry, form filling, multi-site workflows
Session Recording	Record browser actions as GIFs for documentation or sharing

Shared Login State

Claude shares the browser's login state. You can work on sites you are already logged into without any extra API setup. If Claude encounters a login page or CAPTCHA, it pauses and asks you to handle it manually.

Practical Workflows

Local Web App Testing

I updated the login form validation. Go to localhost:3000,
submit with invalid data, and check that error messages appear correctly

Debugging with Console Logs

Open the dashboard page and check if there are any
console errors when the page loads

Form Automation

I have customer contacts in contacts.csv. For each row,
go to the CRM (crm.example.com), click "Add Contact",
and fill in the name, email, and phone number

Writing in Google Docs

Write a project update based on recent commits and add it
to the Google Doc at docs.google.com/document/d/abc123

Data Extraction

Extract each product's name, price, and stock status
from the product listing page and save it as a CSV file

GIF Recording

Record the entire process of adding a product to the cart
and completing checkout as a GIF

Site Permission Management

Per-site permissions are managed in the Chrome extension settings. You can control which sites Claude is allowed to navigate, click, and type on.

To see the full list of available browser tools, go to /mcp and select claude-in-chrome.

Troubleshooting

Extension Not Detected

If you see the "Chrome extension not detected" message:

1. Check that the extension is installed and enabled at chrome://extensions
2. Verify your Claude Code version with claude --version
3. Make sure Chrome is running
4. Go to /chrome → "Reconnect extension" to reconnect
5. If the issue persists, restart both Claude Code and Chrome

First-Time Connection

When you first activate Chrome integration, a native messaging host configuration file is installed. Chrome reads this file at startup, so if it is not detected on the first try, restart Chrome.

Native messaging host configuration file locations:

Chrome:

• macOS: ~/Library/Application Support/Google/Chrome/NativeMessagingHosts/com.anthropic.claude_code_browser_extension.json
• Linux: ~/.config/google-chrome/NativeMessagingHosts/com.anthropic.claude_code_browser_extension.json
• Windows: HKCU\Software\Google\Chrome\NativeMessagingHosts\ (registry)

Edge:

• macOS: ~/Library/Application Support/Microsoft Edge/NativeMessagingHosts/com.anthropic.claude_code_browser_extension.json
• Linux: ~/.config/microsoft-edge/NativeMessagingHosts/com.anthropic.claude_code_browser_extension.json
• Windows: HKCU\Software\Microsoft\Edge\NativeMessagingHosts\ (registry)

Browser Not Responding

1. Check whether a modal dialog (alert, confirm, prompt) is blocking the page — close it manually
2. Ask Claude to open a new tab
3. Disable and re-enable the extension at chrome://extensions

Connection Drops (Long Sessions)

The Chrome extension's service worker can become idle during inactivity. If browser tools stop working, go to /chrome → "Reconnect extension" to reconnect.

Windows Issues

• Named pipe conflict (EADDRINUSE): Another Claude Code session may be using Chrome. Restart Claude Code.
• Native messaging host error: Reinstall Claude Code to regenerate the host configuration.

Common Error Messages

Error	Cause	Solution
"Browser extension is not connected"	Native messaging host cannot connect to the extension	Restart Chrome and Claude Code, then reconnect with /chrome
"Extension not detected"	Extension not installed or disabled	Install and enable at chrome://extensions
"No tab available"	Action attempted before a tab is ready	Request a new tab, then retry
"Receiving end does not exist"	Service worker is idle	/chrome → "Reconnect extension"

Key Takeaways

• Chrome integration connects code writing and browser testing in a single workflow
• Activate with claude --chrome or /chrome
• Work with logged-in sites (Google Docs, Gmail, etc.) without any extra API setup
• Currently in beta — only Chrome and Edge are supported
• Requires an Anthropic paid plan (third-party providers need a separate account)

---

Next chapter: First Run →