npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

mcp-console-hub

v1.2.0

Published

MCP server that captures browser console logs and streams them to your IDE's AI agent in real-time

Downloads

448

Readme


What It Captures

| DevTools Tab | What's Captured | Details | |--------------|----------------|---------| | Console | console.error/warn/log/info/debug | With stack traces for errors/warnings | | Console | Unhandled exceptions | window.onerror with file + line + column | | Console | Promise rejections | unhandledrejection with stack | | Network | All fetch/XHR requests | Method, URL, status, duration, headers, body preview, size | | Network | Failed requests | 4xx, 5xx, connection errors with details | | Application | localStorage | All key-value pairs | | Application | sessionStorage | All key-value pairs | | Application | Cookies | Name, value, domain, path | | Application | IndexedDB | Database names | | Performance | Navigation timing | TTFB, DOM loaded, load complete, DNS, connect | | Performance | Resource loading | JS, CSS, images, fonts with duration + size | | Performance | Memory | Heap size (Chrome only) | | Performance | Marks & Measures | Custom performance marks |

Zero code changes. One bookmarklet. Works with any web app.


Quick Start

1. Configure your IDE

{
  "mcpServers": {
    "mcp-console-hub": {
      "command": "npx",
      "args": ["-y", "mcp-console-hub@latest"]
    }
  }
}
{
  "servers": {
    "mcp-console-hub": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "mcp-console-hub@latest"]
    }
  }
}
claude mcp add mcp-console-hub npx -y mcp-console-hub@latest
{
  "mcpServers": {
    "mcp-console-hub": {
      "command": "npx",
      "args": ["-y", "mcp-console-hub@latest"]
    }
  }
}

2. Connect your browser

Open http://localhost:3200 — drag the bookmarklet to your bookmarks bar.

Navigate to any web app. Click the bookmarklet.

3. Ask your AI agent

@mcp-console-hub Diagnose all errors and suggest fixes
@mcp-console-hub Show all network failures
@mcp-console-hub Read localStorage and explain the app state
@mcp-console-hub Audit page performance
@mcp-console-hub Fix errors by priority — most critical first

MCP Tools (24 tools)

Console (7 tools)

| Tool | Description | |------|-------------| | query_console | Filter by level, source, text, time, stack | | get_entry_context | Full context with parsed stack frames + timeline | | get_error_chains | Detect cascading errors (root cause analysis) | | get_repeated_patterns | Find recurring messages | | parse_stack_trace | Structured frames: function, file, line, col | | find_by_file | Find all errors from a specific source file | | get_unhandled_errors | Runtime exceptions + promise rejections |

Network (4 tools)

| Tool | Description | |------|-------------| | query_network | Filter by method, status, URL, duration | | get_network_detail | Full request/response: headers, body, timing | | get_network_errors | All 4xx, 5xx, and connection failures | | get_slow_requests | Requests above duration threshold |

Storage (3 tools)

| Tool | Description | |------|-------------| | read_storage | All storage: localStorage, sessionStorage, cookies, IndexedDB | | read_storage_key | Read specific key with auto JSON parse | | get_cookies | List/search cookies |

Performance (2 tools)

| Tool | Description | |------|-------------| | get_performance | Navigation timing, resources, memory, marks | | get_slow_resources | Find slow-loading JS, CSS, images, fonts |

General (4 tools)

| Tool | Description | |------|-------------| | get_console_stats | Aggregated statistics | | get_page_info | Page URL, user agent, all data availability | | get_timeline | Chronological event sequence | | clear_console | Clear all captured data |

Export (1 tool)

| Tool | Description | |------|-------------| | export_report | Full DevTools report as JSON or Markdown |


MCP Prompts (7 prompts)

| Prompt | Trigger | Description | |--------|---------|-------------| | diagnose | /diagnose | Full analysis of errors + network + performance | | fix_by_priority | /fix_by_priority | Prioritized fix list: Critical > High > Medium | | suggest_solution | /suggest_solution | Concrete code fix for the most recent error | | debug_network | /debug_network | Analyze failures, CORS issues, auth errors | | read_app_state | /read_app_state | Analyze storage to understand app state | | performance_audit | /performance_audit | Page load audit with optimization suggestions | | fix_entry | /fix_entry | Step-by-step fix for the latest error |


MCP Resources (12 resources)

| URI | Description | |-----|-------------| | console://entries | All console entries | | console://errors | Error-level only | | console://warnings | Warning-level only | | console://timeline | Chronological timeline | | console://summary | Aggregated stats | | network://requests | All network requests | | network://errors | Failed requests | | network://slow | Slow requests (>1s) | | storage://snapshot | Full storage snapshot | | storage://cookies | Cookies only | | performance://data | All performance data | | devtools://page | Page info + data availability |


How It Works

Browser (any web app)              MCP Console Hub                     IDE AI Agent
+-----------------+               +--------------------+              +----------------+
| Bookmarklet     |  WebSocket    |                    |    stdio     |                |
| captures:       |==============>|  Console Store     |<===========>|  24 MCP Tools  |
|                 |  :3201        |  Network Store     |              |  12 Resources  |
| - console.*     |               |  Storage Snapshot  |              |  7 Prompts     |
| - window.onerror|  HTTP POST    |  Performance Data  |              |                |
| - fetch/XHR     |-------------->|                    |              |  Cursor        |
| - localStorage  |  :3200        |  File-backed       |              |  VSCode        |
| - cookies       |               |  (.store/)         |              |  Claude Code   |
| - performance   |               |                    |              |  Antigravity   |
+-----------------+               +--------------------+              +----------------+
  zero code changes                  npx mcp-console-hub               IDE MCP config

Ports & Environment

| Port | Protocol | Purpose | |------|----------|---------| | 3200 | HTTP | Connector page + health + ingestion | | 3201 | WebSocket | Real-time data streaming |

| Variable | Default | Description | |----------|---------|-------------| | MCP_CONSOLE_HUB_PORT | 3200 | HTTP port | | MCP_CONSOLE_HUB_WS_PORT | 3201 | WebSocket port | | MCP_CONSOLE_HUB_STORE_PATH | auto | Custom store file path |


License

MIT — see LICENSE