Playwright MCP

other MCP Server

Playwright MCP server

Install Ready
otherother
22 views33,512 stars2,760 forksv0.0.56Apache-2.0

Why This Matters

Discovered via unknown and last synced 4mo ago.

Install Ready
Source
unknown
Stars
33,512
Last synced
4mo ago
Install
Instructions detected

Install

1. Install the package

npx @playwright/mcp

2. Add to claude_desktop_config.json

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

Config file location: ~/Library/Application Support/Claude/claude_desktop_config.json (macOS) / %APPDATA%\Claude\claude_desktop_config.json (Windows)

33
Tools
0
Resources
0
Prompts
Standard I/O
Transport

Who Is This For?

QA engineers and test automation developers who need to interact with web applications programmatically through Claude. Frontend developers building browser automation workflows benefit from natural language control over Playwright actions. DevOps and integration engineers can leverage Claude's reasoning to create complex multi-step browser automation scripts.

Use Cases

Automated web application testing workflows

Generate and execute end-to-end test scripts for web apps by describing test scenarios in natural language. Claude handles element selection, interaction sequencing, and assertion logic automatically.

Browser-based RPA and data extraction

Automate repetitive web tasks like form filling, data scraping, and navigation through conversational instructions. Works across multiple pages and handles dynamic content through the page snapshot context.

Interactive debugging and exploration

Take screenshots and interact with live web pages to debug issues or validate UI behavior. Use Claude to interpret page state and suggest next actions based on visual feedback.

Cross-browser compatibility verification

Execute the same automation sequences across different browser contexts to verify consistent behavior. Leverage Playwright's multi-browser support while Claude handles the orchestration logic.

Frequently Asked Questions

How does Claude interact with elements on the page?

Claude receives page snapshots containing element references and uses tools like click, type, and selectOption with those references. You provide startRef and endRef parameters that map directly to elements Claude can see in the snapshot.

Can this handle dynamic or JavaScript-rendered content?

Yes, Playwright waits for content to load and Claude receives updated snapshots of the current page state. You can use waitFor options like textGone and textAppears to handle dynamic updates.

What are the limitations when working through Claude?

Claude works with snapshots of the page state, so very rapid interactions may require explicit waits. Complex multi-step sequences work best when broken into smaller, discrete operations that Claude can reason about.

Do I need to write Playwright code directly?

No, you describe what you want to accomplish in natural language, and Claude translates that into Playwright tool calls. However, understanding Playwright concepts like selectors and navigation helps you communicate more effectively.

Available Tools (33)

endRef

(string): Exact target element reference from the page snapshot

button

(string, optional): Button to click, defaults to left

Tools

generated by update-readme.js -->

doubleClick

(boolean, optional): Whether to perform a double click instead of a single click

startRef

(string): Exact source element reference from the page snapshot

fullPage

(boolean, optional): When true, takes a screenshot of the full scrollable page, instead of the currently visible viewport. Cannot be used with element screenshots.

values

(array): Array of values to select in the dropdown. This can be a single value or multiple values.

submit

(boolean, optional): Whether to submit entered text (press Enter after)

textGone

(string, optional): The text to wait for to disappear

Title

Stop tracing

filename

(string, optional): File name to save the screenshot to. Defaults to `page-{timestamp}.{png|jpeg}` if not specified. Prefer relative file names to stay within the output directory.

height

(number): Height of the browser window

element

(string): Human-readable element description

NOTE

This has been generated via update-readme.js -->

modifiers

(array, optional): Modifier keys to press

text

(string, optional): The text to wait for

promptText

(string, optional): The text of the prompt in case of a prompt dialog.

slowly

(boolean, optional): Whether to type one character at a time. Useful for triggering key handlers in the page. By default entire text is filled in at once.

endElement

(string): Human-readable target element description used to obtain the permission to interact with the element

index

(number, optional): Tab index, used for close/select. If omitted for close, current tab is closed.

endX

(number): End X coordinate

endY

(number): End Y coordinate

x

(number): X coordinate

y

(number): Y coordinate

accessibleName

(string): ACCESSIBLE_NAME of the element. Can be found in the snapshot like this: `- role "{ACCESSIBLE_NAME}"`

ref

(string): Exact target element reference that points to the element

Description

Stop trace recording

End

of tools generated section -->

startX

(number): Start X coordinate

startY

(number): Start Y coordinate

items

(array): Items to verify

value

(string): Value to verify. For checkbox, use "true" or "false".

Parameters

None

Related Combinations

See how Playwright MCP fits into curated workflow stacks, not just adjacent tools.

1 stack