Skip to content

LogTrunk Companion

Stream browser console logs, network requests, and errors directly to LogTrunk.

Updated: 2025-01-13

Step 1: Installation

LogTrunk Companion is available for Chrome and Firefox:

Step 2: Quick Start

Get browser logs flowing to LogTrunk in three steps:

  1. Create an HTTP source in LogTrunk - Click HTTP in the source toolbar and set the port to 9000
  2. Install the extension - Download from Chrome Web Store or Firefox Add-ons
  3. Check the badge - A green checkmark means you're connected

The extension auto-detects LogTrunk on common ports (9000, 9001, 9002, 8080, 3000). Once connected, open any website and your console logs, network requests, and errors will stream to LogTrunk.

Privacy First

All data stays on your machine. The extension only communicates with localhost - no external connections are ever made.

Step 3: Connection Settings

Click the extension icon to open the popup and configure connection settings:

  • Host - Where LogTrunk is running (default: localhost)
  • Port - The HTTP source port in LogTrunk (default: 9000)
  • Auto-detect - Automatically finds LogTrunk on common ports when installed

If auto-detection fails, manually enter the host and port to match your LogTrunk HTTP source configuration.

Tip: Match Your Ports

The extension port must match the HTTP source port in LogTrunk. If you configured LogTrunk to listen on port 8080, update the extension to use 8080 too.

Step 4: Console Filters

Control which console methods are captured with individual toggles:

  • console.log() - General output
  • console.info() - Informational messages
  • console.warn() - Warnings
  • console.error() - Errors
  • console.debug() - Debug information
  • console.trace() - Stack traces

All levels are enabled by default. Disable noisy levels (like debug or trace) to reduce log volume.

Step 5: Capture Types

Beyond console logs, the extension can capture:

Network Requests

Intercepts fetch() and XMLHttpRequest calls. Each request includes:

  • HTTP method (GET, POST, etc.)
  • Request URL
  • Response status code
  • Duration in milliseconds

Exceptions

Captures JavaScript errors including:

  • Uncaught exceptions
  • Unhandled promise rejections
  • Resource loading errors (failed scripts, images, stylesheets)
  • Full stack traces when available

Performance Metrics

Records navigation timing data via the Performance Observer API. Disabled by default to reduce CPU usage on high-traffic pages.

Step 6: Domain Filtering

Control which websites send logs using three modes:

Disabled

Captures logs from all websites. Use when you need to debug across multiple domains.

Whitelist (Default)

Only sites matching the listed patterns send logs. Default patterns:

  • ^localhost(:\d+)?$ - localhost on any port
  • ^127\.0\.0\.1(:\d+)?$ - 127.0.0.1 on any port

Use the "Add current site" button to quickly whitelist the page you're viewing.

Blacklist

All sites send logs except those matching the listed patterns. Useful for excluding noisy sites.

Pattern Syntax

Patterns support both exact matches and regular expressions:

  • example.com - Exact domain match (case-insensitive)
  • ^example\.(com|org)$ - Regex for multiple TLDs
  • .*\.example\.com$ - Regex for all subdomains
  • example.com:3000 - Domain with specific port

Step 7: Status Indicators

The extension icon badge shows connection status:

  • Green checkmark - Connected and sending logs
  • Red exclamation - Connection error
  • Gray - Disconnected

Click the extension icon to see detailed status including the target address and any error messages.

Step 8: Troubleshooting

Extension not connecting

  • Verify LogTrunk is running with an HTTP source enabled
  • Check that the port in the extension matches the HTTP source port in LogTrunk
  • Click "Auto-detect" in the popup to scan for LogTrunk
  • Ensure no firewall is blocking localhost connections

Logs not appearing

  • Check the extension badge - it should show a green checkmark
  • Verify the current site matches your domain filter (whitelist/blacklist)
  • Ensure the log type you expect is enabled (console, network, exceptions)
  • Check browser DevTools console for any bridge errors

Domain not whitelisted

  • Open the extension popup
  • Click "Add current site" to whitelist the page you're viewing
  • Or switch domain filtering to "Disabled" to capture from all sites

Page functionality issues?

The extension wraps browser APIs carefully, but if you encounter issues on a specific site, disable the extension and report the bug with the page URL.