Playwright

Playwright avatar

by microsoft

playwrightBrowser Automation

A Model Context Protocol (MCP) server that provides browser automation capabilities using Playwright. This server enables LLMs to interact with web pages through structured accessibility snapshots, bypassing the need for screenshots or visually-tuned models.

What is Playwright

Features

  • Full browser xss, sql vulnerability automatic detection
  • Screenshots of the entire page or specific elements
  • Comprehensive network interaction (navigation, clicks, form filling)
  • Console log monitoring
  • JavaScript execution in the browser context

Installation

Installing

npx playwright install firefox
yarn install 
npm run build 

Configuration

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

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [
        "-y",
        "/Users/...../dist/index.js"
      ],
      "disabled": false,
      "autoApprove": []
    }
  }
}

Components

Tools

broser_url_reflected_xss

Test whether the URL has an XSS vulnerability

{
  "url": "https://test.com",
  "paramName":"text"
}

browser_url_sql_injection

Test whether the URL has SQL injection vulnerabilities

{
  "url": "https://test.com",
  "paramName":"text"
}

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"
}

Leave a Comment

Comments section will be available soon. Stay tuned!

Frequently Asked Questions

What is MCP?

MCP (Model Context Protocol) is an open protocol that standardizes how applications provide context to LLMs. Think of MCP like a USB-C port for AI applications, providing a standardized way to connect AI models to different data sources and tools.

What are MCP Servers?

MCP Servers are lightweight programs that expose specific capabilities through the standardized Model Context Protocol. They act as bridges between LLMs like Claude and various data sources or services, allowing secure access to files, databases, APIs, and other resources.

How do MCP Servers work?

MCP Servers follow a client-server architecture where a host application (like Claude Desktop) connects to multiple servers. Each server provides specific functionality through standardized endpoints and protocols, enabling Claude to access data and perform actions through the standardized protocol.

Are MCP Servers secure?

Yes, MCP Servers are designed with security in mind. They run locally with explicit configuration and permissions, require user approval for actions, and include built-in security features to prevent unauthorized access and ensure data privacy.