MCP-Server-Playwright
목차
Related MCP server: Playwright MCP Server for Security
특징
🌐 전체 브라우저 자동화 기능
📸 전체 페이지 또는 특정 요소의 스크린샷 캡처
🖱️ 포괄적인 웹 상호작용(탐색, 클릭, 양식 작성)
📊 콘솔 로그 모니터링
🔧 브라우저 컨텍스트에서의 JavaScript 실행
설치
Smithery를 통해 설치
Smithery를 통해 Claude Desktop용 MCP Server Playwright를 자동으로 설치하려면:
지엑스피1
npx 또는 mcp-get을 사용하여 패키지를 설치할 수 있습니다.
npx 사용:
npx @automatalabs/mcp-server-playwright install이 명령은 다음을 수행합니다.
운영 체제 호환성 확인(Windows/macOS)
Claude 구성 파일을 생성하거나 업데이트합니다.
Playwright 서버 통합 구성
구성 파일은 다음 위치에서 자동으로 생성/업데이트됩니다.
Windows:
%APPDATA%\Claude\claude_desktop_config.jsonmacOS:
~/Library/Application Support/Claude/claude_desktop_config.json
mcp-get을 사용합니다.
npx @michaellatman/mcp-get@latest install @automatalabs/mcp-server-playwright구성
설치 과정에서 다음 구성이 Claude 구성 파일에 자동으로 추가됩니다.
{
"mcpServers": {
"playwright": {
"command": "npx",
"args": ["-y", "@automatalabs/mcp-server-playwright"]
}
}
}구성 요소
도구
browser_navigate
브라우저에서 모든 URL로 이동합니다.
{
"url": "https://stealthbrowser.cloud"
}browser_screenshot
전체 페이지 또는 특정 요소의 스크린샷을 캡처합니다.
{
"name": "screenshot-name", // required
"selector": "#element-id", // optional
"fullPage": true // optional, default: false
}browser_click
CSS 선택기를 사용하여 페이지의 요소를 클릭합니다.
{
"selector": "#button-id"
}browser_click_text
페이지의 텍스트 콘텐츠를 클릭하여 요소를 클릭합니다.
{
"text": "Click me"
}browser_hover
CSS 선택기를 사용하여 페이지의 요소 위에 마우스를 올려놓으세요
{
"selector": "#menu-item"
}browser_hover_text
페이지의 텍스트 콘텐츠에 있는 요소 위에 마우스를 올려 놓으세요.
{
"text": "Hover me"
}browser_fill
입력 필드를 작성하세요
{
"selector": "#input-field",
"value": "Hello World"
}browser_select
CSS 선택기를 사용하여 SELECT 요소에서 옵션 선택
{
"selector": "#dropdown",
"value": "option-value"
}browser_select_text
SELECT 요소의 텍스트 내용을 통해 옵션을 선택합니다.
{
"text": "Choose me",
"value": "option-value"
}browser_evaluate
브라우저 콘솔에서 JavaScript 실행
{
"script": "document.title"
}자원
콘솔 로그 (
console://logs)텍스트 형식으로 브라우저 콘솔 출력에 액세스합니다.
브라우저의 모든 콘솔 메시지를 포함합니다.
스크린샷 (
screenshot://<n>)캡처된 스크린샷의 PNG 이미지에 액세스
캡처 중에 지정된 이름으로 참조됨
특허
이 프로젝트는 MIT 라이선스에 따라 라이선스가 부여되었습니다. 자세한 내용은 라이선스 파일을 참조하세요.
Available Tools
10 toolsbrowser_clickB
Click an element on the page using CSS selector
| Name | Required | Description | Default |
|---|---|---|---|
| selector | Yes | CSS selector for element to click |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations provided, so description must disclose behavior. It only states 'Click', omitting details like whether it scrolls to the element, waits for it to be clickable, or triggers navigation. This lack of behavioral context could lead to unexpected outcomes.
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, efficient sentence with no filler words. It could be slightly more informative without sacrificing brevity, but it is well-structured.
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 tool with one parameter, the description is minimally complete. However, it lacks context about expected behaviors (e.g., does it wait for the element to be clickable?), which is important for browser automation.
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% with a clear description of the selector parameter. The tool description adds no new meaning beyond the schema, meeting the baseline but not enhancing understanding.
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 ('Click'), the resource ('element on the page'), and the method ('using CSS selector'). It distinguishes from siblings like browser_click_text and browser_hover by specifying the selection mechanism.
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?
No guidance on when to use this tool versus alternatives like browser_click_text or browser_hover. Does not mention prerequisites or constraints (e.g., the element must be visible).
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
browser_click_textB
Click an element on the page by its text content
| Name | Required | Description | Default |
|---|---|---|---|
| text | Yes | Text content of the element to click |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations exist, so the description must disclose behavioral traits. It does not address what happens if multiple elements match the text, whether it scrolls, if match is exact, or that clicking may trigger navigation. This is insufficient for safe invocation.
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 concise sentence that conveys the core functionality without extraneous information. Every word earns its place.
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 tool with one parameter and no output schema, the description is minimal but adequate. However, it lacks details on return values, error cases, and behavior with ambiguous matches, leaving some gaps.
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 description adds no extra meaning beyond the parameter name and schema description. It does not clarify if matching is case-sensitive or partial, so it meets baseline but adds no value.
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 verb 'click' and the resource 'element on the page', and specifies the method 'by its text content', distinguishing it from siblings like browser_click or browser_hover_text.
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?
No guidance is provided on when to use this tool versus alternatives. There is no mention of when to prefer text-based clicking over coordinate-based clicking or when element uniqueness matters.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
browser_evaluateC
Execute JavaScript in the browser console
| Name | Required | Description | Default |
|---|---|---|---|
| script | Yes | JavaScript code to execute |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations provided. The description does not disclose side effects (e.g., DOM modification, network requests), return values, error handling, or security implications of executing arbitrary code.
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?
Single sentence that is concise and front-loaded with key action. However, it could provide slightly more context without losing conciseness.
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?
Despite simple schema, the tool executes arbitrary JavaScript which has high complexity. Missing details on return values, error handling, and potential side effects, making it incomplete for effective agent use.
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% (script described). Description adds no additional meaning beyond the schema. With full coverage, baseline is 3.
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?
Description clearly states the tool executes JavaScript in the browser console, distinguishing it from DOM interaction siblings like browser_click or browser_fill. The verb 'Execute' and resource 'JavaScript in the browser console' are specific.
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?
No guidance on when to use or avoid this tool. For instance, it doesn't mention that it can manipulate page state or that simpler tools like browser_click should be preferred for basic interactions.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
browser_fillB
Fill out an input field
| Name | Required | Description | Default |
|---|---|---|---|
| selector | Yes | CSS selector for input field | |
| value | Yes | Value to fill |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations, the description bears full responsibility for behavioral disclosure. It does not mention whether the action is destructive, if it clears existing values, triggers events, or requires certain input types.
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 concise sentence with no wasted words. However, it might be too brief, lacking nuance. Still efficient.
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 two parameters, no output schema, and no annotations, the description is too minimal. It does not explain return behavior or edge cases, leaving significant gaps.
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%, so the description adds no extra meaning beyond the parameter descriptions. Baseline of 3 is appropriate.
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 tool fills an input field, using a specific verb and resource. It distinguishes from sibling tools like browser_click and browser_select, which have different actions.
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?
No guidance on when to use this tool versus alternatives. The description is too brief to indicate appropriate contexts, exclusions, or prerequisites.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
browser_hoverA
Hover an element on the page using CSS selector
| Name | Required | Description | Default |
|---|---|---|---|
| selector | Yes | CSS selector for element to hover |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations provided, and the description lacks detail on behavioral traits such as event triggering, prerequisites (element must exist), or error handling. Insufficient for a tool with no annotations.
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?
Single, clear sentence with no unnecessary words. Efficient and front-loaded.
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?
Adequate for a simple tool, but lacks details on behavior (e.g., simulated vs real hover) and error cases. No output schema but context is somewhat complete.
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% (one parameter described). Description adds no extra meaning beyond the schema, so baseline of 3 is appropriate.
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 (hover), resource (element on the page), and method (CSS selector). It distinguishes from siblings like browser_click and browser_hover_text.
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?
Implies when to use (hover with CSS selector) but no explicit guidance on when not to use or alternatives like browser_hover_text.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
browser_hover_textB
Hover an element on the page by its text content
| Name | Required | Description | Default |
|---|---|---|---|
| text | Yes | Text content of the element to hover |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations exist, and the description fails to disclose behavioral traits such as visibility requirements, scrolling behavior, hover duration, or event simulation. The description carries minimal behavioral context.
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, front-loaded sentence efficiently conveys the tool's purpose without unnecessary words or repetition.
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 one-parameter tool, the description is adequate but lacks context on behavior (e.g., scrolling, visible requirement) and does not help differentiate from sibling tools, leaving gaps for complex usage.
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% with one parameter described as 'Text content of the element to hover'. The description adds no additional meaning beyond the schema, meeting baseline but not exceeding it.
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 'Hover an element on the page by its text content' clearly states the action (hover) and resource (element) and specifies the method (by text content), distinguishing it from sibling like 'browser_hover' which likely uses selectors.
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?
No guidance is provided on when to use this tool versus alternatives like 'browser_hover' (by selector) or 'browser_click_text'. No mention of prerequisites, limitations, or exclusions.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
browser_screenshotB
Take a screenshot of the current page or a specific element
| Name | Required | Description | Default |
|---|---|---|---|
| name | Yes | Name for the screenshot | |
| selector | No | CSS selector for element to screenshot | |
| fullPage | No | Take a full page screenshot (default: false) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations provided, so description must cover behavioral traits. It fails to mention how the screenshot is returned (file path, base64) or any side effects/limitations.
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?
Single sentence with no unnecessary words. Efficient and directly communicates the tool's function.
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?
With no output schema, description omits return format. Adequate for a simple screenshot but lacks completeness for agent to reliably use the result.
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 covers 100% of parameters, so baseline is 3. Description adds no extra meaning beyond the schema; just echoes 'page or element' which maps to fullPage/selector.
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?
Description clearly states the action (screenshot) and target (current page or specific element), distinguishing from sibling tools that perform clicks, fills, etc.
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?
No guidance on when to use this tool versus alternatives (e.g., browser_evaluate for custom screenshots). No mention of prerequisites or exclusions.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
browser_selectC
Select an element on the page with Select tag using CSS selector
| Name | Required | Description | Default |
|---|---|---|---|
| selector | Yes | CSS selector for element to select | |
| value | Yes | Value to select |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations provided. Description does not disclose behavioral traits like event triggering, visibility requirements, or side effects. Agent lacks critical context.
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?
Single sentence is concise but lacks structure. Could be improved with additional context without becoming verbose.
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?
No output schema or annotations. Description is too brief for a browser automation tool; missing details about element type, event handling, and constraints.
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% with clear parameter descriptions. Tool description adds 'with Select tag' hint but does not significantly enhance meaning beyond schema.
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?
Description 'Select an element on the page with Select tag using CSS selector' indicates it targets HTML <select> elements, but phrasing is slightly ambiguous. Clearly distinguishes from sibling tools like browser_click.
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?
No guidance on when to use this tool vs alternatives such as browser_select_text or browser_click. Missing context for dropdown-specific usage.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
browser_select_textC
Select an element on the page with Select tag by its text content
| Name | Required | Description | Default |
|---|---|---|---|
| text | Yes | Text content of the element to select | |
| value | Yes | Value to select |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
Annotations are absent, so the description must disclose behavior. It only states 'select an element... by its text content' without explaining if it waits for the element, handles errors, or updates the page state. Minimal behavioral insight.
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?
Single sentence, no redundancy. Could be more structured but adequate for the purpose.
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?
With no output schema and two required parameters, the description is too sparse. It does not explain what 'text' refers to (option content vs label) or what 'value' represents. Incomplete for a tool interacting with DOM elements.
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 descriptions cover both parameters with clear names ('text' and 'value') and descriptions. The description adds no extra meaning beyond the schema, so baseline 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?
Description clearly states verb 'Select' and resource 'element on the page with Select tag', indicating it targets <select> elements. However, phrasing 'Select tag' is ambiguous and could be misinterpreted. It distinguishes from siblings like browser_select but not explicitly.
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?
No guidance on when to use this tool versus siblings like browser_select or browser_click_text. The description does not mention appropriate contexts or exclusions.
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.
10 tool updates
v1.0.0- Added
browser_click - Added
browser_click_text - Added
browser_evaluate - Added
browser_fill - Added
browser_hover - Added
browser_hover_text - Added
browser_navigate - Added
browser_screenshot - Added
browser_select - Added
browser_select_text
TDQS
Scored across 10 tools
Each tool has a clearly distinct purpose. Pairwise similar tools like click and click_text are differentiated by CSS selector vs text content, making ambiguity minimal.
All tools follow a consistent 'browser_verb' pattern, with optional '_text' suffix for text-based selectors. Snake_case is used uniformly.
10 tools is an appropriate number for browser automation, covering essential actions without being overwhelming. The scope is well-defined.
The set covers core browser interactions (navigation, click, fill, select, hover, evaluate, screenshot). Missing operations like waiting, scrolling, or keyboard input are minor gaps.
Maintenance
Related MCP Connectors
Provides cloud browser automation capabilities using Stagehand and Browserbase, enabling LLMs to i…
Web search, browser automation, scraping, crawling and CAPTCHA solving for AI agents.
Web data for agents: YouTube transcripts, screenshots, Google News, WHOIS, jobs, tech stack, more.
Hosted browser for AI agents: screenshots, post-JS DOM, console, WCAG. No install, no API key.
Related MCP Servers
- AlicenseCqualityDmaintenanceEnables LLMs to perform web browsing tasks, take screenshots, and execute JavaScript using Puppeteer for browser automation.424,202 npm1MIT
- AlicenseNot gradedqualityDmaintenanceEnables LLMs to perform browser automation tasks including web scraping, taking screenshots, and executing JavaScript using Playwright. It facilitates real-time interaction with web pages and the generation of automated test code.15 npmMIT
- AlicenseNot gradedqualityDmaintenanceEnables browser automation using Playwright, allowing LLMs to interact with web pages, take screenshots, generate test code, scrape web pages, and execute JavaScript in a real browser environment.13,494 npmMIT
- AlicenseNot gradedqualityDmaintenanceEnables LLMs to drive a real browser for web scraping, page interaction, screenshots, JavaScript execution, automated test generation, and responsive device emulation through natural language tool calls.13,494 npmMIT