Playwright MCP is Microsoft's open-source MCP server that gives an AI assistant a real browser to click, type, fill forms and read pages. Instead of looking at screenshots, it reads the page's accessibility tree, a structured list of buttons, links and text. It needs Node.js 18 or newer and installs with one npx line.
| Item | Value |
|---|---|
| npm package | @playwright/mcp |
| Requirement | Node.js 18 or newer |
| How it sees pages | Accessibility snapshots, not pixels |
| Browsers | chrome, firefox, webkit, msedge |
| Default window | Headed (visible); add --headless to hide it |
Updated
If you run a website or store, Playwright MCP is a practical way to have an assistant walk through your own pages like a customer would: open the menu, add something to the cart, submit the contact form, and report what broke. It is built on Playwright, a widely used browser testing library. Pick your options below and copy a config, then read the safety notes before pointing it at anything logged in.
Choose options and copy the JSON. This page only writes text; it does not start a browser.
Config JSON
{
"mcpServers": {
"playwright": {
"command": "npx",
"args": [
"@playwright/mcp@latest",
"--browser",
"chrome",
"--isolated"
]
}
}
}Each option also has an environment variable form, listed in the README.
| Option | What it does |
|---|---|
| --browser <browser> | chrome, firefox, webkit or msedge |
| --headless | Runs without a visible window; headed is the default |
| --isolated | Keeps the browser profile in memory, not on disk |
| --storage-state <path> | Loads cookies and local storage into an isolated session |
| --device <device> | Emulates a device, for example "iPhone 15" |
| --viewport-size <size> | Sets the viewport in pixels, for example "1280x720" |
| --caps <caps> | Turns on extra tool groups, such as pdf or vision |
| --allowed-origins / --blocked-origins | Allow or block request origins; not a security boundary |
| --timeout-action / --timeout-navigation | Defaults 5000 ms and 60000 ms |
| --port <port> | Serves over HTTP so a client can connect by URL |
| Tool | Purpose | Read-only |
|---|---|---|
| browser_navigate | Open a URL | No |
| browser_snapshot | Capture the accessibility snapshot of the page | Yes |
| browser_click | Click an element | No |
| browser_type | Type into a field | No |
| browser_fill_form | Fill several fields at once | No |
| browser_take_screenshot | Save a screenshot | Yes |
| browser_console_messages | Read console messages | Yes |
| browser_network_requests | List network requests | Yes |
| browser_resize | Resize the window | No |
| browser_run_code_unsafe | Run Playwright code | No |
The minimal setup the README gives for most MCP apps.
{
"mcpServers": {
"playwright": {
"command": "npx",
"args": ["@playwright/mcp@latest"]
}
}
}Useful when the app cannot open a window itself. The client then points at http://localhost:8931/mcp.
npx @playwright/mcp@latest --port 8931Playwright MCP can run in three ways. The default persistent profile keeps cookies and logins in a folder per project. Isolated mode keeps everything in memory, which suits repeatable tests. The browser extension mode connects to a Chrome or Edge window you already have open, which is convenient but means the assistant acts with your real logins.
Only one browser can use a persistent profile at a time. If you run two assistant sessions on the same project, start the second with --isolated or a different --user-data-dir.
Checking that every link in the main menu opens a page that loads. Filling the contact form with test details and confirming the thank-you message appears. Reading the console messages on a page that seems slow. Resizing to a phone width and listing anything that overflows.
Write the results down as a checklist you can repeat after each change, so the assistant's run becomes your regression test.
Browsers keep an accessibility tree, the same structured view screen readers use: each button, link, heading and field with its name and role. Playwright MCP hands the assistant that tree, so it can say "click the Add to cart button" without guessing from an image.
No, and its README says so in bold. Options like --allowed-origins and --blocked-origins are described as not a security boundary either. Treat it as a tool you supervise, and run it where a mistake cannot reach real customer data.
By default it uses a persistent profile, so logins are stored on disk like a normal browser. With --isolated the profile lives in memory and is lost when the browser closes. You can preload cookies into an isolated session with --storage-state.
browser_take_screenshot is a core tool. PDF saving (browser_pdf_save) is opt-in with --caps=pdf, and click-by-coordinates tools need --caps=vision.
The README suggests coding agents may do better with the separate Playwright CLI, which uses fewer tokens. It keeps MCP for longer exploratory sessions where holding the browser state open is worth that cost.
Related: What is an MCP server?, Filesystem MCP server, How to build an MCP server, AI agent test checklist, Connect MCP in We.Inc.
Start for free or see all free tools. We.Inc is free to start, with no card needed. AI building is on paid plans from $20 a month.
We.Inc is an AI-powered website builder you can resell under your own brand. Launch a branded client dashboard, bill on Stripe Connect, and deliver AI-generated websites in minutes. White-label plans start at $99 a month for 25 client sites, with a 7-day free trial and no per-site fees.