Playwright MCP Server for VS Code: Setup & Config

What you can do with Playwright in VS Code

Pick it for Playwright automation with device presets, test generation, and automatic browser setup.

• Test responsive pages using phone and tablet emulation profiles.
• Generate browser test code from an AI workflow.

Before you start: Playwright in VS Code

• An MCP-compatible client
• npm/npx tooling
• Playwright browser binaries, installed automatically if missing

This is the documented stdio configuration. HTTP mode uses --port 8931 and requires type: http in the client. The server binds to localhost; the README describes SSH tunneling for remote access.

Playwright VS Code configuration

1. Choose VS Code configuration scope

   For Playwright MCP Server, open Workspace: .vscode/mcp.json. Merge into servers; preserve existing inputs.

2. Add Playwright MCP Server to VS Code

   Use the mcp-playwright entry below in servers. Keep Playwright MCP Server's documented stdio connection fields and your other VS Code entries.

3. Check Playwright MCP Server in VS Code

   Playwright MCP Server: Start in VS Code’s MCP controls; inspect output and trust prompts.

{
  "servers": {
    "mcp-playwright": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "@executeautomation/playwright-mcp-server"
      ],
      "env": {}
    }
  }
}

Playwright tools available to VS Code

Playwright's stored tool list documents 1 tool; compare it with VS Code's connected tool list, because the stored list is not a live check.

playwright_resize

Look for playwright_resize among VS Code's agent-mode tools after starting Playwright through the MCP controls.

Change browser dimensions or select a device preset and orientation.

Playwright: full stored tool descriptions

Troubleshooting Playwright in VS Code

• Make npx @executeautomation/playwright-mcp-server (Node.js/npm) available in the workspace, container, or remote environment hosting Playwright MCP Server. Start through VS Code's MCP controls; inspect output and trust prompts.
• Playwright MCP Server uses stdio here: VS Code must keep the configured process running; protocol output belongs on stdout and diagnostics on stderr.
• Known limitation: HTTP clients must explicitly set their transport type correctly.
• Known limitation: The HTTP service binds locally; remote access needs an additional approach such as SSH tunneling.
• General VS Code troubleshooting lives in the /clients/vscode guide.

Frequently asked questions