dev-chrome-monitor

A Model Context Protocol (MCP) server that keeps a Chromium instance attached with Puppeteer so tooling (Cursor, Trae, etc.) can inspect dev builds, capture screenshots, and drive the UI. The server exposes a permission-gated tool set so you remain in control of navigation, evaluation, and DOM automation.

Installation

npm install @2sslgetlool/dev-chrome-monitor

Usage

Add the server to your project's mcp.json:

{
  "mcpServers": {
    "chrome": {
      "command": "node",
      "args": [
        "node_modules/@2sslgetlool/dev-chrome-monitor/dist/devChromeServer.mjs"
      ],
      "env": {
        "MCP_DEV_URL": "http://localhost:5173/",
        "MCP_CHROME_PATH": "C:\\\Program Files\\\Google\\\Chrome\\\Application\\\chrome.exe",
        "MCP_NAV_TIMEOUT": "45000",
        "MCP_WAIT_TIMEOUT": "45000"
      }
    }
  }
}

Reload MCP in your IDE, then use the built-in tools:

• dev_list_permissions → inspect which capabilities are enabled.
• dev_grant_permissions / dev_revoke_permissions → grant or revoke permissions (accepts permissions: ["status", "navigate", ...] or ["all"] plus confirm: true).
• Other tools (dev_status, dev_screenshot, dev_eval, etc.) will only run after the matching permission is granted.

Environment Variables

• MCP_DEV_URL – default URL to open (the dev server you want to monitor).
• MCP_CHROME_PATH – optional explicit Chrome/Chromium executable path.
• MCP_NAV_TIMEOUT, MCP_WAIT_TIMEOUT – navigation/wait timeouts in milliseconds.

Development

npm install
npm run build

npm run build copies the latest source (src/devChromeServer.mjs) into dist/ so the published package stays in sync.

License

MIT