WP Manifestindependent plugin directory
manifest / analytics / metric-points-wordpress-error-tracking

MetricPoints Browser Beacon

The WordPress plugin for Metric Points JavaScript Error Tracking

by Michael Loeffler · github.com/mloeff/metric-points-wordpress-error-tracking · website

★ 0stars
0forks

Install

No release zip yet. The repository archive installs, but the folder name will carry the branch suffix and updates will not flow:

wp plugin install https://github.com/mloeff/metric-points-wordpress-error-tracking/archive/refs/heads/main.zip
Readme github.com/mloeff/metric-points-wordpress-error-tracking ↗

MetricPoints Browser Beacon WordPress Plugin

A unified WordPress plugin for installing the MetricPoints browser beacon and optionally connecting Content Security Policy monitoring.

Features

  • Browser Beacon Installer - Adds the MetricPoints script globally without editing a theme.
  • JavaScript Error Tracking - Captures unhandled errors and promise rejections.
  • Performance Monitoring - Tracks Core Web Vitals and memory usage.
  • User Session Tracking - Monitors user behavior and sessions when enabled.
  • Optional CSP Monitoring - Shows the CSP reporting endpoint and can write report-only headers.
  • Optional CSP Management - Advanced mode for writing enforcing CSP headers from WordPress.
  • WordPress Integration - Native WordPress admin interface.

Installation

  1. Upload the plugin to your WordPress plugins directory
  2. Activate the plugin in WordPress admin
  3. Go to Settings → MetricPoints Browser Beacon
  4. Enter your MetricPoints API Key
  5. Configure tracking options
  6. Save changes

Configuration

Required Settings

  • API Key - Your MetricPoints API key

Optional Settings

  • Enable Browser Beacon - Turn browser telemetry on/off
  • Performance Tracking - Track Core Web Vitals and memory usage
  • User Tracking - Track user sessions and behavior
  • CSP Monitoring - Keep CSP owned externally, write report-only headers, or write enforcing CSP headers.
  • CSP Reporting Key - Optional transition key when CSP and browser telemetry still use separate project keys.

Usage

Automatic Browser Telemetry

Once configured, the plugin automatically tracks:

  • Unhandled JavaScript errors
  • Promise rejections
  • Performance metrics
  • User session data

CSP Modes

  • External owner: The plugin does not write CSP headers. Use the displayed report URI in your host, CDN, security plugin, or server config.
  • Monitor only: The plugin writes Content-Security-Policy-Report-Only so violations are reported without blocking resources.
  • Manage and enforce: The plugin writes Content-Security-Policy. Use this only after validating the policy in report-only mode.

Manual Testing

Use the admin panel to:

  • Generate test errors
  • Verify configuration
  • Check tracking status

API Integration

The browser beacon sends data to MetricPoints via:

  • Endpoint: https://metricpoints.com/api/error-reports
  • Method: POST
  • Authentication: Bearer token (API key)
  • Format: JSON

CSP reports use:

  • Endpoint: https://metricpoints.com/api/csp-reports/{apiKey}
  • Delivery: Browser CSP report-uri directive

Data Collected

Error Data

  • Error type and message
  • Stack trace
  • URL and line number
  • User agent
  • Timestamp

Performance Data

  • First Contentful Paint (FCP)
  • Largest Contentful Paint (LCP)
  • Cumulative Layout Shift (CLS)
  • Interaction to Next Paint (INP)
  • Time to First Byte (TTFB)
  • DOM Content Loaded
  • Memory usage
  • Connection information

User Data

  • Screen resolution
  • Viewport size
  • Language and timezone
  • Referrer information

Troubleshooting

Common Issues

Plugin not tracking browser telemetry:

  • Check API key is correct
  • Verify project ID is valid
  • Ensure browser beacon tracking is enabled
  • Check browser console for errors

Performance data not collected:

  • Enable performance tracking in settings
  • Check browser compatibility
  • Verify Core Web Vitals support

API calls failing:

  • Check network connectivity
  • Verify API key permissions
  • Check WordPress error logs

Debug Mode

Enable WordPress debug mode to see detailed error logs:

define('WP_DEBUG', true);
define('WP_DEBUG_LOG', true);

Support

For support and documentation:

Credits

Developed by Michael Loeffler at Main Street Web Developer for MetricPoints.com

Changelog

Version 1.0.0

  • Unified Browser Beacon plugin identity
  • Browser beacon telemetry
  • Performance monitoring
  • User session tracking
  • Optional CSP monitoring and WordPress-managed CSP header modes
  • Admin configuration panel