← Back to daily report

chrome.md

Changed on 2026-02-04 16:28:15 EST

Unified Diff

--- a/chrome.md
+++ b/chrome.md
@@ -4,27 +4,27 @@
 
 # Use Claude Code with Chrome (beta)
 
-> Connect Claude Code to your browser to test web apps, debug with console logs, and automate browser tasks.
+> Connect Claude Code to your Chrome browser to test web apps, debug with console logs, automate form filling, and extract data from web pages.
+
+Claude Code integrates with the Claude in Chrome browser extension to give you browser automation capabilities from the CLI or the [VS Code extension](/en/vs-code#automate-browser-tasks-with-chrome). Build your code, then test and debug in the browser without switching contexts.
+
+Claude opens new tabs for browser tasks and shares your browser's login state, so it can access any site you're already signed into. Browser actions run in a visible Chrome window in real time. When Claude encounters a login page or CAPTCHA, it pauses and asks you to handle it manually.
 
 <Note>
   Chrome integration is in beta and currently works with Google Chrome only. It is not yet supported on Brave, Arc, or other Chromium-based browsers. WSL (Windows Subsystem for Linux) is also not supported.
 </Note>
 
-Claude Code integrates with the Claude in Chrome browser extension to give you browser automation capabilities directly from your terminal. Build in your terminal, then test and debug in your browser without switching contexts.
-
-## What the integration enables
-
-With Chrome connected, you can chain browser actions with terminal commands in a single workflow. For example: scrape documentation from a website, analyze it, generate code based on what you learned, and commit the result.
-
-Key capabilities include:
-
-* **Live debugging**: Claude reads console errors and DOM state directly, then fixes the code that caused them
-* **Design verification**: Build a UI from a Figma mock, then have Claude open it in the browser and verify it matches
-* **Web app testing**: Test form validation, check for visual regressions, or verify user flows work correctly
-* **Authenticated web apps**: Interact with Google Docs, Gmail, Notion, or any app you're logged into without needing API connectors
-* **Data extraction**: Pull structured information from web pages and save it locally
-* **Task automation**: Automate repetitive browser tasks like data entry, form filling, or multi-site workflows
-* **Session recording**: Record browser interactions as GIFs to document or share what happened
+## Capabilities
+
+With Chrome connected, you can chain browser actions with coding tasks in a single workflow:
+
+* **Live debugging**: read console errors and DOM state directly, then fix the code that caused them
+* **Design verification**: build a UI from a Figma mock, then open it in the browser to verify it matches
+* **Web app testing**: test form validation, check for visual regressions, or verify user flows
+* **Authenticated web apps**: interact with Google Docs, Gmail, Notion, or any app you're logged into without API connectors
+* **Data extraction**: pull structured information from web pages and save it locally
+* **Task automation**: automate repetitive browser tasks like data entry, form filling, or multi-site workflows
+* **Session recording**: record browser interactions as GIFs to document or share what happened
 
 ## Prerequisites
 
@@ -32,69 +32,63 @@
 
 * [Google Chrome](https://www.google.com/chrome/) browser
 * [Claude in Chrome extension](https://chromewebstore.google.com/detail/claude/fcoeoabgfenejglbffodgkkbkcdhcgfn) version 1.0.36 or higher
-* [Claude Code CLI](/en/quickstart#step-1-install-claude-code) version 2.0.73 or higher
-* A paid Claude plan (Pro, Team, or Enterprise)
-
-## How the integration works
-
-Claude Code communicates with Chrome through the Claude in Chrome browser extension. The extension uses Chrome's [Native Messaging API](https://developer.chrome.com/docs/extensions/develop/concepts/native-messaging) to receive commands from Claude Code and execute them in your browser. This architecture lets Claude Code control browser tabs, read page content, and perform actions while you continue working in your terminal.
-
-When Claude encounters a login page, CAPTCHA, or other blocker, it pauses and asks you to handle it. You can provide credentials for Claude to enter, or log in manually in the browser. Once you're past the blocker, tell Claude to continue and it picks up where it left off.
-
-Claude opens new tabs for browser tasks rather than taking over existing ones. However, it shares your browser's login state, so if you're already signed into a site in Chrome, Claude can access it without re-authenticating.
+* [Claude Code](/en/quickstart#step-1-install-claude-code) version 2.0.73 or higher
+* A direct Anthropic plan (Pro, Max, Team, or Enterprise)
 
 <Note>
-  The Chrome integration requires a visible browser window. When Claude performs browser actions, you'll see Chrome open and navigate in real time. There's no headless mode since the integration relies on your actual browser session with its login state.
+  Chrome integration is not available through third-party providers like Amazon Bedrock, Google Cloud Vertex AI, or Microsoft Foundry. If you access Claude exclusively through a third-party provider, you need a separate claude.ai account to use this feature.
 </Note>
 
-## Set up the integration
+## Get started in the CLI
 
 <Steps>
-  <Step title="Update Claude Code">
-    Chrome integration requires a recent version of Claude Code. If you installed using the [native installer](/en/quickstart#step-1-install-claude-code), updates happen automatically. Otherwise, run:
-
-    ```bash  theme={null}
-    claude update
-    ```
-  </Step>
-
-  <Step title="Start Claude Code with Chrome enabled">
-    Launch Claude Code with the `--chrome` flag:
+  <Step title="Launch Claude Code with Chrome">
+    Start Claude Code with the `--chrome` flag:
 
     ```bash  theme={null}
     claude --chrome
     ```
+
+    You can also enable Chrome from within an existing session by running `/chrome`.
   </Step>
 
-  <Step title="Verify the connection">
-    Run `/chrome` to check the connection status and manage settings. If the extension isn't detected, you'll see a warning with a link to install it.
+  <Step title="Ask Claude to use the browser">
+    This example navigates to a page, interacts with it, and reports what it finds, all from your terminal or editor:
+
+    ```text  theme={null}
+    Go to code.claude.com/docs, click on the search box,
+    type "hooks", and tell me what results appear
+    ```
   </Step>
 </Steps>
 
-You can also enable Chrome integration from within an existing session using the `/chrome` command.
-
-## Try it out
-
-Once connected, type this into Claude to see the integration in action:
-
-```
-Go to code.claude.com/docs, click on the search box,
-type "hooks", and tell me what results appear
-```
-
-Claude opens the page, clicks into the search field, types the query, and reports the autocomplete results. This shows navigation, clicking, and typing in a single workflow.
+Run `/chrome` at any time to check the connection status, manage permissions, or reconnect the extension.
+
+For VS Code, see [browser automation in VS Code](/en/vs-code#automate-browser-tasks-with-chrome).
+
+### Enable Chrome by default
+
+To avoid passing `--chrome` each session, run `/chrome` and select "Enabled by default".
+
+In the [VS Code extension](/en/vs-code#automate-browser-tasks-with-chrome), Chrome is available whenever the Chrome extension is installed. No additional flag is needed.
+
+<Note>
+  Enabling Chrome by default in the CLI increases context usage since browser tools are always loaded. If you notice increased context consumption, disable this setting and use `--chrome` only when needed.
+</Note>
+
+### Manage site permissions
+
+Site-level permissions are inherited from the Chrome extension. Manage permissions in the Chrome extension settings to control which sites Claude can browse, click, and type on.
 
 ## Example workflows
 
-Claude can navigate pages, click and type, fill forms, scroll, read console logs and network requests, manage tabs, resize windows, and record GIFs. Run `/mcp` and click into `claude-in-chrome` to see the full list of available tools.
-
-The following examples show common patterns for browser automation.
+These examples show common ways to combine browser actions with coding tasks. Run `/mcp` and select `claude-in-chrome` to see the full list of available browser tools.
 
 ### Test a local web application
 
 When developing a web app, ask Claude to verify your changes work correctly:
 
-```
+```text  theme={null}
 I just updated the login form validation. Can you open localhost:3000,
 try submitting the form with invalid data, and check if the error
 messages appear correctly?
@@ -104,9 +98,9 @@
 
 ### Debug with console logs
 
-If your app has issues, Claude can read console output to help diagnose problems:
-
-```
+Claude can read console output to help diagnose problems. Tell Claude what patterns to look for rather than asking for all console output, since logs can be verbose:
+
+```text  theme={null}
 Open the dashboard page and check the console for any errors when
 the page loads.
 ```
@@ -117,9 +111,9 @@
 
 Speed up repetitive data entry tasks:
 
-```
+```text  theme={null}
 I have a spreadsheet of customer contacts in contacts.csv. For each row,
-go to our CRM at crm.example.com, click "Add Contact", and fill in the
+go to the CRM at crm.example.com, click "Add Contact", and fill in the
 name, email, and phone fields.
 ```
 
@@ -129,8 +123,8 @@
 
 Use Claude to write directly in your documents without API setup:
 
-```
-Draft a project update based on our recent commits and add it to my
+```text  theme={null}
+Draft a project update based on the recent commits and add it to my
 Google Doc at docs.google.com/document/d/abc123
 ```
 
@@ -140,7 +134,7 @@
 
 Pull structured information from websites:
 
-```
+```text  theme={null}
 Go to the product listings page and extract the name, price, and
 availability for each item. Save the results as a CSV file.
 ```
@@ -151,10 +145,10 @@
 
 Coordinate tasks across multiple websites:
 
-```
+```text  theme={null}
 Check my calendar for meetings tomorrow, then for each meeting with
-an external attendee, look up their company on LinkedIn and add a
-note about what they do.
+an external attendee, look up their company website and add a note
+about what they do.
 ```
 
 Claude works across tabs to gather information and complete the workflow.
@@ -163,57 +157,67 @@
 
 Create shareable recordings of browser interactions:
 
-```
+```text  theme={null}
 Record a GIF showing how to complete the checkout flow, from adding
 an item to the cart through to the confirmation page.
 ```
 
 Claude records the interaction sequence and saves it as a GIF file.
 
-## Best practices
-
-When using browser automation, keep these guidelines in mind:
-
-* **Modal dialogs can interrupt the flow**: JavaScript alerts, confirms, and prompts block browser events and prevent Claude from receiving commands. If a dialog appears, dismiss it manually and tell Claude to continue.
-* **Use fresh tabs**: Claude creates new tabs for each session. If a tab becomes unresponsive, ask Claude to create a new one.
-* **Filter console output**: Console logs can be verbose. When debugging, tell Claude what patterns to look for rather than asking for all console output.
-
 ## Troubleshooting
 
 ### Extension not detected
 
 If Claude Code shows "Chrome extension not detected":
 
-1. Verify the Chrome extension (version 1.0.36 or higher) is installed
-2. Verify Claude Code is version 2.0.73 or higher by running `claude --version`
+1. Verify the Chrome extension is installed and enabled in `chrome://extensions`
+2. Verify Claude Code is up to date by running `claude --version`
 3. Check that Chrome is running
 4. Run `/chrome` and select "Reconnect extension" to re-establish the connection
 5. If the issue persists, restart both Claude Code and Chrome
 
+The first time you enable Chrome integration, Claude Code installs a native messaging host configuration file. Chrome reads this file on startup, so if the extension isn't detected on your first attempt, restart Chrome to pick up the new configuration.
+
+If the connection still fails, verify the host configuration file exists at:
+
+* **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**: check `HKCU\Software\Google\Chrome\NativeMessagingHosts\` in the Windows Registry
+
 ### Browser not responding
 
 If Claude's browser commands stop working:
 
-1. Check if a modal dialog (alert, confirm, prompt) is blocking the page
+1. Check if a modal dialog (alert, confirm, prompt) is blocking the page. JavaScript dialogs block browser events and prevent Claude from receiving commands. Dismiss the dialog manually, then tell Claude to continue.
 2. Ask Claude to create a new tab and try again
-3. Restart the Chrome extension by disabling and re-enabling it
-
-### First-time setup
-
-The first time you use the integration, Claude Code installs a native messaging host that allows communication between the CLI and Chrome. If you encounter permission errors, you may need to restart Chrome for the installation to take effect.
-
-## Enable by default
-
-Chrome integration requires the `--chrome` flag each time you start Claude Code. To enable it by default, run `/chrome` and select "Enabled by default".
-
-<Note>
-  Enabling Chrome by default increases context usage since browser tools are always loaded. If you notice increased context consumption, disable this setting and use `--chrome` only when needed.
-</Note>
-
-Site-level permissions are inherited from the Chrome extension. Manage permissions in the Chrome extension settings to control which sites Claude can browse, click, and type on. Run `/chrome` to see current permission settings.
+3. Restart the Chrome extension by disabling and re-enabling it in `chrome://extensions`
+
+### Connection drops during long sessions
+
+The Chrome extension's service worker can go idle during extended sessions, which breaks the connection. If browser tools stop working after a period of inactivity, run `/chrome` and select "Reconnect extension".
+
+### Windows-specific issues
+
+On Windows, you may encounter:
+
+* **Named pipe conflicts (EADDRINUSE)**: if another process is using the same named pipe, restart Claude Code. Close any other Claude Code sessions that might be using Chrome.
+* **Native messaging host errors**: if the native messaging host crashes on startup, try reinstalling Claude Code to regenerate the host configuration.
+
+### Common error messages
+
+These are the most frequently encountered errors and how to resolve them:
+
+| Error                                | Cause                                            | Fix                                                             |
+| ------------------------------------ | ------------------------------------------------ | --------------------------------------------------------------- |
+| "Browser extension is not connected" | Native messaging host cannot reach the extension | Restart Chrome and Claude Code, then run `/chrome` to reconnect |
+| "Extension not detected"             | Chrome extension is not installed or is disabled | Install or enable the extension in `chrome://extensions`        |
+| "No tab available"                   | Claude tried to act before a tab was ready       | Ask Claude to create a new tab and retry                        |
+| "Receiving end does not exist"       | Extension service worker went idle               | Run `/chrome` and select "Reconnect extension"                  |
 
 ## See also
 
-* [CLI reference](/en/cli-reference) - Command-line flags including `--chrome`
-* [Common workflows](/en/common-workflows) - More ways to use Claude Code
-* [Getting started with Claude for Chrome](https://support.anthropic.com/en/articles/12012173-getting-started-with-claude-for-chrome) - Full documentation for the Chrome extension, including shortcuts, scheduling, and permissions
+* [Use Claude Code in VS Code](/en/vs-code#automate-browser-tasks-with-chrome): browser automation in the VS Code extension
+* [CLI reference](/en/cli-reference): command-line flags including `--chrome`
+* [Common workflows](/en/common-workflows): more ways to use Claude Code
+* [Data and privacy](/en/data-usage): how Claude Code handles your data
+* [Getting started with Claude in Chrome](https://support.claude.com/en/articles/12012173-getting-started-with-claude-in-chrome): full documentation for the Chrome extension, including shortcuts, scheduling, and permissions