Browser MCP Tools: Choosing the Right One

View as Markdown

Three MCP servers provide browser control for AI coding agents. Each serves a different purpose.

Quick Comparison

	Shiplight	Playwright	Chrome DevTools
Browser	Launches new, attaches via CDP, or relay extension	Launches its own Chromium	Connects to existing Chrome
Session state	Fresh, persistent profile, or real browser	Always fresh, no cookies/logins	Your real session with all logins
Page interaction	Full — navigate, click, type, verify	Full — navigate, click, type, fill forms	Limited — evaluate JS, click, type
Test authoring	Purpose-built — interact and build YAML E2E tests	Manual — infer from snapshots	Manual — inspect DOM to find selectors
Debugging	Console logs, network logs, page inspection	Console messages, network requests	Full DevTools — network, performance, memory, Lighthouse

Shiplight MCP

The most versatile browser MCP. Built for coding agents to fully automate UI development and testing without human intervention. Three ways to get a browser session:

1. new_session — launch a fresh Chromium instance with optional emulation, extensions, and persistent profiles. See MCP Tool Reference.

2. attach_to_browser with CDP URL — connect directly to a running browser via Chrome DevTools Protocol:

   Attach to my browser at ws://localhost:9222/devtools/browser/...

3. attach_to_browser via Chrome extension relay — auto-discover tabs in your existing Chrome browser. Requires the Shiplight Chrome extension and SHIPLIGHT_RELAY_PORT in your .env:

   SHIPLIGHT_RELAY_PORT=15170

Use when: verifying UI changes, writing regression tests, debugging test failures, exploring app behavior — especially in automated workflows where no human is in the loop.

Playwright MCP

A lightweight alternative for browser interaction. Opens a clean Chromium instance with an accessibility-tree-based interaction model. Good for simple page verification when you don't need test authoring capabilities.

Use when: quick page checks in a clean session, simple UI verification.

Chrome DevTools MCP

Best for deep debugging and inspection. Connects to your real Chrome browser with all your cookies, sessions, and extensions intact. Gives access to the full DevTools Protocol — network requests, console messages, performance traces, memory snapshots, Lighthouse audits.

Use when: inspecting network traffic, diagnosing performance issues, debugging console errors, auditing a live page.

Can I Use Multiple?

Yes. All three can be used by AI coding agents autonomously and they complement each other:

• Use Shiplight for everything — verifying changes, writing tests, debugging, and connecting to your real browser
• Use Chrome DevTools when you need deep DevTools Protocol access (performance traces, memory snapshots, Lighthouse)
• Use Playwright as a lightweight fallback when you just need a quick page check

Shiplight is purpose-built for agent-driven workflows; Playwright and Chrome DevTools are general-purpose browser tools that agents can also leverage.