Skip to main content
Glama
MakiDevelop

Browser Runtime MCP

by MakiDevelop

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 agent

Quick Start

1. Install the MCP server

pip install browser-runtime-mcp

2. Install the Chrome Extension

Download the extension/ folder from this repo, then:

  1. Open chrome://extensions

  2. Enable Developer mode

  3. 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-mcp

4. 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

get_browser_errors

Runtime errors with stack traces and DOM context

get_console_logs

Console output (error/warn/log), filterable by level

get_page_info

Tracked pages and buffer statistics

clear_buffers

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_buffers removes 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-only

Then query:

  • GET http://127.0.0.1:18790/health — buffer stats

  • GET http://127.0.0.1:18790/errors — all captured errors

  • GET http://127.0.0.1:18790/logs — all captured logs

  • GET 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 tools
clear_buffersA

清空錯誤與 log 緩衝區。用於排除舊雜訊後重新觀察。

ParametersJSON Schema
NameRequiredDescriptionDefault

No parameters

TDQS

A4.3/5.0
Behavior3/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

With no annotations, the description carries the full burden. It explicitly states that the tool clears error and log buffers, which indicates a destructive action on accumulated data. However, it does not mention side effects, irreversibility, or any impact beyond the buffers, leaving some behavioral ambiguity.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is extremely concise, with two short sentences. The first sentence states the primary action, and the second provides the intended use case. No wasted words.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness5/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

Given the simplicity of the tool (no parameters, no output schema, clear action), the description fully covers what the tool does and when to use it. It is complete and adequate for an agent to invoke correctly.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters4/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

The tool has zero parameters, so the schema is fully covered. The description correctly omits parameter details, and the baseline of 4 applies since no parameter explanation is needed.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description clearly states the verb ('清空' / clear) and the specific resources ('錯誤與 log 緩衝區' / error and log buffers). This distinguishes it from sibling getter tools like get_browser_errors and get_console_logs by signaling a mutating action.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines4/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description provides a clear usage context: to eliminate old noise before re-observing. It implies this is a reset/preparation step, though it does not explicitly mention when not to use it or list alternative tools.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

get_browser_errorsA

取得瀏覽器 runtime 錯誤(uncaught exceptions + unhandled promise rejections)。包含 error message、stack trace、發生位置的 DOM context。

ParametersJSON Schema
NameRequiredDescriptionDefault
limitNo回傳筆數上限,預設 20
url_filterNo只回傳包含此子字串的 URL 的錯誤

TDQS

A4/5.0
Behavior3/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

No annotations are provided, so the description carries the full burden of behavioral disclosure. It does disclose the scope (uncaught exceptions + unhandled promise rejections) and included data (message, stack trace, DOM context), but it does not mention whether the tool is read-only, whether it clears errors, or any limitations (e.g., buffer size beyond the limit parameter).

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is two sentences, front-loaded with the core purpose and followed by key specifics. Every clause adds value without redundancy, making it appropriately concise and well-structured.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

Given the tool's low complexity, optional parameters, and no output schema, the description covers the essential behavior. It might benefit from noting that it returns a list of errors or that it does not affect browser state, but the current description is sufficiently complete for basic usage.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema description coverage is 100%: both 'limit' and 'url_filter' have clear descriptions. The tool description adds no additional parameter semantics beyond what the schema already provides, so the baseline score of 3 applies.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description clearly states the tool's purpose: to retrieve browser runtime errors (uncaught exceptions and unhandled promise rejections). It specifies the resource ('browser runtime errors') and the verb ('取得' / get), and distinguishes itself from sibling tools like get_console_logs by targeting errors rather than logs.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines4/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description makes it clear this tool is for debugging runtime errors, which implies when to use it. However, it does not explicitly mention alternatives or exclusions (e.g., 'use get_console_logs for console messages'), so it lacks explicit when-not-to-use guidance, but the context is clear enough.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

get_console_logsB

取得瀏覽器 console 輸出(error / warn / log 三個等級)。

ParametersJSON Schema
NameRequiredDescriptionDefault
levelNo篩選等級:error / warn / log / all(預設 all)all
limitNo回傳筆數上限,預設 50
url_filterNo只回傳包含此子字串的 URL 的 log

TDQS

B3.4/5.0
Behavior2/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

There are no annotations, so the description carries the full burden. It merely says 'get console output' without disclosing return format, ordering, buffering behavior, or whether reading the logs clears them. The sibling clear_buffers suggests a buffer relationship, but this is not addressed.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is a single, efficient sentence that immediately states the tool's purpose and scope. All words are relevant, and it is properly front-loaded with the core action.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness2/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

Given the presence of siblings like clear_buffers and no output schema, the description is too terse. It does not explain what the returned logs look like, whether they are cumulative, or if the call has side effects on the buffer. This leaves important gaps for an agent selecting the tool.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

The input schema covers all three parameters (level, limit, url_filter) with descriptions and defaults, so the schema provides full parameter semantics. The tool description adds no additional meaning beyond what the schema already states, which is the baseline 3.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description clearly states the tool retrieves browser console output with three log levels (error/warn/log). This is specific and distinguishes it from the sibling get_browser_errors by covering all console levels, not just errors.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines3/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description implies the tool is for fetching console logs but gives no explicit guidance on when to prefer it over get_browser_errors or how it relates to clear_buffers. Usage context is only implied through the tool's name and description.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

get_page_infoA

列出 extension 目前追蹤到的頁面(URL + title + 最後活動時間)以及緩衝區統計。

ParametersJSON Schema
NameRequiredDescriptionDefault

No parameters

TDQS

A4/5.0
Behavior3/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

No annotations are provided, so the description carries full behavioral disclosure burden. It states that the tool lists currently tracked pages and buffer statistics, indicating a read-only operation, but it does not explicitly confirm safety, permissions, or side effects. It could benefit from stating that this is a non-mutating inspection tool.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is a single, well-structured sentence that starts with the action verb and includes key output components. It is concise with no unnecessary wording.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

For a zero-parameter, read-only listing tool, the description provides adequate context: it specifies the exact data returned (pages with URL/title/last activity, buffer stats) and implies the current state. Without an output schema, the description covers essential return values, though it could elaborate on the format of buffer statistics.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters4/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

There are no parameters, and the schema is empty, so parameter semantics are trivially covered. The description adds context about the return payload (URL, title, last activity, buffer stats), which clarifies the tool's output without needing parameter explanations. Baseline 4 is appropriate.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description uses the specific verb '列出' (list) and clearly identifies the resource as pages tracked by the extension, including URL, title, and last activity time, plus buffer statistics. This distinguishes it from sibling tools like get_browser_errors and get_console_logs, which address errors and logs respectively.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines3/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description does not provide explicit when-to-use or alternative guidance. It clearly explains that the tool returns page tracking info, implying it is used when page data is needed, but no exclusions or alternative tools are mentioned.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

Tool Schema Changelog

Recent tool additions, removals, and schema changes observed during successful MCP inspections. Dates show when Glama detected each change.

  1. 4 tool updatesv0.2.0
    • First observedclear_buffers
    • First observedget_browser_errors
    • First observedget_console_logs
    • First observedget_page_info

TDQS

A4/5.0
Disambiguation5/5

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.

Naming Consistency5/5

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.

Tool Count5/5

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.

Completeness4/5

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

ActivityMaintained
ResponsivenessSyncing

Resources

Unclaimed servers have limited discoverability.

Looking for Admin?

If you are the server author, to access and configure the admin panel.

Related MCP Connectors

Related MCP Servers

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/MakiDevelop/browser-runtime-mcp'

If you have feedback or need assistance with the MCP directory API, please join our Discord server