Chrome DevTools MCP (Standard)

Standard browser automation for agents via Chrome DevTools MCP — official Google project giving AI agents full Chrome DevTools access. 29 tools for input aut...

Security Scan

The SKILL.md and tools are coherent with a local Chrome DevTools automation integration, but the package claims to be an 'official Google project' while no homepage/source is provided and the instructions rely on npx @latest — a combination that increases supply-chain and provenance risk.

Purpose & Capability

The name, description, and listed tools (navigation, click/fill, evaluate_script, network inspection, Lighthouse, traces) are internally consistent with a browser automation/devtools skill. However the README claims 'Official Google project' but registry metadata shows no homepage or source repository — that mismatch is unexplained and worth verifying before trusting the package.

Instruction Scope

All runtime instructions are limited to installing and running an MCP server and calling DevTools-style actions. This matches the stated purpose. Be aware evaluate_script and network/console inspection tools grant the agent the ability to run arbitrary JS in page context and inspect network traffic and console output — expected for this tool but high-impact if used on sensitive pages.

Install Mechanism

There is no registry install spec in the skill bundle, but the SKILL.md recommends npm i -g chrome-devtools-mcp or npx -y chrome-devtools-mcp@latest. Relying on npx @latest fetches dynamic code from npm at runtime and increases supply-chain risk. The absence of a canonical homepage/repo to validate the npm package makes this riskier.

Credentials

The skill does not request environment variables or credentials in metadata (reasonable). Nevertheless, once running it has broad access to page state (DOM, localStorage, cookies visible to the page) and network requests. Those capabilities are proportional to browser automation but can expose sensitive data if used on authenticated or private pages.

Persistence & Privilege

No 'always: true' or other elevated persistence is requested; model invocation is allowed (default) which is expected for skills. The skill does not declare writes to other skills' config or system-wide settings in the bundle.

What to consider before installing

This skill looks like a legitimate Chrome DevTools integration in terms of functionality, but the package provenance is unclear. Before installing: (1) verify the npm package and source repository (confirm it's actually maintained by Google or a trusted author); (2) prefer installing a pinned, audited version (avoid npx @latest) or install from a verified GitHub release; (3) run the server in an isolated environment or container and avoid using it on pages with sensitive auth/cookies until you trust the package; (4) be aware that evaluate_script and network inspection let the agent read page content and potentially exfiltrate data — only grant access for use-cases that require it.

Chrome DevTools MCP

Official Google project — gives AI coding agents full Chrome DevTools access via the Model Context Protocol (MCP). Free, open-source, runs locally with your own Chrome browser. No cloud dependency, no usage limits.

Install

Prerequisites

• Node.js v20.19+ (check: node --version)
• Google Chrome stable (check: which google-chrome or which chromium-browser)
  • On Ubuntu/Debian: wget -q https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb && sudo apt install -y ./google-chrome-stable_current_amd64.deb
  • On macOS: Install from google.com/chrome or brew install --cask google-chrome
  • On ARM64 Linux: Use chromium-browser or Chrome for Testing

Install the MCP Server

npm i -g chrome-devtools-mcp

Or run directly with npx (no global install):

npx -y chrome-devtools-mcp@latest

MCP Server Config

Add to your agent's MCP config (config.yaml, .mcp.json, etc.):

Standard config:

{
  "mcpServers": {
    "chrome-devtools": {
      "command": "npx",
      "args": ["-y", "chrome-devtools-mcp@latest", "--no-usage-statistics"]
    }
  }
}

Slim mode (lightweight, basic browser tasks only, lower resource usage):

{
  "mcpServers": {
    "chrome-devtools": {
      "command": "npx",
      "args": ["-y", "chrome-devtools-mcp@latest", "--slim", "--headless", "--no-usage-statistics"]
    }
  }
}

Claude Code plugin (MCP + skills):

/plugin marketplace add ChromeDevTools/chrome-devtools-mcp
/plugin install chrome-devtools-mcp

OpenClaw (in config.yaml):

mcp:
  servers:
    chrome-devtools:
      command: npx
      args: ["-y", "chrome-devtools-mcp@latest", "--no-usage-statistics"]

Tool Categories (29 Tools)

Input Automation (9 tools)

• click — Click elements by uid from snapshot
• drag — Drag one element onto another
• fill — Type text into input/textarea/select
• fill_form — Fill out multiple form fields at once
• handle_dialog — Accept/dismiss browser dialogs
• hover — Hover over an element
• press_key — Press keys or shortcuts (Enter, Ctrl+A, etc.)
• type_text — Type into focused input with optional submit key
• upload_file — Upload file through file input element

Navigation (6 tools)

• navigate_page — Navigate to URL
• new_page — Open new browser page/tab
• close_page — Close page by index
• list_pages — List all open pages
• select_page — Switch active page
• wait_for — Wait for condition (selector, text, network, etc.)

Debugging (6 tools)

• take_snapshot — Get page accessibility tree with element UIDs
• take_screenshot — Screenshot of page or element (PNG/JPEG)
• evaluate_script — Run arbitrary JS in page context
• list_console_messages — Get console.log/warn/error output
• get_console_message — Get specific console message details
• lighthouse_audit — Run full Lighthouse audit (performance, a11y, SEO, best practices)

Performance (4 tools)

• performance_start_trace — Start Chrome performance trace recording
• performance_stop_trace — Stop trace and get results
• performance_analyze_insight — Get actionable performance insights from trace
• take_memory_snapshot — Capture heap snapshot for memory analysis

Network (2 tools)

• list_network_requests — Get all network requests (URL, status, timing, size)
• get_network_request — Get details for specific request

Emulation (2 tools)

• emulate — Emulate device (mobile/tablet), geolocation, CPU throttling, network throttling
• resize_page — Resize viewport to specific dimensions

Standard Workflow

1. Navigate and Snapshot

navigate_page(url) → get page loaded
take_snapshot() → get element tree with UIDs

2. Interact

click(uid) → click an element
fill(uid, value) → fill a form field
press_key("Enter") → submit form
wait_for({type: "selector", selector: ".result"}) → wait for result

3. Inspect

take_snapshot() → see updated page state
list_console_messages() → check for JS errors
list_network_requests() → check API calls
take_screenshot() → visual verification

4. Debug / Audit

evaluate_script("document.querySelector('.price').textContent") → extract data
lighthouse_audit() → full performance/SEO/a11y audit
performance_start_trace() → start perf trace

Decision Rules

Use Chrome DevTools MCP when:

• You need to navigate, click, fill forms, or take screenshots of web pages
• You need to inspect console errors, network requests, or page state
• You need performance analysis (traces, Lighthouse audits)
• You need to emulate mobile devices or throttle network/CPU
• You need reliable, local browser automation with no usage limits
• The built-in browser_* tools fail (Browserbase limits, timeouts)

Still use built-in browser_* tools when:

• The MCP server isn't installed or Chrome isn't available
• You're on a headless server without display (use --headless flag with MCP)
• Quick one-off URL content extraction (prefer web_extract or web_search first)

MCP vs dev-browser:

• Chrome DevTools MCP is the primary standard — use it first
• dev-browser is a fallback for scripts and repeatable workflows
• Avoid cloud browser services (Browserbase, Browser Use) — they have usage limits and cost money

Troubleshooting

Chrome not found:

# Ubuntu/Debian amd64:
wget -q https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb
sudo apt install -y ./google-chrome-stable_current_amd64.deb

# Or use Chrome for Testing:
npx @puppeteer/browsers install chrome@stable

# macOS:
brew install --cask google-chrome

Node.js version too old:

node --version  # needs v20.19+
# Use nvm to upgrade:
nvm install 22
nvm use 22

MCP server won't connect:

• Ensure Chrome is installed and accessible in PATH
• Try npx -y chrome-devtools-mcp@latest --headless for headless environments
• Check --no-usage-statistics flag to disable Google telemetry
• For OpenClaw, verify MCP config in config.yaml

References

• GitHub: https://github.com/ChromeDevTools/chrome-devtools-mcp
• Tool reference: https://github.com/ChromeDevTools/chrome-devtools-mcp/blob/main/docs/tool-reference.md
• Slim mode: https://github.com/ChromeDevTools/chrome-devtools-mcp/blob/main/docs/slim-tool-reference.md
• Troubleshooting: https://github.com/ChromeDevTools/chrome-devtools-mcp/blob/main/docs/troubleshooting.md