Playwright MCP Server

MCP Server Configuration

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

With Headed Browser (Visible)

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

With Specific Browser

Copy
{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": ["-y", "@playwright/mcp@latest", "--browser", "firefox"]
    }
  }
}

Available Tools

Navigation

Tool	Description
browser_navigate	Navigate to a URL
browser_go_back	Go back in history
browser_go_forward	Go forward in history
browser_wait	Wait for a specified time

Interaction

Tool	Description
browser_click	Click an element (by text, selector, or coordinates)
browser_type	Type text into an input field
browser_select_option	Select dropdown option
browser_hover	Hover over an element
browser_press_key	Press keyboard key
browser_drag	Drag element to target

Content

Tool	Description
browser_snapshot	Get page accessibility snapshot (structured)
browser_take_screenshot	Capture screenshot as image
browser_console_messages	Get browser console output
browser_get_text	Extract text content from page

Tabs

Tool	Description
browser_tab_list	List all open tabs
browser_tab_new	Open a new tab
browser_tab_select	Switch to a tab
browser_tab_close	Close a tab

Advanced

Tool	Description
browser_file_upload	Upload files to file input
browser_handle_dialog	Accept or dismiss browser dialogs
browser_install	Install browser binaries

Setup

1. Add the configuration to .claude/settings.json
2. Browser binaries install automatically on first use
3. Or pre-install: npx playwright install chromium
4. No API keys required

Common Workflows

# Test a login flow
1. browser_navigate: { url: "http://localhost:3000/login" }
2. browser_type: { selector: "#email", text: "[email protected]" }
3. browser_type: { selector: "#password", text: "password" }
4. browser_click: { selector: "button[type=submit]" }
5. browser_snapshot: {}  — Verify dashboard loaded
6. browser_take_screenshot: {}  — Visual verification

Security Notes

• Browser runs locally — no remote browser farms
• Headless by default — use --headed only for debugging
• Be cautious with auto-filled credentials in browser sessions
• Screenshots may capture sensitive data — handle with care
• Browser sessions are isolated per conversation
• No persistent cookies or cache between sessions