Pular para o conteúdo principal
Zenovaydocs
5 min de leitura

Error Tracking

Pro Feature

Catch every JavaScript error, network failure, and unhandled exception before your users report them. Error tracking captures full stack traces with session context to help you debug faster.

Error Tracking is available on Pro, Scale, and Enterprise plans. Upgrade your plan to enable this feature.

Overview

Zenovay automatically captures client-side errors as they occur, including:

  • JavaScript Errors: Uncaught exceptions and syntax errors
  • Promise Rejections: Unhandled promise rejections
  • Network Errors: Failed API calls and resource loading failures
  • Console Errors: Errors logged via console.error()

Each error includes:

  • Full stack trace with source maps
  • Session context (what the user was doing)
  • Browser and device information
  • Link to session replay (if enabled)

Enabling Error Tracking

Error tracking is enabled by default when you add the Zenovay tracking script. To verify:

  1. Go to Settings → Your Website → Features
  2. Confirm Error Tracking is enabled
  3. Check the Errors tab in your dashboard

Error Dashboard

Error List

The Errors dashboard shows all captured errors grouped by:

  • Error message: Unique error fingerprint
  • Occurrence count: How many times this error occurred
  • Affected users: Number of unique visitors affected
  • Last seen: When the error most recently occurred

Error Details

Click any error to see:

  • Full stack trace: With source-mapped line numbers
  • User context: Browser, device, country, page URL
  • Session replay: Link to watch what happened (if enabled)
  • Breadcrumbs: Events leading up to the error
  • Trend chart: Error frequency over time

Error Grouping

Similar errors are automatically grouped by:

  1. Error message (normalized)
  2. Stack trace fingerprint
  3. Error type

This prevents thousands of identical errors from flooding your dashboard.

Custom Fingerprinting

Use custom error tags to group related errors:

try {
  // Your code
} catch (error) {
  window.zenovay('track', 'error', {
    error_message: error.message,
    error_stack: error.stack,
    tags: {
      feature: 'checkout',
      action: 'payment_submit'
    }
  });
}

Error Types

JavaScript Errors

Standard runtime errors:

// Captured automatically
TypeError: Cannot read property 'foo' of undefined
ReferenceError: bar is not defined
SyntaxError: Unexpected token

Network Errors

Failed fetch/XHR requests:

// Failed API call - automatically captured
fetch('/api/data')
  .then(r => r.json())
  .catch(error => {
    // Error captured with request details
  });

Network error details include:

  • Request URL
  • HTTP method
  • Response status (if available)
  • Request duration

Promise Rejections

Unhandled promise rejections:

// Captured automatically
Promise.reject(new Error('Something went wrong'));

// Async function errors
async function fetchData() {
  throw new Error('Failed to fetch');
}

Source Maps

Upload source maps for readable stack traces:

Automatic Upload (Recommended)

If using Webpack, Vite, or Rollup, source maps can be uploaded automatically during build:

# Upload source maps using the API
curl -X POST "https://api.zenovay.com/api/external/v1/sourcemaps" \
  -H "X-API-Key: YOUR_API_KEY" \
  -F "release=v1.2.3" \
  -F "sourcemap=@./dist/main.js.map"

Manual Upload

Upload via dashboard:

  1. Go to Settings → Source Maps
  2. Click Upload Source Map
  3. Select your .js.map files
  4. Associate with release version

Session Integration

When Session Replay is enabled:

  1. Each error links directly to the session replay
  2. Replay opens at the exact moment the error occurred
  3. Watch what the user did before the error
  4. Understand the full context, not just the stack trace

Filtering & Alerts

Error Filtering

Filter errors by:

  • Date range
  • Browser
  • Device type
  • Country
  • Release version
  • Error type

Error Alerts

Set up alerts for new or spiking errors:

  1. Go to Settings → Alerts
  2. Create new alert rule
  3. Configure threshold (e.g., "more than 10 occurrences in 5 minutes")
  4. Choose notification channel (email, Slack, webhook)

Ignoring Errors

Some errors aren't actionable. Configure ignore rules:

By Error Message

{
  "error_ignore_patterns": [
    "ResizeObserver loop limit exceeded",
    "Script error."
  ]
}

By URL Pattern

{
  "error_ignore_urls": [
    "chrome-extension://",
    "moz-extension://"
  ]
}

Manual Error Tracking

Track caught errors or custom error conditions:

// Track caught error
try {
  riskyOperation();
} catch (error) {
  window.zenovay('track', 'error', {
    error_message: error.message,
    error_stack: error.stack,
    context: {
      operation: 'riskyOperation',
      userId: currentUser.id
    }
  });
}

// Track custom error condition
if (unexpectedState) {
  window.zenovay('track', 'error', {
    error_message: 'Unexpected application state',
    severity: 'warning',
    context: { state: JSON.stringify(appState) }
  });
}

API Access

Access error data via API:

# List errors
GET /api/websites/:websiteId/errors
Authorization: Bearer YOUR_API_KEY

# Get error details
GET /api/websites/:websiteId/errors/:errorId
Authorization: Bearer YOUR_API_KEY

Privacy

Error tracking respects user privacy:

  • Stack traces don't contain user data
  • PII is automatically scrubbed from error context
  • Respects DNT and consent settings
  • Error data follows your retention policy

Best Practices

  1. Upload source maps: Essential for debugging minified code
  2. Set up alerts: Know about critical errors immediately
  3. Review weekly: Regular error review prevents technical debt
  4. Tag releases: Associate errors with specific versions
  5. Watch session replays: Context is everything for debugging

Next Steps

Esta página foi útil?