The Playwright MCP server enables LLMs to automate browser interactions through structured accessibility snapshots rather than vision models, providing comprehensive capabilities for web scraping, testing, and automated workflows.
Browser Management: Open, close, resize, and install browsers; manage multiple tabs (list, create, close, select); connect to existing browser sessions via extension mode
Navigation: Navigate to URLs, go back to previous pages, and wait for conditions (text appearance/disappearance or time periods)
Page Interaction: Click elements (with modifier keys, double-clicks, multi-button support), type text (with slow typing and auto-submit options), fill multi-field forms (textboxes, checkboxes, radio buttons, comboboxes, sliders), select dropdown options, hover, drag and drop, press keyboard keys, upload files, and handle browser dialogs (alerts, prompts, confirms)
Page Inspection: Capture accessibility snapshots in LLM-friendly format, take screenshots (full page or specific elements, PNG/JPEG), retrieve console messages (filtered by log level), monitor network requests (with static resource filtering), evaluate JavaScript on pages or elements, and execute custom Playwright code snippets
System Health: Perform health checks to verify server configuration and connectivity
Key Features: Uses accessibility tree references (not pixel coordinates) for deterministic automation, supports human-readable element descriptions, works with Chromium/Firefox/WebKit browsers, and offers headless mode, viewport sizing, and isolated sessions
Enables browser automation and web interaction capabilities, allowing navigation, form filling, clicking, data extraction, and testing workflows through Playwright's accessibility tree in Firefox browser.
Click on "Install Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@Playwright MCPgo to github.com and get the latest trending repositories"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
Playwright MCP
A Model Context Protocol (MCP) server that provides browser automation capabilities using Playwright. Enables LLMs to interact with web pages through structured accessibility snapshots, bypassing the need for screenshots or visually-tuned models.
Features
Fast and lightweight - Uses Playwright's accessibility tree, not pixel-based input
LLM-friendly - No vision models needed, operates purely on structured data
Deterministic - Avoids ambiguity common with screenshot-based approaches
Requirements
Node.js 18 or newer
Any MCP client (VS Code, Cursor, Claude Desktop, Windsurf, etc.)
Quick Start
Add to your MCP client configuration:
VS Code / Cursor
Go to Settings → MCP → Add Server and configure manually using the standard config above.
Configuration
Basic Options
Browser Extension (Connect to Existing Browser)
Connect to your existing Chrome/Edge browser with logged-in sessions:
See extension/README.md for extension installation.
Isolated Sessions
Run each session in an isolated browser context:
Common Use Cases
Web Scraping
Navigate to pages, extract data, take screenshots, and interact with forms.
Testing & Automation
Verify elements, fill forms, click buttons, and run automated workflows.
Browser Extension Integration
Connect to your existing browser to interact with pages where you're already logged in.
Available Tools
Navigation:
browser_navigate,browser_navigate_backInteraction:
browser_click,browser_type,browser_fill_form,browser_select_optionInspection:
browser_snapshot,browser_take_screenshot,browser_evaluateTab Management:
browser_tabs(list, create, close, select)Network:
browser_network_requests,browser_console_messagesAdvanced: PDF generation, coordinate-based interactions, test assertions
Run npx playwright-mcp@latest --help for full list of options.
Documentation
License
MIT