MCP-Server-Playwright

MCP-Server-Playwright

Browser automation via Model Context Protocol using Playwright

View on GitHub
251
Stars
33
Forks
251
Watchers
9
Issues
MCP-Server-Playwright provides browser automation capabilities through the Model Context Protocol (MCP), enabling large language models (LLMs) to interact with web pages directly. It leverages Playwright to allow navigation, element manipulation, screenshots, JavaScript execution, and access to console logs in real browser environments. The server integrates with AI assistants such as Claude and Cursor, making advanced web interaction possible for AI-driven workflows. Configuration and installation are streamlined for various desktop clients, with cross-platform compatibility for Windows and macOS.

Key Features

Full browser navigation and interaction using Playwright
Capture screenshots of entire pages or specific elements
Click, hover, and fill elements by CSS selector or text
Run arbitrary JavaScript code in browser context
Monitor and access browser console logs
Support for option selection in dropdowns by value or text
Cross-platform support (Windows, macOS)
Easy integration with AI clients like Claude and Cursor
Automatic configuration file generation
Access to captured screenshots and console logs as resources

Use Cases

Enabling AI assistants to browse and interact with web pages autonomously
Automating end-to-end web workflows driven by LLMs
Capturing dynamic webpage screenshots for documentation or analysis
Programmatically submitting forms and extracting web data
Clicking and verifying UI elements during automated testing or data extraction
Executing custom scripts for web scraping or DOM manipulation
Monitoring client-side console logs for debugging AI actions
Automating browser tasks for no-code or low-code environments
Enhancing AI-driven code editors with browser automation tools
Integrating browser-based resources into complex AI workflows

README

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:

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

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

Using npx:

bash
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:

bash
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:

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

Using with Cursor

You can also use MCP Server Playwright with Cursor, an AI-powered code editor. To enable browser automation in Cursor via MCP:

  1. Install Playwright browsers (if not already):

    bash
    npx playwright install

  2. Install MCP Server Playwright for Cursor using Smithery:

    bash
    npx -y @smithery/cli install @automatalabs/mcp-server-playwright --client cursor

  3. Configuration file setup:
    If you do not use Claude, the configuration file (claude_desktop_config.json) may not be created automatically.

    • On Windows, create a folder named Claude in %APPDATA% (usually C:\Users\<YourName>\AppData\Roaming\Claude).
    • Inside that folder, create a file named claude_desktop_config.json with the following content:
    json
    {
  "serverPort": 3456
}

  4. Follow the remaining steps in the Installation section above to complete the setup.

Now, you can use all the browser automation tools provided by MCP Server Playwright directly from Cursor’s AI features, such as web navigation, screenshot capture, and JavaScript execution.

Note: Make sure you have Node.js installed and npx available in your system PATH.

Components

Tools

browser_navigate

Navigate to any URL in the browser

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

browser_screenshot

Capture screenshots of the entire page or specific elements

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

browser_click

Click elements on the page using CSS selector

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

browser_click_text

Click elements on the page by their text content

javascript
{
  "text": "Click me"
}

browser_hover

Hover over elements on the page using CSS selector

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

browser_hover_text

Hover over elements on the page by their text content

javascript
{
  "text": "Hover me"
}

browser_fill

Fill out input fields

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

browser_select

Select an option in a SELECT element using CSS selector

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

browser_select_text

Select an option in a SELECT element by its text content

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

browser_evaluate

Execute JavaScript in the browser console

javascript
{
  "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.

Star History

Star History Chart

Repository Owner

Automata-Labs-team
Automata-Labs-team

Organization

Repository Details

Language JavaScript
Default Branch main
Size 103 KB
Contributors 5
License MIT License
MCP Verified Sep 5, 2025

Programming Languages

JavaScript
96.68%
Dockerfile
3.32%

Tags

browser automation Playwright

Join Our Newsletter

Stay updated with the latest AI tools, news, and offers by subscribing to our weekly newsletter.

We respect your privacy. Unsubscribe at any time.

Related MCPs

Discover similar Model Context Protocol servers

  • mcpmcp-server

    mcpmcp-server

    Seamlessly discover, set up, and integrate MCP servers with AI clients.

    mcpmcp-server enables users to discover, configure, and connect MCP servers with preferred clients, optimizing AI integration into daily workflows. It supports streamlined setup via JSON configuration, ensuring compatibility with various platforms such as Claude Desktop on macOS. The project simplifies the connection process between AI clients and remote Model Context Protocol servers. Users are directed to an associated homepage for further platform-specific guidance.

    • ⭐ 17
    • MCP
    • glenngillen/mcpmcp-server
  • mcp

    mcp

    Universal remote MCP server connecting AI clients to productivity tools.

    WayStation MCP acts as a remote Model Context Protocol (MCP) server, enabling seamless integration between AI clients like Claude or Cursor and a wide range of productivity applications, such as Notion, Monday, Airtable, Jira, and more. It supports multiple secure connection transports and offers both general and user-specific preauthenticated endpoints. The platform emphasizes ease of integration, OAuth2-based authentication, and broad app compatibility. Users can manage their integrations through a user dashboard, simplifying complex workflow automations for AI-powered productivity.

    • ⭐ 27
    • MCP
    • waystation-ai/mcp
  • mcp-server-js

    mcp-server-js

    Enable secure, AI-driven process automation and code execution on YepCode via Model Context Protocol.

    YepCode MCP Server acts as a Model Context Protocol (MCP) server that facilitates seamless communication between AI platforms and YepCode’s workflow automation infrastructure. It allows AI assistants and clients to execute code, manage environment variables, and interact with storage through standardized tools. The server can expose YepCode processes directly as MCP tools and supports both hosted and local installations via NPX or Docker. Enterprise-grade security and real-time interaction make it suitable for integrating advanced automation into AI-powered environments.

    • ⭐ 31
    • MCP
    • yepcode/mcp-server-js
  • pluggedin-mcp-proxy

    pluggedin-mcp-proxy

    Unified proxy server for Model Context Protocol data exchanges and AI integrations

    Aggregates multiple Model Context Protocol (MCP) servers into a single, unified proxy interface, supporting real-time discovery, management, and orchestration of AI model resources, tools, and prompts. Enables seamless interaction between MCP clients such as Claude, Cline, and Cursor, while integrating advanced document search, AI document exchange, and workspace management. Provides flexible transport modes (STDIO and Streamable HTTP), robust authentication, and comprehensive security measures for safe and scalable AI data exchange.

    • ⭐ 87
    • MCP
    • VeriTeknik/pluggedin-mcp-proxy
    • View all Alternatives

    Didn't find tool you were looking for?

    Be as detailed as possible for better results