home / mcp / playwright mcp server

Playwright MCP Server

Provides browser automation via Playwright using structured accessibility snapshots for reliable language-model interactions.

Installation

Add the following to your MCP client configuration file.

Configuration

View docs

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

Playwright MCP is a lightweight server that enables browser automation by exposing Playwright’s structured accessibility snapshots. It lets you control and query web pages without relying on pixel-based inputs or vision models, making it fast, deterministic, and friendly for language-model interactions.

How to use

You connect to the Playwright MCP server from an MCP client (such as a code editor extension or an IDE-based integration) to automate web pages using a stable, accessibility-based interface. Start the server with a simple command, then point your MCP client at the server to begin issuing actions like navigating pages, clicking elements, typing text, and more. You can run in standard mode using a local, bundled setup or enable a standalone URL endpoint to connect remotely.

Key interaction patterns include capturing a page snapshot for element references, performing actions such as click, type, and navigate, and optionally taking screenshots or PDFs if you enable vision-related features. For best performance, use the Snapshot mode by default, which relies on the accessibility tree instead of rendering pixels. If you need visual-based interactions, you can opt into Vision Mode by starting the server with the --vision flag, though this uses a different set of endpoints and data.

Typical workflow: configure a Playwright MCP server entry in your client, start the server, and then issue high-level actions through your MCP client interface. You can also run a standalone SSE endpoint for integration with clients that expect a streaming interface.

How to install

Prerequisites: you need Node.js 18 or newer to run the Playwright MCP server.

Option A: Configure a local stdio server (embedded in your client workflow) using npx

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

Standalone server and URL access

If you run a standalone Playwright MCP server on your machine, start it with an explicit port to enable SSE transport and then configure your MCP client to connect to the SSE endpoint.

npx @playwright/mcp@latest --port 8931
```
```
{
  "mcpServers": {
    "playwright": {
      "url": "http://localhost:8931/sse"
    }
  }
}

Install in different clients

You can install and configure the Playwright MCP server across multiple MCP clients. The following examples show how to register the server in common environments.

// VS Code style configuration to add the Playwright MCP server
{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [
        "@playwright/mcp@latest"
      ]
    }
  }
}

Configuration and options

Playwright MCP accepts a range of command-line options to customize browser behavior, network permissions, and how data is returned to clients. You can specify browser type, headless mode, viewport size, isolated profiles, storage state, and more. The visible options include enabling or disabling images, controlling which origins the browser can access, and selecting the browser channel or executable path.

Example of configuring a standalone server with an isolated context and a preloaded storage state:

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [
        "@playwright/mcp@latest",
        "--isolated",
        "--storage-state={path/to/storage.json}"
      ]
    }
  }
}

Tools and actions available

The server exposes a rich set of actions you can perform on web pages. These include taking page snapshots, clicking and typing, navigating, selecting options, handling dialogs, and more. You can also generate Playwright tests from scenarios and use a range of utilities to manage browser tabs, file uploads, and network observations.

Available tools

browser_snapshot

Capture accessibility snapshot of the current page, this is better than screenshot

browser_click

Perform click on a web page

browser_drag

Perform drag and drop between two elements

browser_hover

Hover over element on page

browser_type

Type text into editable element

browser_select_option

Select an option in a dropdown

browser_press_key

Press a key on the keyboard

browser_wait_for

Wait for text to appear or disappear or a specified time to pass

browser_file_upload

Upload one or multiple files

browser_handle_dialog

Handle a dialog

browser_navigate

Navigate to a URL

browser_navigate_back

Go back to the previous page

browser_navigate_forward

Go forward to the next page

browser_take_screenshot

Take a screenshot of the current page

browser_pdf_save

Save page as PDF

browser_network_requests

List network requests

browser_console_messages

Get console messages

browser_install

Install the browser specified in the config

browser_close

Close the page

browser_resize

Resize the browser window

browser_tab_list

List browser tabs

browser_tab_new

Open a new tab

browser_tab_select

Select a tab

browser_tab_close

Close a tab

browser_generate_playwright_test

Generate a Playwright test

browser_screen_capture

Take a screenshot in Vision mode

browser_screen_move_mouse

Move mouse to a given position

browser_screen_click

Click left mouse button

browser_screen_drag

Drag left mouse button

browser_screen_type

Type text