Skip to content

CONTRIBUTING.md

Latest commit

 

History

History
120 lines (90 loc) · 3.75 KB

CONTRIBUTING.md

File metadata and controls

120 lines (90 loc) · 3.75 KB
Raw

Contributing to Browser MCP

Thanks for your interest in contributing! Browser MCP is open source and welcomes contributions of all kinds.

Quick Start

# Clone the repo
git clone https://github.com/Agent360dk/browser-mcp.git
cd browser-mcp

# Install MCP server dependencies
cd mcp-server && npm install && cd ..

# Load extension in Chrome
# 1. Go to chrome://extensions
# 2. Enable Developer mode
# 3. Click "Load unpacked"
# 4. Select the extension/ folder

# Add to Claude Code
claude mcp add browser-mcp node mcp-server/index.js

# Test it
# Open Claude Code and try: browser_navigate("https://example.com")

Project Structure

extension/           # Chrome extension (Manifest V3)
  background.js      # Service worker — all browser automation logic
  manifest.json      # Extension config + permissions
  offscreen.js       # WebSocket bridge to MCP server
  popup.html/js      # Status UI

mcp-server/          # MCP server (Node.js)
  index.js           # MCP server + WebSocket client
  tools.js           # 34 tool definitions
  bin/cli.js         # CLI installer
  package.json       # npm config

docs/                # Landing page (browsermcp.dev)
assets/              # Demo video + GIF

How to Contribute

Bug Reports

Open a 🐛 Bug Report — the template guides you through expected/actual/repro/version/OS.

Or, in any Claude Code session with browser-mcp installed, say "report a browser-mcp bug: …" and Claude will draft + offer the submit link via the browser_about tool.

Feature Requests

Open a 💡 Feature Wish — describe what you want it to do, why (your use case), and an optional example call. Wishes are curated into WISHLIST.md and move to ✅ Shipped when implemented.

Or, in any Claude Code session, say "I wish browser-mcp could …" and Claude will draft + offer the submit link.

Share a Use-Case

Built something cool with Browser MCP? 🎯 Share it — fill in what you built, how, and (optionally) why Browser MCP was the right tool. Approved use-cases land in USE_CASES.md.

Code Contributions

  1. Fork the repo
  2. Create a branch: git checkout -b my-feature
  3. Make your changes in extension/background.js (browser logic) or mcp-server/tools.js (tool definitions)
  4. Test locally with Claude Code
  5. Commit: git commit -m "feat: add my feature"
  6. Push: git push origin my-feature
  7. Open a Pull Request

Adding a New Tool

  1. Add tool definition in mcp-server/tools.js:
{
  name: 'browser_my_tool',
  description: 'What it does',
  inputSchema: {
    type: 'object',
    properties: { /* params */ },
  },
}
  1. Add handler in extension/background.js (in the switch/case block):
case 'my_tool': {
  const tab = await getSessionTab(port);
  // implementation
  return { ok: true };
}
  1. Add to methodMap in mcp-server/index.js:
browser_my_tool: 'my_tool',
  1. Update README tool count and table.

Non-Code Contributions

These are equally valuable:

  • Documentation improvements
  • README translations (create README.zh-CN.md, README.ja.md, etc.)
  • Bug reports with clear reproduction steps
  • Sharing Browser MCP in your community

Code Style

  • No build step — plain JavaScript (ES modules)
  • const over let, let over var
  • Async/await over callbacks
  • Error messages should be helpful (include what went wrong + how to fix)
  • Comments only for non-obvious "why", not "what"

License

By contributing, you agree that your contributions will be licensed under the MIT License.