📌Overview

Purpose: Enable LLMs (Large Language Models) to perform browser automation tasks such as web page interaction, screenshot capture, and JavaScript execution within a real browser environment.

Overview: MCP Server Playwright is a Model Context Protocol server designed to leverage Playwright for comprehensive browser automation. It allows seamless integration with LLMs to enhance their web interaction capabilities, making it possible to automate tasks typically performed by a user in a browser.

Key Features:

• Full Browser Automation: Provides extensive automation features, enabling users to navigate, interact, and control web pages programmatically.

• Screenshot Capture: Allows capturing of full-page or specific element screenshots, helping in visual verification or debugging.

• Web Interaction: Facilitates various interactions on web pages, such as clicking, filling forms, and selecting options, thus mimicking user behavior.

• JavaScript Execution: Supports executing JavaScript code directly in the browser context, enabling dynamic interactions and manipulations of web applications.

• Console Log Monitoring: Provides access to browser console logs for monitoring and debugging purposes, ensuring developers have insights into dynamic web interactions.

---

MCP Server 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.

---

Table of Contents

• Features
• Installation
• Configuration
• Components
  • Tools
  • Resources
• License

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%\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

browser_navigate

Navigate to any URL in the browser.

Example:

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

browser_screenshot

Capture screenshots of the entire page or specific elements.

Example:

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

browser_click

Click elements on the page using CSS selector.

Example:

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

browser_click_text

Click elements on the page by their text content.

Example:

{
  "text": "Click me"
}

browser_hover

Hover over elements on the page using CSS selector.

Example:

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

browser_hover_text

Hover over elements on the page by their text content.

Example:

{
  "text": "Hover me"
}

browser_fill

Fill out input fields.

Example:

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

browser_select

Select an option in a SELECT element using CSS selector.

Example:

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

browser_select_text

Select an option in a SELECT element by its text content.

Example:

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

browser_evaluate

Execute JavaScript in the browser console.

Example:

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