MCP Server Playwright

Local 2025-08-31 23:17:33 0
Browser Automation @Automata-Labs-team/MCP-Server-Playwright

Enables LLMs to interact with web pages, take screenshots, and execute JavaScript in a real browser environment

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

MCP-Server-Playwright MCP server

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 -y @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%Claudeclaude_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

browser_navigate

Navigate to any URL in the browser 

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

browser_screenshot

Capture screenshots of the entire page or specific elements 

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

browser_click

Click elements on the page using CSS selector 

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

browser_click_text

Click elements on the page by their text content 

{
  "text": "Click me"
}

browser_hover

Hover over elements on the page using CSS selector 

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

browser_hover_text

Hover over elements on the page by their text content 

{
  "text": "Hover me"
}

browser_fill

Fill out input fields 

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

browser_select

Select an option in a SELECT element using CSS selector 

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

browser_select_text

Select an option in a SELECT element by its text content 

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

browser_evaluate

Execute JavaScript in the browser console 

{
  "script": "document.title"
}

Resources

  1. Console Logs (console://logs)
  2. Access browser console output in text format

  3. Includes all console messages from the browser

  4. Screenshots (screenshot://<n>)

  5. Access PNG images of captured screenshots
  6. Referenced by the name specified during capture

License

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

[
  {
    "description": "Navigate to a URL",
    "inputSchema": {
      "properties": {
        "url": {
          "type": "string"
        }
      },
      "required": [
        "url"
      ],
      "type": "object"
    },
    "name": "browser_navigate"
  },
  {
    "description": "Take a screenshot of the current page or a specific element",
    "inputSchema": {
      "properties": {
        "fullPage": {
          "default": false,
          "description": "Take a full page screenshot (default: false)",
          "type": "boolean"
        },
        "name": {
          "description": "Name for the screenshot",
          "type": "string"
        },
        "selector": {
          "description": "CSS selector for element to screenshot",
          "type": "string"
        }
      },
      "required": [
        "name"
      ],
      "type": "object"
    },
    "name": "browser_screenshot"
  },
  {
    "description": "Click an element on the page using CSS selector",
    "inputSchema": {
      "properties": {
        "selector": {
          "description": "CSS selector for element to click",
          "type": "string"
        }
      },
      "required": [
        "selector"
      ],
      "type": "object"
    },
    "name": "browser_click"
  },
  {
    "description": "Click an element on the page by its text content",
    "inputSchema": {
      "properties": {
        "text": {
          "description": "Text content of the element to click",
          "type": "string"
        }
      },
      "required": [
        "text"
      ],
      "type": "object"
    },
    "name": "browser_click_text"
  },
  {
    "description": "Fill out an input field",
    "inputSchema": {
      "properties": {
        "selector": {
          "description": "CSS selector for input field",
          "type": "string"
        },
        "value": {
          "description": "Value to fill",
          "type": "string"
        }
      },
      "required": [
        "selector",
        "value"
      ],
      "type": "object"
    },
    "name": "browser_fill"
  },
  {
    "description": "Select an element on the page with Select tag using CSS selector",
    "inputSchema": {
      "properties": {
        "selector": {
          "description": "CSS selector for element to select",
          "type": "string"
        },
        "value": {
          "description": "Value to select",
          "type": "string"
        }
      },
      "required": [
        "selector",
        "value"
      ],
      "type": "object"
    },
    "name": "browser_select"
  },
  {
    "description": "Select an element on the page with Select tag by its text content",
    "inputSchema": {
      "properties": {
        "text": {
          "description": "Text content of the element to select",
          "type": "string"
        },
        "value": {
          "description": "Value to select",
          "type": "string"
        }
      },
      "required": [
        "text",
        "value"
      ],
      "type": "object"
    },
    "name": "browser_select_text"
  },
  {
    "description": "Hover an element on the page using CSS selector",
    "inputSchema": {
      "properties": {
        "selector": {
          "description": "CSS selector for element to hover",
          "type": "string"
        }
      },
      "required": [
        "selector"
      ],
      "type": "object"
    },
    "name": "browser_hover"
  },
  {
    "description": "Hover an element on the page by its text content",
    "inputSchema": {
      "properties": {
        "text": {
          "description": "Text content of the element to hover",
          "type": "string"
        }
      },
      "required": [
        "text"
      ],
      "type": "object"
    },
    "name": "browser_hover_text"
  },
  {
    "description": "Execute JavaScript in the browser console",
    "inputSchema": {
      "properties": {
        "script": {
          "description": "JavaScript code to execute",
          "type": "string"
        }
      },
      "required": [
        "script"
      ],
      "type": "object"
    },
    "name": "browser_evaluate"
  }
]