MCP HubMCP Hub
executeautomation

mcp-playwright

by: executeautomation

Playwright Model Context Protocol Server - Tool to automate Browsers and APIs in Claude Desktop, Cline, Cursor IDE and More πŸ”Œ

2953created 03/12/2024
Visit
Playwright
Automation

πŸ“ŒOverview

Purpose: To provide a Model Context Protocol server that facilitates browser automation using Playwright, allowing LLMs to interact with web content effectively.

Overview: The Playwright MCP Server delivers robust browser automation capabilities, enabling the execution of JavaScript, web scraping, taking screenshots, and generating test code within a real browser environment. This server is designed to enhance the functionality of large language models (LLMs) when interacting with web pages.

Key Features:

  • Browser Automation: Enables LLMs to control and automate web browser tasks, enhancing interactivity with web pages.

  • JavaScript Execution: Allows for direct execution of JavaScript in the browser context, facilitating dynamic web interactions and testing.

  • Page Screenshot Capabilities: Provides the ability to capture screenshots of web pages, aiding in visual testing and documentation.

  • Test Code Generation: Automatically generates test scripts to streamline the testing process for web applications.

  • Web Scraping: Supports extracting information from web pages, making it easier to gather data for analysis or further processing.


Playwright MCP Server 🎭

A Model Context Protocol server providing browser automation using Playwright. This server enables LLMs to interact with web pages, take screenshots, generate test code, web scrape pages, and execute JavaScript in a real browser environment.

Documentation

Installation

You can install the package using npm, mcp-get, or Smithery.

Using npm:

npm install -g @executeautomation/playwright-mcp-server

Using mcp-get:

npx @michaellatman/mcp-get@latest install @executeautomation/playwright-mcp-server

Using Smithery:

npx -y @smithery/cli install @executeautomation/playwright-mcp-server --client claude

Installation in VS Code

Install the Playwright MCP server in VS Code using the VS Code Insiders button or the CLI commands below.

Using VS Code CLI for stable:

code --add-mcp '{"name":"playwright","command":"npx","args":["@executeautomation/playwright-mcp-server"]}'

Using VS Code CLI for Insiders:

code-insiders --add-mcp '{"name":"playwright","command":"npx","args":["@executeautomation/playwright-mcp-server"]}'

After installation, the Playwright MCP server will be available to use with your GitHub Copilot agent in VS Code.

Configuration to use Playwright Server

Claude Desktop configuration example to use the Playwright server:

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": ["-y", "@executeautomation/playwright-mcp-server"]
    }
  }
}

Testing

This project uses Jest for testing. Tests are located in the src/__tests__ directory.

Running Tests

Run tests using one of the following commands:

# Run tests using the custom script (with coverage)
node run-tests.cjs

# Run tests using npm scripts
npm test                  # Run tests without coverage
npm run test:coverage     # Run tests with coverage
npm run test:custom       # Run tests with custom script (same as node run-tests.cjs)

Test coverage reports will be generated in the coverage directory.