mcp-playwright-automation
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., "@mcp-playwright-automationOpen https://example.com and extract the main heading text"
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.
mcp-playwright-automation
An MCP server that gives an AI assistant (Claude Desktop, or any MCP client) control of a real Chromium browser through Playwright.
Once connected, the assistant can open pages, click elements, fill in forms, read text or HTML off the page, and capture screenshots — all inside a single persistent browser session.
How it works
The server speaks MCP over stdio: the client launches dist/index.js as a
subprocess and exchanges JSON-RPC messages over stdin/stdout. Because stdout is
the protocol channel, all logging goes to stderr.
A single Chromium instance and page are shared across calls, so state (cookies,
current URL, session) persists between tools. The browser is launched lazily
— on the first tool call, not at startup — so the MCP handshake stays fast. It
is closed on SIGINT, SIGTERM, or when the stdio channel closes.
src/
index.ts MCP server: tool registration, schemas, lifecycle
tools.ts Tool implementations (the Playwright calls)
browser.ts BrowserManager: lazy launch, shared page, cleanup
client.ts Test client that drives the server like Claude Desktop doesRelated MCP server: playwright-browser
Tools
Tool | Arguments | Description |
|
| Navigates to a URL |
|
| Clicks an element (CSS selector) |
|
| Fills a form field |
|
| Returns the text content of an element |
| — | Returns the full HTML of the page |
|
| Saves a PNG screenshot |
screenshot accepts either an absolute path or a name relative to the
screenshots directory. Since MCP clients start the server with an unpredictable
working directory, relative names are resolved against the screenshots/ folder at the project root — override it with the MCP_SCREENSHOT_DIR environment
variable.
Requirements
Node.js 18+ (developed on 22)
Chromium, installed via Playwright
Setup
npm install
npx playwright install chromium
npm run buildUsage
With Claude Desktop
Add the server to claude_desktop_config.json
(~/Library/Application Support/Claude/ on macOS,
%APPDATA%\Claude\ on Windows), using an absolute path:
{
"mcpServers": {
"playwright-automation": {
"command": "node",
"args": ["/absolute/path/to/mcp-playwright-automation/dist/index.js"]
}
}
}Restart Claude Desktop, and the six tools become available in conversation.
Verifying it works
The bundled test client performs the same handshake an MCP client does, lists
the tools, navigates to example.com, and extracts its heading:
npm run test:clientYou can also run the server directly — it will wait for JSON-RPC on stdin:
npm startScripts
Script | What it does |
| Compiles |
| Runs the MCP server over stdio |
| Runs the test client against the built server |
| Runs the Playwright suite in |
Tests
tests/ holds a standard Playwright suite, configured in
playwright.config.ts to run against Chromium, Firefox, and WebKit. A GitHub
Actions workflow (.github/workflows/playwright.yml) runs it on every push and
pull request to main, and uploads the HTML report as an artifact.
Note that these tests cover browser behaviour directly; they do not exercise
the MCP layer. Use npm run test:client for that.
Notes
dist/andscreenshots/are generated and therefore not tracked in git.The browser runs headless. To watch it work, pass
{ headless: false }tochromium.launch()insrc/browser.ts.
Available Tools
6 toolsclickClickB
Clicks an element on the page
| Name | Required | Description | Default |
|---|---|---|---|
| selector | Yes | CSS selector of the element |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description carries the full burden of behavioral disclosure. It reveals the action but not possible side effects like page navigation, waiting behavior, or error handling when the selector does not match an element.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, direct sentence with no filler. It front-loads the action and the object, making it appropriately concise for a simple one-parameter tool.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
For a basic one-parameter click tool, the description is minimally adequate. However, without annotations or an output schema, it does not explain return behavior, post-click effects, or failure conditions, leaving some important context to inference.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Schema description coverage is 100% and the single parameter is already documented as 'CSS selector of the element'. The tool description adds no extra meaning about how the selector should be crafted or used, so the baseline score of 3 applies.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states a specific action ('Clicks') and object ('an element on the page'), and it is readily distinguishable from sibling tools like navigate, fillForm, and extractData. It lacks additional scoping detail, but the core purpose is unambiguous.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
There is no guidance on when to use click versus alternatives such as fillForm or navigate. The description only states what the tool does, not when it should be selected or when it should be avoided.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
extractDataExtract dataB
Extracts the text of an element on the page
| Name | Required | Description | Default |
|---|---|---|---|
| selector | Yes | CSS selector of the element |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description carries the full burden of behavioral disclosure. It only states the basic action and does not mention whether the operation is read-only, what happens if the selector matches no element, or whether it returns the first match or an array. For a simple extraction tool, the lack of detail about return behavior and edge cases leaves the agent with uncertainty.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, front-loaded sentence with no filler. It states the core purpose immediately and omits any irrelevant details. This is appropriately sized for a tool with one parameter and no annotations.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the tool's simplicity (one parameter, no output schema, no annotations), the description is partially complete. It conveys the fundamental function but omits details about the exact return value (e.g., innerText vs textContent), behavior on missing elements, and confirms it is a read-only operation. These gaps are noticeable because there is no output schema to clarify the result shape.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Schema coverage is 100% and the only parameter (selector) already has a clear description in the schema ('CSS selector of the element'). The tool description adds no additional meaning or usage nuance beyond that, so the baseline of 3 applies. No extra examples, format constraints, or guidance are provided.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the action (extracts) and the target (text of an element on the page). It implies a focused, element-specific extraction that distinguishes it from getPageContent, though it doesn't explicitly name the sibling. The verb and resource are specific enough for basic selection.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description implicitly tells an agent to use this tool when they need the text of a specific page element, as opposed to the full page content. However, it provides no explicit when-to-use or when-not-to-use guidance, nor does it mention any alternatives or prerequisites. The usage context is inferred rather than stated.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
fillFormFill formC
Fills a form field
| Name | Required | Description | Default |
|---|---|---|---|
| text | Yes | Text to fill in | |
| selector | Yes | CSS selector of the field |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description carries the full burden of disclosing behavior. It only states 'Fills a form field' but does not explain whether existing text is replaced, whether events are triggered, or what side effects occur. This is a significant gap for a mutation tool.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single five-word sentence with zero filler and the core verb front-loaded. It is concise, though arguably too sparse for the overall completeness needed.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
For a simple mutation tool with no annotations, no output schema, and only two parameters, the description is minimally viable but incomplete. It omits behavioral context and usage selection guidance, which an agent would need to call it reliably.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The input schema covers 100% of parameters, each with a clear description ('CSS selector of the field', 'Text to fill in'). The tool description adds no additional meaning beyond the schema, so the baseline of 3 applies.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description says 'Fills a form field' — a specific verb and resource that clearly distinguishes it from siblings like 'navigate', 'click', and 'getPageContent'. It is not as rich as it could be, but the core purpose is immediately understandable.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
There is no guidance on when to use this tool versus alternatives. The description does not mention any context, prerequisites, or exclusions, leaving the agent to infer the appropriate use case from the tool name alone.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
getPageContentPage contentA
Gets the full HTML content of the page
| Name | Required | Description | Default |
|---|---|---|---|
No parameters | |||
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations, the description carries the full burden. 'Gets' conveys a read-only operation, but no further detail is given about side effects, whether it operates on the current page, or the exact response shape. It is minimally transparent but not detailed.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
A single sentence with no filler. The key scoping term 'full HTML content' is front-loaded, and every word adds meaning.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
For a simple parameterless getter with no output schema, the description adequately conveys what the agent will receive and how to call it. Nothing essential is missing for correct invocation.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The tool has zero parameters and 100% schema description coverage, so there is nothing for the description to add. The baseline of 4 for a parameterless tool applies here.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description uses a specific verb ('gets') and a specific resource ('full HTML content of the page'), so an agent can tell it is meant for raw page retrieval rather than structured extraction or screenshots. It does not explicitly name sibling alternatives, but the scope is still clear.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
There is no guidance about when to use this tool versus siblings such as extractData or screenshot. The description only states what it does; an agent must infer the appropriate use case with no exclusions or alternatives provided.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
screenshotScreenshotC
Takes a screenshot of the page
| Name | Required | Description | Default |
|---|---|---|---|
| filename | Yes | File name (relative to the screenshots/ folder) or absolute path |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description carries the full burden of behavioral disclosure. It only says 'takes a screenshot' without revealing whether it captures the full page, waits for resources, scrolls, or has any side effects. This is a significant gap for a tool that likely affects browser state.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single short sentence with no fluff, which is concise. However, it is under-specified rather than efficiently structured—it lacks any supporting context or organization that would help an agent use it correctly.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
For a browser automation tool, this description is incomplete. It does not specify the output format, whether the screenshot is saved automatically, or any prerequisites like waiting for the page to load. Given the sibling tools and the absence of an output schema, more detail is necessary for correct invocation.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Schema description coverage is 100% (only one parameter, filename, is fully described in the schema). The description adds no extra meaning beyond what the schema already provides, so the baseline of 3 applies.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description states a clear verb and resource: 'Takes a screenshot of the page'. This distinguishes it from sibling tools like navigate or click, which have different purposes. However, it lacks specificity about scope (e.g., viewport vs. full-page) or any caveats, so it is clear but minimal.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
There is no guidance on when to use this tool versus alternatives. It does not mention prerequisites like a loaded page, nor does it suggest any exclusions. The description simply states what it does without context.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
Tool Schema Changelog
Recent tool additions, removals, and schema changes observed during successful MCP inspections. Dates show when Glama detected each change.
6 tool updates
v1.0.0- First observed
click - First observed
extractData - First observed
fillForm - First observed
getPageContent - First observed
navigate - First observed
screenshot
TDQS
Each tool targets a distinct browser action: navigation, clicking, form filling, data extraction, content retrieval, and screenshots. No overlap in purpose, so agents can clearly differentiate.
Naming mixes conventions: snake_case verbs (navigate, click, screenshot) and camelCase verb_noun (fillForm, extractData, getPageContent). The pattern is inconsistent, with some tools using single verbs and others using verb_noun, and differing case styles.
Six tools form a tight, well-scoped set for basic browser automation, each earning its place. This is within the ideal 3-15 range.
The surface covers core browsing workflows (navigate, interact, extract, screenshot) but lacks common operations like waiting for elements, hovering, selecting options, or scrolling. Basic tasks are possible, but advanced automation scenarios would require workarounds.
Maintenance
Resources
Unclaimed servers have limited discoverability.
Looking for Admin?
If you are the server author, to access and configure the admin panel.
Related MCP Connectors
Stealth web automation for AI agents. Login, signup, navigate, screenshot.
Stealth web automation for AI agents. Login, signup, navigate, screenshot.
Provides cloud browser automation capabilities using Stagehand and Browserbase, enabling LLMs to i…
AI-powered browser automation — navigate, click, fill forms, and extract data from any website.
Related MCP Servers
- FlicenseNot gradedqualityDmaintenanceEnables AI assistants to automate web browsers through Playwright, providing capabilities for navigation, content extraction, form filling, screenshot capture, and JavaScript execution. Supports multiple browser engines with comprehensive error handling and security features.1-
- AlicenseNot gradedqualityDmaintenanceEnables AI agents to control a web browser using Playwright, supporting navigation, interaction, and data extraction through natural language.MIT
- AlicenseNot gradedqualityDmaintenanceEnables browser automation for AI assistants via Playwright, supporting multiple browsers, sessions, and tools for web interaction and testing.1,353MIT
- AlicenseAqualityDmaintenanceEnables AI assistants to perform browser automation using Playwright, including navigation, content extraction, screenshot analysis, and custom script execution.517MIT
Latest Blog Posts
- Who's Calling? MCP Hosts Are an Identity Blind Spot (And the Spec Knows It)By Om-Shree-0709 on .mcpAgent IdentityOAuth 2.1
- Your AI Chatbot Just Exposed Your CEO's Salary to an InternBy Om-Shree-0709 on .Agent IdentityMCP SecurityOAuth Delegation
- Why MCP Servers Need Execution Sandboxing (And Why Your Current Stack Isn't Enough)By Om-Shree-0709 on .Agentic AiPrompt InjectionWebAssembly
MCP directory API
We provide all the information about MCP servers via our MCP API.
curl -X GET 'https://glama.ai/api/mcp/v1/servers/pedro95nunes/mcp-playwright-automation'
If you have feedback or need assistance with the MCP directory API, please join our Discord server