MCP Server Playwright

MCP Server Playwright

By Automata-Labs-team GitHub

MCP server for browser automation using Playwright

Overview

What is MCP Server Playwright?

MCP Server Playwright is a browser automation server that utilizes Playwright to enable interaction with web pages, allowing for functionalities such as taking screenshots and executing JavaScript within a real browser context.

How to use MCP Server Playwright?

To use the MCP Server Playwright, you can install it using either npx or mcp-get. After installation, follow the provided configuration setup to start automating browser tasks.

Key features of MCP Server Playwright?

  • 🌐 Full browser automation capabilities
  • 📸 Screenshot capture of whole pages or specific elements
  • 🖱️ Comprehensive interaction with web pages including navigation and form filling
  • 📊 Monitoring browser console logs
  • 🔧 Execute JavaScript in the browser context

Use cases of MCP Server Playwright?

  1. Automating routine web interactions and testing
  2. Taking automated screenshots for monitoring and reporting
  3. Performing complex web-based workflows seamlessly

FAQ from MCP Server Playwright?

  • What platforms does MCP Server Playwright support?

It is compatible with both Windows and macOS environments.

  • How can I customize the browser behavior?

You can configure the Playwright server integration settings in the generated Claude configuration file during installation.

  • Is there documentation available?

Yes, comprehensive documentation is provided in the project's GitHub repository for installation, configuration, and usage.

Content

MCP Server Playwright

MCP Playwright

A Model Context Protocol server that provides browser automation capabilities using Playwright
Enable LLMs to interact with web pages, take screenshots, and execute JavaScript in a real browser environment

NPM Version Downloads per month License Smithery Installs

Table of Contents

Features

  • 🌐 Full browser automation capabilities
  • 📸 Screenshot capture of entire pages or specific elements
  • 🖱️ Comprehensive web interaction (navigation, clicking, form filling)
  • 📊 Console log monitoring
  • 🔧 JavaScript execution in browser context

Installation

Installing via Smithery

To install MCP Server Playwright for Claude Desktop automatically via Smithery:

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

You can install the package using either npx or mcp-get:

Using npx:

npx @automatalabs/mcp-server-playwright install

This command will:

  1. Check your operating system compatibility (Windows/macOS)
  2. Create or update the Claude configuration file
  3. Configure the Playwright server integration

The configuration file will be automatically created/updated at:

  • Windows: %APPDATA%\Claude\claude_desktop_config.json
  • macOS: ~/Library/Application Support/Claude/claude_desktop_config.json

Using mcp-get:

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

Configuration

The installation process will automatically add the following configuration to your Claude config file:

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

Components

Tools

playwright_navigate

Navigate to any URL in the browser

{
  "url": "https://stealthbrowser.cloud"
}

playwright_screenshot

Capture screenshots of the entire page or specific elements

{
  "name": "screenshot-name",     // required
  "selector": "#element-id",     // optional
  "fullPage": true              // optional, default: false
}

playwright_click

Click elements on the page using CSS selector

{
  "selector": "#button-id"
}

playwright_click_text

Click elements on the page by their text content

{
  "text": "Click me"
}

playwright_hover

Hover over elements on the page using CSS selector

{
  "selector": "#menu-item"
}

playwright_hover_text

Hover over elements on the page by their text content

{
  "text": "Hover me"
}

playwright_fill

Fill out input fields

{
  "selector": "#input-field",
  "value": "Hello World"
}

playwright_select

Select an option in a SELECT element using CSS selector

{
  "selector": "#dropdown",
  "value": "option-value"
}

playwright_select_text

Select an option in a SELECT element by its text content

{
  "text": "Choose me",
  "value": "option-value"
}

playwright_evaluate

Execute JavaScript in the browser console

{
  "script": "document.title"
}

Resources

  1. Console Logs (console://logs)

    • Access browser console output in text format
    • Includes all console messages from the browser
  2. Screenshots (screenshot://<n>)

    • Access PNG images of captured screenshots
    • Referenced by the name specified during capture

License

This project is licensed under the MIT License - see the LICENSE file for details.

No tools information available.
No content found.