Skip to main content
Glama
epi-builder
by epi-builder

Playwright MCP Server

Microsoft의 Playwright MCP를 참고하여 구현한 Model Context Protocol (MCP) 서버입니다. streamableHttp transport를 사용하여 웹 브라우저 자동화 기능을 제공합니다.

기능

이 서버는 다음과 같은 브라우저 자동화 도구들을 제공합니다:

  • browser_navigate: URL로 이동

  • browser_snapshot: 현재 페이지의 접근성 스냅샷 캡처

  • browser_click: 요소 클릭

  • browser_type: 텍스트 입력

  • browser_take_screenshot: 스크린샷 촬영

  • browser_close: 브라우저 종료

Related MCP server: mcp-browser-automation

설치

npm install

사용법

StreamableHttp Transport (권장)

# 기본 포트 3000으로 실행
npm run dev -- --streamable-http

# 특정 포트로 실행
npm run dev -- --streamable-http --port=8080

서버가 시작되면 http://localhost:3000/mcp (또는 지정한 포트)에서 MCP 서버에 접근할 수 있습니다.

Stdio Transport

npm run dev

프로그래밍 방식 사용법

import { PlaywrightMCPServer } from './src/server.js';

const server = new PlaywrightMCPServer();

// StreamableHttp transport로 시작
await server.start('streamableHttp', 3000);

// 또는 stdio transport로 시작
await server.start('stdio');

MCP 클라이언트 연결

MCP 클라이언트에서 이 서버에 연결하려면:

{
  "mcpServers": {
    "playwright": {
      "command": "node",
      "args": ["dist/index.js", "--streamable-http", "--port=3000"],
      "env": {}
    }
  }
}

개발

# TypeScript 컴파일
npm run build

# 개발 모드 실행
npm run dev

# 프로덕션 빌드 후 실행
npm run build
npm start

라이선스

MIT

Available Tools

6 tools
browser_clickC

Click on an element

ParametersJSON Schema
NameRequiredDescriptionDefault
elementYesHuman-readable element description
refYesExact target element reference from page snapshot

TDQS

C2.9/5.0
Behavior2/5

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. 'Click on an element' implies a mutation action (interacting with the browser), but it doesn't disclose critical traits such as what happens on failure (e.g., if element not found), whether it waits for page loads, if it requires specific permissions, or any side effects. This leaves significant gaps for a tool that performs browser interactions.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description 'Click on an element' is a single, efficient sentence that front-loads the core action without unnecessary words. It earns its place by directly stating the tool's function, making it highly concise and well-structured for quick understanding.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness2/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

Given the complexity of browser interaction tools, the description is incomplete. No annotations exist to cover behavioral aspects, and there's no output schema to explain return values. The description alone fails to address key context like error handling, dependencies on other tools (e.g., 'browser_snapshot'), or what constitutes a successful click, making it inadequate for safe and effective use.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

The input schema has 100% description coverage, with clear documentation for both parameters ('element' as human-readable description and 'ref' as exact target reference). The description adds no additional meaning beyond what the schema provides, such as explaining how these parameters interact or usage examples. With high schema coverage, the baseline score of 3 is appropriate.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose4/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description 'Click on an element' clearly states the action (click) and target (an element), providing a specific verb+resource combination. However, it doesn't differentiate this tool from potential sibling interactions like 'browser_type' or 'browser_navigate' in terms of when clicking is the appropriate interaction versus typing or navigation.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines2/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description provides no guidance on when to use this tool versus alternatives. It doesn't mention prerequisites (e.g., requiring a page snapshot first), exclusions (e.g., not for non-clickable elements), or comparisons to sibling tools like 'browser_type' for text input. Usage is implied but not explicitly stated.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

browser_closeC

Close the browser

ParametersJSON Schema
NameRequiredDescriptionDefault

No parameters

TDQS

C2.8/5.0
Behavior2/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

No annotations are provided, so the description carries full burden. 'Close the browser' is vague about side effects: does it terminate the entire session, close the current tab, or prompt for unsaved data? No disclosure of destructive behavior or irreversible state changes.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness4/5

Is the description appropriately sized, front-loaded, and free of redundancy?

Extremely concise at three words, with no wasted text. However, it may be too brief for an agent to fully understand the tool's scope. Still, it is well-structured and front-loaded.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness2/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

Given the tool is a destructive action with no annotations or output schema, the description is inadequate. It does not explain what happens after closing, how to reopen, or what the agent should do beforehand. Lacks completeness for safe usage.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters4/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Tool has zero parameters, so baseline is 4. The description adds no parameter information, but the input schema already shows no properties. No additional semantic value needed beyond the schema.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose3/5

Does the description clearly state what the tool does and how it differs from similar tools?

Description states 'Close the browser', which is a clear verb+resource action. However, it is minimal and essentially a tautology of the tool name 'browser_close', and does not differentiate from siblings like 'browser_navigate_back' or 'browser_tabs' which also affect browser state.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines2/5

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 such as 'browser_navigate_back' or 'browser_snapshot' before closing. The description offers no context about prerequisites or typical workflows.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

browser_navigateC

Navigate to a URL

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesThe URL to navigate to

TDQS

C2.9/5.0
Behavior2/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

With no annotations provided, the description carries the full burden of behavioral disclosure. It states the action but omits critical details such as whether navigation is synchronous or asynchronous, error handling (e.g., invalid URLs), side effects (e.g., page reload), or performance implications. This leaves significant gaps in understanding how the tool behaves beyond the basic action.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is extremely concise at three words, front-loading the core action without any wasted text. Every word ('Navigate to a URL') directly contributes to understanding the tool's purpose, making it efficient and easy to parse.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness2/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

Given the complexity of browser navigation (which can involve errors, delays, or state changes) and the lack of annotations and output schema, the description is insufficiently complete. It does not address what happens after navigation (e.g., success/failure indicators, page load events), leaving the agent without necessary context for effective use in a workflow.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

The input schema has 100% description coverage, with the 'url' parameter clearly documented as 'The URL to navigate to'. The description adds no additional meaning beyond what the schema provides, such as URL format requirements or examples. Since schema coverage is high, the baseline score of 3 is appropriate, as the schema adequately handles parameter semantics.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose4/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description 'Navigate to a URL' clearly states the action (navigate) and target resource (URL), making the purpose immediately understandable. However, it does not differentiate this tool from potential siblings like browser_click or browser_type, which also involve browser interactions but perform different actions.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines2/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description provides no guidance on when to use this tool versus alternatives. It lacks context such as prerequisites (e.g., browser must be open), exclusions (e.g., not for clicking or typing), or comparisons to sibling tools like browser_wait_for, leaving the agent to infer usage 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.

browser_snapshotB

Capture accessibility snapshot of the current page

ParametersJSON Schema
NameRequiredDescriptionDefault

No parameters

TDQS

B3.1/5.0
Behavior2/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

With no annotations provided, the description carries full burden but only states what the tool does without behavioral details. It doesn't disclose whether this is a read-only operation, what permissions are needed, how it handles errors, or the format of the snapshot output, which are critical for a tool interacting with a browser.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is a single, clear sentence with no wasted words, front-loading the key action and target. It's appropriately sized for a simple tool with no parameters.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness2/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

Given the complexity of browser interactions and lack of annotations or output schema, the description is incomplete. It doesn't explain what an 'accessibility snapshot' entails, how it's returned, or any behavioral constraints, leaving significant gaps for an AI agent to understand tool usage.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters4/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

The tool has 0 parameters with 100% schema description coverage, so no parameter information is needed. The description appropriately doesn't mention parameters, earning a baseline score of 4 for not introducing unnecessary details.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose4/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description clearly states the action ('capture') and target ('accessibility snapshot of the current page'), making the purpose immediately understandable. However, it doesn't explicitly differentiate from sibling tools like 'browser_take_screenshot', which might capture visual content rather than accessibility data.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines2/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description provides no guidance on when to use this tool versus alternatives like 'browser_take_screenshot' or other browser tools. It lacks context about prerequisites (e.g., needing a page loaded) or exclusions, leaving usage unclear.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

browser_take_screenshotC

Take a screenshot of the current page

ParametersJSON Schema
NameRequiredDescriptionDefault
filenameNoFile name to save the screenshot to
fullPageNoTake screenshot of full page

TDQS

C2.9/5.0
Behavior2/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

With no annotations provided, the description carries the full burden of behavioral disclosure. It states the action but doesn't mention critical details like whether this requires specific permissions, how it handles errors, what format the screenshot is saved in, or where it's stored. For a tool with potential side effects, this is inadequate.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is a single, clear sentence with zero waste. It's appropriately sized for a simple tool and front-loaded with the core action, making it easy to parse quickly.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness2/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

Given the tool's complexity (a screenshot operation with potential side effects), no annotations, and no output schema, the description is insufficient. It doesn't explain what happens after the screenshot is taken (e.g., file saved location, return value), leaving critical gaps for an agent to use it correctly.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema description coverage is 100%, so the schema already documents both parameters ('filename' and 'fullPage'). The description adds no additional meaning beyond what the schema provides, such as explaining default behaviors or usage examples. Baseline 3 is appropriate when the schema does the heavy lifting.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose4/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description clearly states the action ('take a screenshot') and target ('current page'), providing a specific verb+resource combination. However, it doesn't distinguish this tool from the sibling 'browser_snapshot', which might have overlapping functionality, preventing a perfect score.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines2/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description provides no guidance on when to use this tool versus alternatives like 'browser_snapshot' or other browser tools. It lacks context about prerequisites (e.g., requiring an open browser page) or exclusions, offering only a basic statement of functionality.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

browser_typeC

Type text into an element

ParametersJSON Schema
NameRequiredDescriptionDefault
elementYesHuman-readable element description
refYesExact target element reference from page snapshot
textYesText to type into the element

TDQS

C2.9/5.0
Behavior2/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

With no annotations provided, the description carries full burden but offers minimal behavioral context. It states what the tool does but doesn't disclose important traits like whether it simulates human typing speed, handles special keys, validates element existence, or what happens on failure. 'Type text into an element' implies a write operation but lacks details about side effects or error conditions.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is extremely concise with a single, direct sentence that states the core functionality without any wasted words. It's front-loaded and efficiently communicates the essential action.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness2/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

For a browser automation tool with 3 required parameters, no annotations, and no output schema, the description is insufficient. It doesn't explain the relationship between 'element' and 'ref' parameters, what happens after typing, error handling, or how it integrates with other browser tools. The context signals indicate this is part of a browser automation suite, but the description doesn't leverage that context.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema description coverage is 100%, so the schema already documents all three parameters (element, ref, text) with clear descriptions. The description adds no additional meaning about parameters beyond what's in the schema, maintaining the baseline score for high schema coverage.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose4/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description clearly states the action ('type text') and target ('into an element'), providing a specific verb+resource combination. However, it doesn't differentiate from sibling tools like browser_click (which interacts with elements differently) or explain its unique role in the browser automation suite.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines2/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

No guidance is provided about when to use this tool versus alternatives. The description doesn't mention prerequisites (like needing a page snapshot from browser_snapshot), when typing is appropriate versus clicking, or how it relates to other browser tools in the workflow.

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.

  1. 6 tool updates
    • First observedbrowser_click
    • First observedbrowser_close
    • First observedbrowser_navigate
    • First observedbrowser_snapshot
    • First observedbrowser_take_screenshot
    • First observedbrowser_type

TDQS

B3.4/5.0

Scored across 6 tools

Disambiguation5/5

Each tool has a clearly distinct purpose targeting specific browser automation actions: clicking, closing, navigating, capturing accessibility snapshots, taking screenshots, and typing text. There is no overlap or ambiguity between these functions.

Naming Consistency5/5

All tools follow a consistent 'browser_' prefix with descriptive action suffixes (click, close, navigate, snapshot, take_screenshot, type). This uniform snake_case pattern makes the tool set predictable and easy to understand.

Tool Count4/5

Six tools is reasonable for a browser automation server, covering core interactions like navigation, input, and capture. It could be slightly expanded with tools for element selection or waiting, but the current count is well-scoped and manageable.

Completeness3/5

The tools cover basic navigation, interaction, and capture functions, but there are notable gaps for common automation tasks: no tools for selecting elements (e.g., by CSS/XPath), waiting for conditions, handling alerts/dialogs, or executing JavaScript. This may limit agent effectiveness in complex scenarios.

Maintenance

ActivityInactive
ResponsivenessNo issues

Related MCP Connectors

Related MCP Servers

  • A
    license
    Not graded
    quality
    D
    maintenance
    Enables browser automation and web scraping by exposing Playwright tools through an HTTP-based MCP server. Users can navigate pages, interact with web elements, capture screenshots, and extract structured content using a persistent Chromium instance.
    MIT
  • F
    license
    B
    quality
    D
    maintenance
    An MCP server for generic browser automation using Playwright. Enables MCP clients to navigate pages, inspect elements, execute JavaScript, capture screenshots, and monitor console logs and network traffic via a headless Chromium instance.
    7
    -
  • A
    license
    A
    quality
    B
    maintenance
    Enables MCP clients to automate a real Chrome browser via Playwright, supporting session sharing and tools for navigation, clicking, typing, and more.
    11
    2
    MIT
  • F
    license
    Not graded
    quality
    B
    maintenance
    Enables MCP clients to remotely control a headless Chromium browser via Playwright, including navigation, clicking, typing, form filling, screenshots, and network request monitoring, over Streamable HTTP and deployable to Azure Container Apps.
    -