Browser Runtime MCP
Click on "Deploy 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., "@Browser Runtime MCP What are the latest browser errors?"
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.
Browser Runtime MCP
Give AI agents real-time access to browser runtime errors, console logs, and page diagnostics.
The problem: AI coding agents can read your source code but are blind to what actually happens in the browser — runtime errors, console warnings, failed API calls, CSS rendering issues. You end up copy-pasting DevTools output back and forth.
The solution: A Chrome Extension captures browser events and streams them to a local MCP server. Your AI agent (Claude Code, Cursor, etc.) can query errors, console logs, and page state directly through MCP tools.
Browser tab → Chrome Extension → localhost MCP server → AI agentQuick Start
1. Install the MCP server
pip install browser-runtime-mcp2. Install the Chrome Extension
Download the extension/ folder from this repo, then:
Open
chrome://extensionsEnable Developer mode
Click Load unpacked → select the
extension/folder
3. Configure your AI tool
Claude Code — add to ~/.claude/settings.json:
{
"mcpServers": {
"browser-runtime-mcp": {
"command": "browser-runtime-mcp",
"args": []
}
}
}Other MCP clients — run the server in stdio mode:
browser-runtime-mcp4. Use it
Open the extension popup on the site you want to debug and click Enable capture on this site. Capture is disabled by default and the allowlist is stored locally in Chrome. Then ask your AI agent:
"Are there any browser errors?"
"What's in the console logs?"
"What pages is the extension tracking?"
Related MCP server: @nimbus21.ai/chrome-devtools-mcp
MCP Tools
Tool | Description |
| Runtime errors with stack traces and DOM context |
| Console output (error/warn/log), filterable by level |
| Tracked pages and buffer statistics |
| Clear all buffered data for a fresh start |
How It Works
┌─────────────────┐ postMessage ┌──────────────────┐
│ content.js │ ──────────────────▶ │ content-bridge.js │
│ (MAIN world) │ │ (ISOLATED world) │
│ │ │ │
│ • window.onerror│ │ chrome.runtime │
│ • console patch │ │ .sendMessage() │
└─────────────────┘ └────────┬───────────┘
│
chrome.runtime.onMessage
▼
┌────────────────┐
│ background.js │
│ (service worker)│
│ │
│ fetch() to │
│ localhost:18790 │
└────────┬────────┘
│ HTTP POST
▼
┌────────────────┐
│ MCP Server │
│ (Python/stdio) │
│ │ MCP tools
│ • HTTP receiver ├──────────────▶ AI Agent
│ • Error buffer │
│ • Log buffer │
└────────────────┘The three-hop architecture (MAIN → ISOLATED → background) bypasses Chrome's Private Network Access policy, which blocks HTTPS pages from fetching to localhost directly.
Privacy and trust boundary
Capture is opt-in per origin and disabled by default. Use the popup to stop capture when finished.
Captured URLs, page titles, errors, stack traces, DOM context, and console messages stay in bounded in-memory buffers on
127.0.0.1; they are not uploaded by this project.clear_buffersremoves all currently buffered data. Stopping the server also discards it.Do not enable capture on banking, authentication, health, internal administration, or other sensitive pages unless you intend to expose their diagnostics to your local MCP client.
Browser pages control their own console output. Treat captured messages and DOM snippets as untrusted diagnostic input, not authoritative data or instructions.
The HTTP diagnostic endpoints are intentionally local-only but are readable by other processes running as your user.
Standalone HTTP Mode
For debugging without MCP, run the HTTP receiver only:
browser-runtime-mcp --http-onlyThen query:
GET http://127.0.0.1:18790/health— buffer statsGET http://127.0.0.1:18790/errors— all captured errorsGET http://127.0.0.1:18790/logs— all captured logsGET http://127.0.0.1:18790/pages— tracked pages
Requirements
Python 3.10+
Chrome (Manifest V3 extension)
Zero Python dependencies (stdlib only)
License
MIT
Available Tools
4 toolsclear_buffersA
清空錯誤與 log 緩衝區。用於排除舊雜訊後重新觀察。
Inputs: no named parameters.
get_browser_errorsA
取得瀏覽器 runtime 錯誤(uncaught exceptions + unhandled promise rejections)。包含 error message、stack trace、發生位置的 DOM context。
Inputs: limit, url_filter.
get_console_logsB
取得瀏覽器 console 輸出(error / warn / log 三個等級)。
Inputs: level, limit, url_filter.
get_page_infoA
列出 extension 目前追蹤到的頁面(URL + title + 最後活動時間)以及緩衝區統計。
Inputs: no named parameters.
Tool Schema Changelog
Recent tool additions, removals, and schema changes observed during successful MCP inspections.
Loading tool schema changelog…
TDQS
Scored across 4 tools
Each tool has a clearly distinct purpose: browser errors (uncaught exceptions/promise rejections), console logs (all console levels), page info with buffer stats, and buffer clearing. No overlap exists between these four functions.
All tool names follow a consistent verb_noun pattern: get_browser_errors, get_console_logs, get_page_info, clear_buffers. The verb is uniform (get/clear) and the nouns are descriptive.
Four tools is well-scoped for a browser runtime diagnostics server. Each tool covers a distinct aspect of observation and maintenance without redundancy or bloat.
The surface covers error retrieval, log retrieval, page tracking, and buffer management—a complete monitoring lifecycle. A minor gap is lack of subscription or filtering capabilities, but not essential for the stated purpose.
Maintenance
Related MCP Connectors
Live browser debugging for AI assistants — DOM, console, network via MCP.
A paid remote MCP for AI agent browser DevTools MCP, built to return verdicts, receipts, usage logs,
Web scraping, browser automation, screenshots and AI data extraction for AI agents via MCP.
Control a real browser from AI agents: navigate, click, type, screenshot, read the page.
Related MCP Servers
- AlicenseNot gradedqualityCmaintenanceMCP server for browser debugging, inspection, and verification that streams console logs, network errors, and user actions into AI coding assistants.67AGPL 3.0
- AlicenseNot gradedqualityDmaintenanceLets AI coding agents control and inspect a live Chrome browser via MCP, providing Chrome DevTools capabilities for automation, debugging, and performance analysis.25 npmApache 2.0
- AlicenseNot gradedqualityDmaintenanceEnables AI agents to control Chrome browser actions like navigation, clicking, form filling, screenshots, and console/network logging via an MCP server and Chrome extension.688 npmMIT
- AlicenseAqualityDmaintenanceProvides AI coding agents real-time browser access to console logs, network requests, DOM elements, and screenshots via MCP, enabling tight edit-reload-verify feedback loops.153 npm2MIT