Customable - MCPs

Repositories

49

Projects Packages

17

@customable/browser-mcp (1.2.0)

Published 2025-10-09 14:28:15 +02:00 by jack in customable-mcp/browser-mcp

Installation

Setup this registry in your project .npmrc file:

@customable:registry=

To install the package using npm, run the following command:

npm install @customable/browser-mcp@1.2.0

or add it to the package.json file:

"@customable/browser-mcp": "1.2.0"

For more information on the npm registry, see the documentation.

About this package

🌍 browser-mcp

MCP Server for browser automation - featuring multi-tab support, screenshots, DOM queries, and website testing with Puppeteer.

Features

🆕 Multi-Tab Management

• 🗂️ create_tab - Create and manage multiple browser tabs
• 🔄 navigate_tab - Navigate existing tabs to new URLs
• 📋 list_tabs - List all open tabs with their details
• ❌ close_tab - Close specific tabs
• 🎯 All tools support optional tabId parameter to work with persistent tabs

Core Features

• 🌐 open_page - Open a webpage (one-time or in managed tab)
• 📄 get_title - Get page title
• 📸 screenshot - Take screenshot (full page or element)
• 🔍 query_selector - Query DOM element and get text/attributes
• ⌨️ fill_form - Fill form fields and submit
• 🖱️ click_element - Click on element by selector

Advanced Features

• 🍪 Cookie management (get, set)
• 📊 Performance metrics (page load time, resource timing)
• 📱 Viewport configuration (desktop, mobile, custom)
• 📋 Extract page content (text, HTML)
• 📄 PDF extraction
• 📊 Table and list extraction with pagination

Installation

npm install @customable/browser-mcp

Or install from Forgejo Package Registry:

# Add to your .npmrc
echo "@customable:registry=https://git.customable.host/api/packages/customable-mcp/npm/" >> .npmrc

# Install
npm install @customable/browser-mcp

Configuration

Add to your Claude Code MCP settings (~/.claude/settings.json):

{
  "mcpServers": {
    "browser-mcp": {
      "command": "node",
      "args": ["/path/to/node_modules/@customable/browser-mcp/dist/index.js"],
      "env": {
        "HEADLESS": "true",
        "SCREENSHOT_DIR": "./screenshots"
      }
    }
  }
}

Environment Variables

• HEADLESS - Run in headless mode (default: true)
• SCREENSHOT_DIR - Directory for screenshots (default: ./screenshots)

Usage

Once configured, the MCP server will be available in Claude Code. You can use tools like:

open_page, screenshot, query_selector, fill_form, click_element, etc.

Examples

Multi-Tab Workflow

// Create a new tab
{
  "tool": "create_tab",
  "arguments": {
    "url": "https://example.com"
  }
}
// Returns: { "tabId": "abc-123...", "url": "https://example.com", "title": "Example Domain" }

// Use the tab for multiple operations
{
  "tool": "screenshot",
  "arguments": {
    "url": "",
    "tabId": "abc-123...",
    "fullPage": true
  }
}

{
  "tool": "get_content",
  "arguments": {
    "url": "",
    "tabId": "abc-123...",
    "type": "text"
  }
}

// Navigate to another page in the same tab
{
  "tool": "navigate_tab",
  "arguments": {
    "tabId": "abc-123...",
    "url": "https://example.org"
  }
}

// List all open tabs
{
  "tool": "list_tabs",
  "arguments": {}
}

// Close the tab when done
{
  "tool": "close_tab",
  "arguments": {
    "tabId": "abc-123..."
  }
}

Take a screenshot (one-time operation)

{
  "tool": "screenshot",
  "arguments": {
    "url": "https://example.com",
    "fullPage": true
  }
}

Query DOM element

{
  "tool": "query_selector",
  "arguments": {
    "url": "https://example.com",
    "selector": "h1",
    "attribute": "textContent"
  }
}

Fill form

{
  "tool": "fill_form",
  "arguments": {
    "url": "https://example.com/form",
    "fields": {
      "#email": "user@example.com",
      "#password": "secret"
    },
    "submit": true
  }
}

Extract tables from a webpage

{
  "tool": "extract_tables",
  "arguments": {
    "url": "https://example.com/data",
    "selector": ".data-table",
    "limit": 5,
    "maxRows": 50
  }
}

License

MIT

Dependencies

Dependencies

ID	Version
@modelcontextprotocol/sdk	^0.5.0
puppeteer	^22.0.0

Development dependencies

ID	Version
@types/node	^18.0.0
typescript	^5.3.0

Keywords

mcp browser puppeteer automation testing

Details

npm

customable-mcp/browser-mcp

2025-10-09 14:28:15 +02:00

1

Customable Team

Project website

MIT

21 KiB

Assets (1)

browser-mcp-1.2.0.tgz 21 KiB

Versions (4) View all

3.0.0 2025-10-11

2.0.0 2025-10-10

1.2.0 2025-10-09

1.0.5 2025-10-07

Issues