Skip to content

Conversation

regenrek
Copy link
Collaborator

Summary

This PR introduces optional network logging capabilities to Browser Echo MCP, allowing developers to capture and monitor network activity alongside console logs.

Changes

New Features:

  • Network Logging (opt-in): Capture fetch, XMLHttpRequest, and WebSocket activity as [network] entries
  • Tag-based Filtering: Added tag filtering support to get_logs() and diagnostics endpoints
  • Worker Runtime: Internal worker console capture runtime (dev-only)
  • MCP File Logging: Optional ingest-side file logging with split directory support

Implementation Details:

  • Network capture is opt-in via networkLogs.enabled: true in configuration
  • Removed protocol from network log formatting for cleaner output
  • Added tag parameter to get_logs() for filtering by [browser], [network], or [worker]
  • Enhanced MCP server with file logging support (BROWSER_ECHO_FILE_LOG=true)
  • Updated all framework providers (Vite, Next.js, Nuxt) to support network capture

Configuration:

// Enable network logging
{
  networkLogs: {
    enabled: true,
    captureFull: false // Optional: capture additional details
  }
}

// Filter logs by tag
get_logs({ tag: '[network]' })

Testing

All existing tests pass with the changes. The implementation maintains backward compatibility while adding new capabilities.

Breaking Changes

None. All changes are additive and opt-in.

Copy link

pkg-pr-new bot commented Sep 13, 2025

Open in StackBlitz

@browser-echo/core

npm i https://pkg.pr.new/instructa/browser-echo/@browser-echo/core@5

@browser-echo/mcp

npm i https://pkg.pr.new/instructa/browser-echo/@browser-echo/mcp@5

@browser-echo/next

npm i https://pkg.pr.new/instructa/browser-echo/@browser-echo/next@5

@browser-echo/nuxt

npm i https://pkg.pr.new/instructa/browser-echo/@browser-echo/nuxt@5

@browser-echo/react

npm i https://pkg.pr.new/instructa/browser-echo/@browser-echo/react@5

@browser-echo/vite

npm i https://pkg.pr.new/instructa/browser-echo/@browser-echo/vite@5

@browser-echo/vue

npm i https://pkg.pr.new/instructa/browser-echo/@browser-echo/vue@5

commit: a16c609

…tion\n\n- Core: add networkLogs.bodies options (request/response, maxBytes, allowContentTypes, prettyJson)\n- Core: capture fetch/XHR bodies with content-type allowlist and byte caps\n- Vite: propagate bodies options into virtual client; render snippets\n- Next: expose bodies options in BrowserEchoScript and client code\n- Nuxt: extend module options to include bodies passthrough\n- Discovery: constrain Vite discovery to cwd; fix tests (no default 5179 probe)
…tion\n\n- Introduced a `split` option in `fileLog` to enable separate log files per tag.\n- Updated README with examples for using the new `split` feature in file logging.
…readability\n\n- Updated the `formatSnippet` function to ensure ellipsis is displayed correctly when truncating response bodies.\n- Adjusted the `resSnippet` function to streamline the response handling process.
…cy\n\n- Changed ellipsis from '…' to '...' in log truncation to ensure uniformity in log output.
…ucture\n\n- Replaced the extensive inline variable declarations with a structured payload object for better readability and maintainability.\n- Updated the client module code to initialize the browser echo with a single call, improving clarity and reducing complexity.
…ced a `resolveCoreEntry` function to dynamically resolve the core module path, enhancing flexibility in module loading.\n- Updated client module initialization to use the resolved core entry, improving compatibility with different module formats.
…cture\n\n- Modified the virtual module to call `initBrowserEcho` with a JSON payload, enhancing clarity in the configuration.\n- Updated test assertions to reflect the new payload structure, ensuring accurate validation of the browser echo initialization.
@regenrek regenrek merged commit 6887610 into main Sep 22, 2025
3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant