Playwright MCP

What microsoft/playwright-mcp does

The microsoft/playwright-mcp MCP server exposes Playwright browser automation through the Model Context Protocol. Agents can inspect a page’s accessibility snapshot, locate elements by text or regular expression, and perform actions against referenced nodes. This makes the interaction model based on structured page data rather than pixel coordinates or visual interpretation.

It can navigate to URLs, move backward in browser history, click, hover, drag between elements, select dropdown options, fill forms, type text, press keys, and wait for page state changes. Browser tabs can be listed, created, closed, or selected. The server also supports screenshots, console message retrieval, dialog handling, file uploads, and dropping files or MIME-typed data onto an element.

The tool set includes network request listing and detailed request inspection. Agents can evaluate JavaScript on a page or element, run Playwright code through an explicitly unsafe tool, and inspect or call WebMCP tools registered by the page.

How it works

The server uses Playwright to control the browser and returns accessibility-oriented page representations to the MCP client. browser_snapshot is the primary inspection tool for actions, while browser_find searches the current snapshot and returns matching nodes with surrounding context and their paths. Screenshots are available for visual reference, but the supplied tool description states that actions should use snapshots instead.

This approach fits exploratory automation, iterative browser workflows, and tasks that need ongoing browser state. It does not require a vision model to identify page controls. The MCP connection allows an agent to combine inspection, action, waiting, and verification steps within one browser session.

Setup and configuration

The microsoft/playwright-mcp MCP server requires Node.js 18 or newer and an MCP-compatible client. The standard local configuration starts it with npx:

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

The repository documents setup paths for clients including VS Code, Cursor, Windsurf, Claude Desktop, and Cline. Cursor can add it from MCP settings or use the equivalent npx @playwright/mcp@latest command. Cline’s example uses a local STDIO server configuration and adds -y to the npx arguments. Claude Desktop uses the standard MCP configuration format.

Tools and capabilities

Available operations include:

• Navigate, go back, resize the browser, and manage tabs.
• Capture accessibility snapshots or screenshots and search snapshots.
• Click, hover, drag, type, press keys, select options, and fill multiple fields.
• Upload files or drop paths and data onto page elements.
• Handle dialogs, wait for text or time, and read console messages.
• List network requests and retrieve details for an individual request.
• Evaluate page or element JavaScript and run Playwright code.
• List and call WebMCP tools exposed by the current page.

Limitations and notes

The microsoft/playwright-mcp MCP server is an MCP interface, while the repository notes that Playwright CLI with skills may suit coding-agent workflows where lower token usage is important. MCP is positioned for workflows that benefit from persistent state, introspection, and repeated reasoning over page structure.

browser_run_code_unsafe executes arbitrary JavaScript in the Playwright server process and is equivalent to remote-code execution in terms of risk. Use it only when that level of access is acceptable. WebMCP tool output is provided by the page and should be treated as untrusted. Screenshots cannot be used as the action basis according to the tool guidance; use browser_snapshot for page actions.

Getting started with this microsoft/playwright-mcp MCP server

Always refer to the official documentation for the most accurate and up-to-date information.