Claude for Chrome prompt
Set up "Claude for Chrome" so you (Claude Code) can drive my real browser - open pages, click around, read the console, reproduce a bug and fix it - instead of me pasting errors and screenshots in by hand. Walk me through it step by step, check what you can yourself, and don't change any of my settings without asking. First, work out my setup so the steps are right: - Am I running you in the terminal (the `claude` CLI) or in the VS Code extension? - What OS am I on, and am I using Google Chrome or Microsoft Edge? Claude for Chrome only works in Chrome or Edge - not Brave, Arc, or other browsers, and not inside WSL. - Run `claude --version` and tell me what it is. The browser feature needs Claude Code 2.0.73 or higher; if mine is older, tell me to update first (`claude update`, or reinstall) and stop here until I've done that. (If a bare `claude ...` command is blocked inside this session, re-run just that command with CLAUDECODE cleared: `CLAUDECODE= claude ...` on macOS/Linux, or `$env:CLAUDECODE=''; claude ...` in PowerShell.) STEP 1 - Install the extension. Give me this link and tell me to click "Add to Chrome" (the same extension also works in Edge), then sign in with my Claude account: https://chromewebstore.google.com/detail/claude/fcoeoabgfenejglbffodgkkbkcdhcgfn It's the official "Claude" extension by Anthropic (the "Claude in Chrome" beta). Tell me to confirm it shows as installed and enabled at `chrome://extensions`, and that it's version 1.0.36 or higher. STEP 2 - Connect it to Claude Code. You can't type these for me - they're commands *I* type - so give me the exact one for my setup and tell me what to expect: - Terminal: tell me to run `/chrome` inside this session (or to start Claude Code with `claude --chrome`). When the menu appears I can pick "Enabled by default" so I don't have to do this every time. - VS Code: tell me there's no flag - I just type `@browser` followed by a task in the prompt box, e.g. `@browser open localhost:3000 and check the console for errors`. STEP 3 - The one-time gotcha. The first time browser control is enabled, Claude Code writes a native-messaging host file that Chrome only reads at startup. So if the extension isn't detected on the first try, tell me to fully quit and reopen Chrome (or Edge) and try the connect step again. You can check whether that file already exists and tell me - on macOS it's `~/Library/Application Support/Google/Chrome/NativeMessagingHosts/com.anthropic.claude_code_browser_extension.json` (swap `Google/Chrome` for `Microsoft Edge` if I use Edge; on Linux it lives under `~/.config/...`; on Windows it's a registry key under `HKCU\Software\Google\Chrome\NativeMessagingHosts`). Don't create or edit it yourself - Claude Code writes it automatically; this is only so you can tell me whether a restart is what's needed. STEP 4 - Verify it actually works. Once I've connected, tell me to run `/chrome` to confirm the status shows the extension connected, and `/mcp` then pick "claude-in-chrome" to see the browser tools loaded. Then, as a real test, ask me to point you at a page (a localhost dev server, or any site) and open it and tell me what's on it, so we both see the browser control working. If something fails, the usual fixes are: confirm the extension is enabled at `chrome://extensions`, confirm `claude --version` is 2.0.73+, make sure Chrome is actually running, and in the `/chrome` menu choose "Reconnect extension"; if it still won't connect, restart both Chrome and Claude Code. Walk me through these one at a time rather than dumping them all at once.
Right now, fixing a bug in your app is a manual grind. You click around looking for what broke, copy the error out of the console, paste it into Claude Code, take a screenshot of the broken UI, and paste that in too - doing all the legwork yourself just to tell Claude what's wrong. Claude does the thinking, but you're still its eyes and hands.
Claude for Chrome fixes that. It's Anthropic's official browser extension (the 'Claude in Chrome' beta) that connects to Claude Code and lets it drive your actual browser. Instead of you describing the bug, Claude opens the page itself, clicks around to reproduce it, reads the console and the network tab, finds the errors, makes the fix, and checks that everything works - automatically. You point it at the page and let it run the loop. As the video put it: go watch House of the Dragon while it does the work.
Setup is three quick parts: install the extension from the Chrome Web Store, make sure your Claude Code is up to date, and connect the two. The prompt below walks you through all of it for your exact setup - terminal or VS Code, Chrome or Edge - checks your versions, hands you the exact command to type, covers the one restart-Chrome gotcha, and verifies the connection at the end. It only reads and checks things; it never changes your settings without asking.