Home / MCP / Playwright MCP Server

Playwright MCP Server

Provides live Playwright browser context to MCP clients for reliable AI-assisted test generation.

javascript

29stars

View on GitHub

Installation

Add the following to your MCP client configuration file.

Configuration

View docs

{
    "mcpServers": {
        "playwright_mcp": {
            "command": "npx",
            "args": [
                "-y",
                "playwright-mcp"
            ]
        }
    }
}

Playwright MCP gives your AI assistants real browser context by exposing a Playwright-controlled browser to the MCP workflow. It lets you record interactions, capture screenshots, extract the DOM, and run JavaScript inside the page, so your AI can generate solid, context-aware Playwright tests instead of guessing selectors or guessing how pages work.

How to use

Use Playwright MCP with an MCP client to give your AI tools live page context. You can connect through local stdio servers or via an MCP-enabled IDE or desktop assistant. With the server running, you can record interactions, take screenshots, fetch the full DOM, and execute arbitrary code inside the browser to debug and automate tests.

How to install

Prerequisites you need before installing are straightforward.

• Node.js installed on your system

• Playwright and its Chromium browser installed

• An MCP-capable IDE or assistant (for example Cursor)

Follow these concrete steps to get up and running quickly.

1) Install the MCP package globally for CLI access

2) Set up your MCP client (Cursor or Claude) to connect to the local MCP server

Additional setup and configuration

Playwright MCP can be connected to your MCP client in two common ways, depending on your preferred workflow.

{
  "mcpServers": {
    "playwright-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "playwright-mcp"
      ]
    }
  }
}

Connect it to Claude desktop

If you want to use Claude Desktop, install the MCP server CLI and wire it into Claude’s config so Claude can talk to Playwright MCP.

Install the MCP server globally.

Run the installation command.

Update Claude’s configuration so Claude can find the MCP server. Then restart Claude Desktop and verify by asking Claude to list available MCP tools.

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": ["-y", "playwright-mcp"]
    }
  }
}

Verification and tools

After setup, you should be able to prompt your AI assistant to initialize a browser session and start producing tests with live page context. The assistant can list and use available MCP tools to get context, DOM, screenshots, and to run code inside the page.

Tools and capabilities

You gain access to several MCP tools that the AI can call to interact with the page and gather context.

Notes and troubleshooting

- If you don’t see the expected tools, ensure the MCP server is running and that the client is connected to the correct endpoint.

- Restart the client after installing or changing MCP server configurations to apply changes.

Available tools

get-context

Fetches the current browser context from the running Playwright instance so the AI can reason about available pages, frames, and interactions.

get-full-dom

Extracts the full page DOM as HTML along with relevant metadata to help the AI generate accurate selectors and actions.

get-screenshot

Captures screenshots of elements or entire pages to provide visual context for test generation and debugging.

execute-code

Runs arbitrary JavaScript inside the browser context to help with debugging, data extraction, or custom automation steps.

init-browser

Launches a new browser instance and initializes the Playwright context for subsequent interactions and test recording.

validate-selectors

Validates and normalizes selectors against the current DOM to reduce flaky tests and improve reliability.