Puppeteer MCP in Claude Code

Quick answer: Install the Puppeteer MCP server with npx -y @modelcontextprotocol/server-puppeteer, add the JSON block below to ~/.claude/settings.json, restart Claude Code, and run /mcp to confirm the connection. Setup runs about 5 minutes on a fresh machine, verified on @modelcontextprotocol/server-puppeteer as of April 15, 2026.

The Puppeteer MCP server hands Claude Code a headless Chrome it can drive. The model can open pages, click elements, fill forms, take screenshots, and run JavaScript in the browser context. That turns Claude into a capable tester and scraper, handy for checking rendered output, debugging web apps, or extracting data from sites without an API.

This guide covers what you get after the wiring is done, the exact config, verification steps, prompt patterns that tend to work well, and the 4 issues that trip people up most often in the first week.

What you get when it is connected

Once the Puppeteer server is attached, Claude Code can call the server tools from inside any conversation. You do not invoke the tools by hand. When you ask Claude a question the model decides which tool to call and parses the response for you. For teams that live inside Puppeteer day to day, this replaces dozens of context switches per week with a single line in chat.

Tools exposed: navigate, screenshot, click, fill, select, hover, evaluate. The evaluate tool runs arbitrary JS in page context, which is the escape hatch when the other tools do not cover a case. Pages that detect headless mode (reCAPTCHA, some paywalls) will still block the server. For those sites, consider a stealth plugin build or a different scraping path.

Prerequisites

Node 20 or later on the host. A working Chrome install is downloaded automatically on first run. Around 300 MB of disk space for the Chromium bundle.

If you use a version manager like nvm or asdf for Node, confirm the version Claude Code inherits. Open a terminal, run node -v, and note the output. Claude Code uses the Node it sees on PATH at launch, so a shell profile that sets the right version is the reliable path.

Install via npx

Run the package once with npx to verify it starts cleanly:

npx -y @modelcontextprotocol/server-puppeteer

The first run downloads the package (a few MB) and starts the server on stdio. The server does not print much on success - it waits for MCP protocol messages on stdin. Press Ctrl-C to stop it. The actual runtime setup happens through Claude Code itself in the next step.

If the install fails with a network error, your npm registry may be blocked. Set npm config set registry https://registry.npmjs.org and retry. Behind a corporate proxy, also set HTTP_PROXY and HTTPS_PROXY in your shell.

Add the config block to ~/.claude/settings.json

Open ~/.claude/settings.json in your editor. If the file does not exist yet, create it with {} as the starting content. Add an mcpServers object with an entry for this server:

{
  "mcpServers": {
    "puppeteer": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-puppeteer"]
    }
  }
}

Save the file. If you already have other MCP servers defined, merge the new entry into the existing mcpServers object rather than replacing it.

Restart Claude Code fully (quit and reopen, not just close the window). The server is spawned lazily on the first tool call in a session, not at launch, but the config is read once per Claude Code start.

Verify the connection

Open a new Claude Code session and type /mcp at the prompt. You should see the server listed with a green or connected indicator. If it shows as failed, click into it for the stderr output - the error message usually points at the problem directly (bad token, wrong path, missing Node).

Run a trivial first prompt to confirm round trips work. Good smoke tests:

• For read servers: ask for a list of whatever resource type it exposes.
• For write servers: ask for a describe on a known resource first, then try a safe write on a test resource.

If the first prompt works, the wiring is done. From here on you interact with the server purely through normal prompts in Claude Code.

Example prompts that work well

Here are prompts that tend to get good responses once the server is attached:

• Open https://example.com in the browser, take a full-page screenshot, and save it to tmp/example.png.
• Navigate to my staging site login page, fill the form with user test@example.com and the password in env TEST_PW, then screenshot the dashboard.
• Go to news.ycombinator.com, grab the top 30 story titles and their point counts, and give me the results as a markdown table.
• Run document.querySelectorAll on h2 tags across the current page and report how many matched along with their text content.
• Fill out the signup form on my dev server at localhost:3000, submit it, and verify the success toast appears.
• Click the Settings link, wait for the drawer to slide in, then screenshot the element with selector #settings-panel.

Claude will chain tool calls on its own when the prompt implies several steps. For a summarize-then-write flow the model will often call read tools first, then a single write tool at the end. If a prompt keeps burning tool calls, narrow it: specify the resource ID, the time range, or the exact field you want rather than asking Claude to scan everything.

Environment variable security

No API key is needed. The server does accept an optional PUPPETEER_EXECUTABLE_PATH env var if you want to pin to an existing Chrome or Chromium install instead of the bundled one. On resource-constrained machines, set PUPPETEER_HEADLESS=new to switch to the lighter mode.

A general rule across every MCP server: never paste secrets directly into settings.json that lives in a shared or git-tracked directory. Keep the actual secret values in your shell profile (~/.zshrc, ~/.bashrc, or a 1Password-cli helper), export them at shell start, and reference the variable names from the Claude config. That way the secret stays on your machine and the config file is safe to share with teammates.

On macOS, terminals launched from Spotlight or from the Dock both inherit the shell profile. If you launch Claude Code from a GUI shortcut that does not go through a shell, env vars may not propagate - launch from a terminal instead.

Troubleshooting

First launch hangs while downloading Chromium. The 180 MB download runs once. If your network is slow or proxied, set the PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true env var, install Chrome manually, and point PUPPETEER_EXECUTABLE_PATH at the binary.

Screenshots come back mostly blank on macOS. macOS sometimes denies Chrome a display on first run. Grant the terminal app that launched Claude Code the Accessibility permission, then restart Claude Code.

Pages time out before they finish loading. The default navigation timeout is 30 seconds. Ask Claude to pass a longer timeout on the navigate call, or wait for a specific selector that only appears after the page is ready.

Cookies or sessions do not persist across calls. Each tool call opens a fresh browser context unless you explicitly name one. Ask Claude to reuse a named context across navigate and click calls, or stash the session cookie and set it on the next navigate.

For any issue not listed here, the first step is /mcp inside Claude Code to see the current status and any recent stderr from the server. The second step is running the exact npx command from your terminal to see if the server starts cleanly outside Claude Code. Between those two checks, most problems become obvious within a minute.

Next steps

Once the Puppeteer server is attached and verified, the useful next move is writing a short prompt template you keep in your notes. List the 3 or 4 prompts you run most often against this server, and paste them into Claude Code when needed. Over a few weeks you build a personal command library that gets real work done without typing much.

For team projects, commit a .mcp.json at the repo root with the same structure. Everyone on the team gets the server wired up automatically on first open, and individual secrets stay in shell profiles. That is the setup pattern that scales past a single developer.