Playwright

🚀 MCP Server Playwright

A Model Context Protocol (MCP) server that provides browser automation capabilities, implemented using Playwright. It enables large language models to interact with web pages, take screenshots, and execute JavaScript in a real browser environment.

🚀 Quick Start

The MCP Server Playwright is a Playwright-based tool for performing automated operations in a browser environment. It supports various browser functions, including taking screenshots, capturing console logs, and interacting with web page elements.

📦 Installation

Use the following command to install the MCP Server Playwright:

npm install @automatalabs/mcp-server-playwright

💻 Usage Examples

Basic Usage

const { createServer } = require('@automatalabs/mcp-server-playwright');

async function main() {
  const server = await createServer();
  await server.start();
}

Advanced Usage

const { createServer } = require('@automatalabs/mcp-server-playwright');

async function main() {
  const server = await createServer();
  await server.start();

  // Navigate to a web page
  await page.goto('https://example.com');

  // Take a screenshot
  const screenshot = await page.screenshot({ name: 'homepage' });

  // Fill out a form
  await page.fill('#input-field', 'Hello World');
  
  // Submit the form
  await page.click('#submit-button');

  console.log('Operation completed');
}

main().catch(console.error);

✨ Features

Browser Operations

• Navigation: Access web pages via URL

  await page.goto('https://example.com');
  

• Screenshot: Capture a PNG image of the current view

  const screenshot = await page.screenshot();
  

• Console Logs: Get browser console output

  const logs = await page.logs();
  

Element Interaction

• Click Element: Locate and click an element by selector or text

  await page.click('#menu-item');
  await page.clickText('Hover me');
  

• Fill Form: Fill content into an input field

  await page.fill('#input-field', 'Hello World');
  

• Select Dropdown Option: Select an option from a dropdown menu by selector or text

  await page.select('#dropdown', 'option-value');
  await page.selectText('#dropdown', 'Choose me');
  

Script Execution

• Execute JavaScript: Run any script in the browser environment

  const title = await page.evaluate('document.title');
  

📚 Documentation

Resource Access

1. Screenshot Resource (screenshot://<n>):
   • Access a PNG image file with a specified name.
   • Obtained using the screenshot command.
2. Console Log Resource (console://logs):
   • Get the browser console output text.
   • Includes all console messages.

📄 License

This project is licensed under the MIT License. Please refer to the LICENSE file for details.