Skip to content
↑↓navigate↵openescclose
Claude+372Whisper+228LangChain+168Codex+223NotebookLM+276DALL-E 3+192DeepL+249n8n+208Topaz Video AI+153LlamaIndex+161

Playwright MCP vs Chrome DevTools MCP

Playwright MCP suits browser workflows across Chromium, Firefox and WebKit. Chrome DevTools MCP suits developers investigating Chrome performance, network requests and memory.

At a glance

At a glancePlaywright MCPGives an assistant a real browser to click, type and read pages withChrome DevTools MCPDrives and inspects a live Chrome instance through the DevTools protocol.
Weekly downloads3.9M2.2M
OfficialOfficialOfficial
RuntimeNodeNode
Transportstdiostdio
AuthNot requiredNot required
Tools2514
LicenseApache-2.0Apache-2.0
Installnpx -y @playwright/mcp@latestnpx -y chrome-devtools-mcp@latest
8-week trend+13.5% in 7 days+24.3% in 7 days

When to pick Playwright MCP

  • Choose Playwright MCP when a browser flow needs checking in Chromium, Firefox or WebKit. Its browser selection lets you explore the same form or navigation sequence across those engines instead of limiting the investigation to Chrome.
  • Use it when your agent needs to inspect page structure, identify a control and act on it. browser_snapshot returns structured accessibility information, and browser_click accepts a snapshot reference or unique selector. This workflow does not require a vision model.
  • Pick it for repeated sessions that need controlled starting state. Keep login information in a persistent profile, or use --isolated with --storage-state to load saved cookies and local storage into an isolated context. Closing an isolated browser discards that session's state.
  • Choose it when you need to prepare the browser before exploring a page. --init-page runs setup through the Playwright page object, while --init-script runs JavaScript before page scripts. Device emulation and viewport settings also help when checking layouts under different browser conditions.

When to pick Chrome DevTools MCP

  • Choose Chrome DevTools MCP when a slow page needs a performance investigation. Use performance_start_trace and performance_stop_trace to record browser activity, then performance_analyze_insight to investigate the recorded performance information.
  • Pick it when reproducing a failure requires inspecting individual requests and console output. list_network_requests and get_network_request support request investigation, and console messages include source-mapped stack traces.
  • Use it when your investigation includes memory or a Lighthouse audit. take_heapsnapshot supports memory investigations, while lighthouse_audit lets the agent run an audit from the same browser session used to navigate and interact with the page.
  • Choose it when the problem is already visible in a running Chrome instance. The server can attach through a remote debugging port, or launch its own browser. Its automation uses Puppeteer and waits for action results.

Main differences

  • Browser coverage differs. Playwright supports Chromium, Firefox and WebKit; Chrome DevTools MCP officially supports Google Chrome and Chrome for Testing. Its documentation does not guarantee other Chromium-based browsers will work correctly.
  • Both handle navigation, forms, snapshots, screenshots, console output and network inspection. Playwright centers its interaction model on accessibility snapshots. Chrome DevTools adds explicit performance trace, insight, Lighthouse and heap snapshot tools. Playwright also documents optional devtools capabilities, so the distinction is not automation versus debugging.
  • Both documented base setups run a Node process over stdio without server authentication. Playwright additionally documents a standalone HTTP connection using --port. Server authentication is separate from the browser session: Playwright can retain site logins in its persistent profile.
  • Both can connect to existing browsers. Playwright offers a CDP endpoint and an extension for Chrome or Edge; Chrome DevTools supports attaching to running Chrome through remote debugging. Playwright's extension route requires installing its browser extension.
  • Chrome DevTools documents default usage-statistics collection and possible transmission of trace URLs to the Google CrUX API. Disable these separately with --no-usage-statistics and --no-performance-crux. Playwright's supplied documentation describes controls for image responses and secret substitution, but does not establish that all data stays local. Secret substitution is explicitly a convenience, not a security boundary.

Setup

For Playwright MCP, configure your MCP client to launch npx -y @playwright/mcp@latest. The documented minimum is Node.js 18. Claude Code also supports the documented registration command claude mcp add playwright npx @playwright/mcp@latest. Add browser or session flags to the server arguments as needed.

For Chrome DevTools MCP, configure the client to launch npx -y chrome-devtools-mcp@latest. Its requirements include Node.js LTS, npm and current stable Chrome or newer. The browser starts when a tool first needs it; connecting the MCP client alone does not launch Chrome.

· github.com/microsoft/playwright-mcp, github.com/ChromeDevTools/chrome-devtools-mcp