Skip to content

Error Tracking

Error tracking is an integral part of the session recording system, providing context-rich error information within the user's session data.

How Error Tracking Works with Sessions

Errors are captured and associated with the current active session. This means that every error includes the full context of the user's interaction leading up to the error, making it easier to reproduce and fix issues.

Basic Error Tracking

typescript
import { SessionTracker } from '@your-sdk/core';

const session = new SessionTracker();

// Basic error handling
try {
  // Your application code
} catch (error) {
  session.addErrorTag({
    message: error.message,
    stack: error.stack,
    // Additional context
    component: 'CheckoutForm',
    action: 'processPayment'
  });
}

Error Object Structure

When you report an error using addErrorTag(), it should include:

typescript
interface TrackedError {
  message: string;     // Error message
  stack?: string;      // Stack trace (if available)
  hash?: string;       // Unique error hash for deduplication
  [key: string]: any;  // Additional context
}

Best Practices for Error Tracking

  1. Provide Context

    • Include relevant application state
    • Add user information (without sensitive data)
    • Include any relevant request IDs or transaction references
  2. Error Severity

    • Use the level field to indicate severity: 'error' | 'warning' | 'info'
    • Example: session.addErrorTag({ ...error, level: 'warning' });
  3. Error Grouping

    • Similar errors are automatically grouped using the error message and stack trace
    • Add a custom hash property to manually group related errors

Viewing Errors

Errors can be viewed in the session replay alongside the user's actions, allowing you to see:

  • What the user was doing when the error occurred
  • The sequence of actions leading to the error
  • The state of the application at the time of the error

Common Error Scenarios

Unhandled Exceptions

typescript
// Global error handler
window.onerror = function(message, source, lineno, colno, error) {
  session.addErrorTag({
    message: message.toString(),
    source,
    line: lineno,
    column: colno,
    stack: error?.stack
  });
  return false; // Prevent default browser error handling
};

Promise Rejections

typescript
window.addEventListener('unhandledrejection', (event) => {
  const error = event.reason;
  session.addErrorTag({
    message: error?.message || 'Unhandled Promise Rejection',
    stack: error?.stack,
    reason: error?.toString()
  });
});

Troubleshooting

If errors are not appearing in your session data:

  1. Verify that the session is active when the error occurs
  2. Check browser console for any SDK-related errors
  3. Ensure error tracking is properly initialized

For more information on working with sessions, see the Sessions documentation.


Note: Error data is collected in compliance with our privacy policy. Sensitive information should never be included in error messages or stack traces.