Provides browser automation capabilities including navigation, element interaction, content extraction, screenshot capture, PDF generation, cookie management, and multi-tab support for web scraping and testing workflows.
Click on "Install Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@Puppeteer MCP Servertake a screenshot of the homepage and save it as example.png"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
Puppeteer MCP Server
A Model Context Protocol (MCP) server that provides browser automation capabilities through Puppeteer. This server enables AI agents to interact with web pages, take screenshots, execute JavaScript, and perform various browser operations.
Features
Multi-tab Support: Manage multiple browser tabs with unique IDs
Comprehensive Tools: 27 tools for navigation, interaction, content extraction, and more
Dual Transport: Supports both stdio (for Claude Desktop/Code) and HTTP transports
Result Types: Consistent error handling with structured Result types
Installation
npm install
npm run buildUsage
Stdio Mode (Default)
For use with Claude Desktop or Claude Code:
npm start
# or
node dist/index.jsHTTP Mode
For remote or containerized deployments:
npm start -- --http
# or
node dist/index.js --http --port=3000Claude Desktop Configuration
Add to your Claude Desktop config:
{
"mcpServers": {
"puppeteer": {
"command": "node",
"args": ["/path/to/puppeteer-mcp/dist/index.js"]
}
}
}Available Tools
Tab Management
Tool | Description |
| List all open browser tabs |
| Create a new tab (optionally with URL) |
| Close a tab |
| Switch to a different tab |
Navigation
Tool | Description |
| Navigate to a URL |
| Reload the current page |
| Navigate back in history |
| Navigate forward in history |
Interaction
Tool | Description |
| Click an element |
| Fill a text input |
| Select dropdown option(s) |
| Hover over an element |
| Focus an element |
Input
Tool | Description |
| Press keyboard keys |
| Perform mouse actions |
| Scroll the page or element |
Content
Tool | Description |
| Execute JavaScript |
| Get page/element HTML or text |
| Get element information |
Waiting
Tool | Description |
| Wait for element to appear |
| Wait for navigation |
| Wait for specified time |
Media
Tool | Description |
| Capture screenshot |
| Generate PDF |
Cookies
Tool | Description |
| Get cookies |
| Set cookies |
| Delete cookies |
Tool Parameters
All tools that operate on pages accept an optional tabId parameter. If not specified, the active tab is used.
Example: Navigate and Take Screenshot
// Navigate
{ "name": "navigate", "arguments": { "url": "https://example.com" } }
// Take screenshot
{ "name": "screenshot", "arguments": { "fullPage": true, "format": "png" } }Example: Multi-tab Workflow
// Create new tab
{ "name": "new_tab", "arguments": { "url": "https://site-a.com" } }
// Returns: { "id": "tab_abc123", "url": "https://site-a.com", ... }
// Create another tab
{ "name": "new_tab", "arguments": { "url": "https://site-b.com" } }
// Returns: { "id": "tab_def456", "url": "https://site-b.com", ... }
// List all tabs
{ "name": "list_tabs", "arguments": {} }
// Interact with specific tab
{ "name": "click", "arguments": { "selector": "button", "tabId": "tab_abc123" } }Environment Variables
Variable | Description | Default |
| HTTP server port |
|
| Run browser headless |
|
| Default operation timeout (ms) |
|
Development
# Install dependencies
npm install
# Run in development mode
npm run dev
# Type check
npm run typecheck
# Run tests
npm test
# Build
npm run buildArchitecture
src/
├── index.ts # Entry point, transport setup
├── server.ts # MCP server configuration
├── browser.ts # Browser lifecycle management
├── tabs.ts # Multi-tab state management
├── types.ts # TypeScript interfaces
├── errors.ts # Result types and error handling
├── schemas.ts # Zod validation schemas
└── tools/
├── tab-tools.ts # Tab management tools
├── navigation.ts # Navigation tools
├── interaction.ts # Click, fill, select, etc.
├── content.ts # Evaluate, get content
├── waiting.ts # Wait tools
├── media.ts # Screenshot, PDF
├── cookies.ts # Cookie management
└── input.ts # Keyboard, mouse, scrollLicense
MIT