How to Use Playwright MCP with Chrome MCP

Direct answer: Playwright MCP can launch Chrome or attach to an existing Chrome session through a channel name or CDP endpoint. In this guide, “Chrome MCP” means Chrome DevTools MCP, Google’s MCP server for controlling and inspecting a live Chrome browser. Use Playwright MCP when you need Playwright browser automation and structured accessibility snapshots; use Chrome DevTools MCP when the work is centered on live Chrome inspection and debugging. These tools overlap, but neither is a universal replacement for the other.

Playwright MCP requires Node.js 20 or newer and an MCP-compatible client. Its documented browser support includes Chrome, Firefox, WebKit, and Microsoft Edge. Chrome DevTools MCP is Chrome-specific. The recommendation about which tool fits a task is based on each project’s documented scope, not on an official performance benchmark.

What Playwright MCP and Chrome DevTools MCP do

Question	Playwright MCP	Chrome DevTools MCP
Primary focus	Browser automation through Playwright, with structured accessibility snapshots and browser actions.	Controlling and inspecting a live Chrome browser, especially for DevTools-oriented inspection and debugging.
Browser scope	Chrome, Firefox, WebKit, and Edge are documented options.	Chrome.
Connection	Launch a configured browser, connect by channel name, or connect through a CDP endpoint.	Connect to and control a live Chrome browser using the setup documented by Google.
Best starting point	Automated navigation, forms, clicks, screenshots, tests, and repeatable workflows.	Live-page inspection, browser debugging, and Chrome-specific diagnosis.

Read the official references before publishing or deploying because package names, client setup, and Chrome configuration options can change: Playwright MCP getting started, Playwright browser connections, and Chrome DevTools for agents.

Install Playwright MCP

Install Node.js 20 or newer.
Choose an MCP-compatible client and open its MCP configuration.
Add the Playwright server configuration below.
Restart the client and approve the browser tools when prompted.

{"mcpServers":{"playwright":{"command":"npx","args":["@playwright/mcp@latest"]}}}

The exact configuration file location depends on your client. Follow that client’s MCP instructions for where to save the entry. The @latest tag follows the official getting-started example; pin a reviewed version if your deployment requires reproducible installs.

Connect Playwright MCP to Chrome

Use the Chrome channel

To connect to an already-running Chrome or Edge instance, Playwright documents a channel-name route. In the target browser, open chrome://inspect/#remote-debugging and enable Allow remote debugging for this browser instance. Then use:

{"mcpServers":{"playwright":{"command":"npx","args":["@playwright/mcp@latest","--cdp-endpoint=chrome"]}}}

Use this only on a machine and browser profile you intend the agent to access. Do not assume that a remote-debugging endpoint is safe to expose to a network.

Use a CDP endpoint

If Chrome exposes a CDP endpoint on your machine, configure the endpoint URL instead:

{"mcpServers":{"playwright":{"command":"npx","args":["@playwright/mcp@latest","--cdp-endpoint=http://localhost:9222"]}}}

The endpoint shown here is the form documented by Playwright. Use the address and security controls appropriate to your own environment. Keep the endpoint local unless you have deliberately secured access.

Launch a browser instead

For a clean, repeatable workflow, let Playwright MCP launch its configured browser rather than attaching to your daily Chrome session. The configuration reference documents browser selection, with Chrome as the default and Firefox, WebKit, and Edge also available. Check the current options reference for supported flags at publication time.

Choose a browser profile mode

Playwright MCP documents three approaches. Pick one deliberately because cookies and login state determine what the agent can see and do.

Mode	Use it when	Trade-off
Persistent	The workflow needs saved cookies, settings, or login state between sessions.	Useful for authenticated work, but the profile retains sensitive state.
Isolated	Each run should begin with a fresh browser context.	You avoid inherited login state; provide initial storage state when a controlled session is required.
Browser extension	The agent must work with existing tabs in the current browser.	Those tabs and their authenticated content become available to the connected workflow.

Persistent mode is the documented default. Use an isolated context for untrusted pages or reproducible jobs, and use extension mode only when current tabs are part of the task. See Playwright’s installation guide and configuration reference for current profile options.

Use Chrome DevTools MCP instead

Choose Chrome DevTools MCP when the task is specifically about a live Chrome browser and DevTools-style inspection or debugging. Google describes it as a way for a coding agent to control and inspect Chrome, with setup instructions for MCP-compatible tools and IDEs. Start with Google’s getting-started guide and verify the current configuration reference at Chrome DevTools configuration.

Choose Playwright MCP when you want Playwright’s browser automation model, structured accessibility snapshots, repeatable actions, or the option to target browsers other than Chrome. You can also connect Playwright MCP to the same live Chrome session through a channel or CDP endpoint. These are task-based choices; the official sources do not establish a speed, token, reliability, or tool-count winner.

A practical workflow for using both

Start with a controlled profile. Use an isolated or dedicated persistent profile instead of your everyday browser.
Use Playwright MCP for actions. Navigate, locate elements from accessibility snapshots, fill forms, click controls, and collect page results.
Use Chrome DevTools MCP for diagnosis. When a live Chrome page needs inspection or debugging, connect the Chrome-specific server described in Google’s documentation.
Keep the boundary explicit. Do not connect both servers to an authenticated profile unless the agent is trusted and the extra access is necessary.
Record the session choice. Document whether the run used a fresh context, saved cookies, or existing tabs so results are reproducible.

Security and session handling

Browser MCP access is sensitive. Playwright warns that its JavaScript execution capability can run arbitrary code in the server process and is equivalent to remote code execution; enable it only for trusted MCP clients. Chrome warns that the agent may inspect or modify browser data and act through authenticated sessions.

Connect only a profile you intend the agent to access.
Prefer a dedicated browser profile for automation.
Use isolated mode for workflows that do not need saved authentication.
Review enabled tools and capabilities before granting access.
Keep CDP endpoints local unless you have secured them deliberately.
Assume that an authenticated browser can perform actions, not merely read pages.

These precautions follow directly from the vendors’ security warnings in the Playwright capabilities reference and Google’s Chrome DevTools MCP guidance.

Common errors and fixes

Error or symptom	Likely cause	Fix
`npx` cannot start the server	Node.js is missing or older than version 20.	Install Node.js 20 or newer, then restart the MCP client.
The client shows no Playwright tools	The JSON was saved in the wrong client configuration file or the client was not restarted.	Use the client’s MCP setup instructions, validate the JSON, and restart the client.
Chrome connection fails	Remote debugging is disabled, the channel is wrong, or the CDP URL is unreachable.	Enable remote debugging in `chrome://inspect/#remote-debugging`, verify the channel, or check the local CDP endpoint.
The agent sees the wrong tabs	It connected to an existing browser or extension session.	Close unrelated tabs, use a dedicated profile, or switch to isolated mode.
Login state disappears	The run uses an isolated context or a new profile.	Use persistent mode or provide controlled initial storage state.
Actions work but debugging data is missing	Playwright automation and Chrome DevTools inspection expose different capabilities.	Use Chrome DevTools MCP for the live inspection task, or keep Playwright for the browser actions.
A page is blank or blocked	The target site may require authentication, reject automation, or fail to load.	Check the page manually in the connected profile, inspect the browser state, and capture diagnostics before retrying.

Performance, reliability, and cost considerations

Performance

Reuse a deliberate persistent browser only when saved state removes repeated login work. For independent jobs, isolated contexts improve repeatability but add setup overhead. Avoid attaching an agent to a profile with many unrelated tabs, extensions, and background activity.

Reliability

Make selectors and profile choices explicit, wait for the page state your task needs, and keep browser and MCP package versions reviewed. A live Chrome connection adds another dependency: Chrome must remain available and its debugging endpoint must stay reachable.

Cost

Playwright MCP and Chrome DevTools MCP are software integrations; their documentation does not provide a universal cost or performance benchmark. If the goal is simply to obtain screenshots rather than automate a browser session, ScreenshotNeo can remove the browser setup:

Or skip the browser setup

ScreenshotNeo is a website screenshot API and MCP server. A single GET request returns a PNG, JPEG, WebP, or PDF. It accepts cookie and consent banners before capture, removes more than 60 known consent platforms plus newsletter popups and chat widgets, and lets you turn each cleanup step off. Bot checks, CAPTCHAs, blank pages, timeouts, failed loads, and cache hits are not billed; response headers identify the page verdict and whether the request was billed. Its MCP server provides take_screenshot, get_page_info, and capture_pdf for Claude, Cursor, and other MCP clients.

See the ScreenshotNeo API documentation for all options, including full-page capture, CSS-element capture, dark mode, device presets, retina scale, PDF paper sizes and page ranges, custom CSS and JavaScript, clicks, waits, blocking rules, headers, cookies, user agents, authorization, timezone, geolocation, transparent backgrounds, resizing, caching, signed links, asynchronous jobs, bulk capture, usage data, and the OpenAPI specification.

cURL

curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webp

Python

import requests
r = requests.get("https://api.screenshotneo.com/v1/shot", params={"access_key": "YOUR_API_KEY", "url": "https://stripe.com"}, timeout=90)
open("shot.webp", "wb").write(r.content)

Node.js

const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);

The Free plan includes 1,000 screenshots each month with no card. Paid plans start at $5 for 3,000 shots, and every feature is available on every plan. Create a free ScreenshotNeo account.

FAQ

Is Chrome MCP the same as Playwright MCP?

No. In this article, Chrome MCP refers to Chrome DevTools MCP, Google’s Chrome-focused server. Playwright MCP exposes Playwright automation and can target several browser engines.

Can Playwright MCP connect to my open Chrome?

Yes. Playwright documents a Chrome channel option and a CDP endpoint option for connecting to an already-running Chrome or Edge instance.

Should I use my normal Chrome profile?

Usually use a dedicated profile. A connected authenticated profile can expose private data and permit actions through existing sessions.

Does Chrome DevTools MCP replace Playwright MCP?

No universal replacement is documented. Choose according to whether the task centers on Playwright automation or live Chrome and DevTools inspection.

Can I use ScreenshotNeo with an MCP client?

Yes. ScreenshotNeo provides an MCP server with screenshot, page-info, and PDF capture tools, alongside its HTTP API.