rollbar 2.26.3 → 3.0.0-alpha.1

package/src/browser/plugins/jquery.js

@@ -1,9 +1,7 @@
 /* globals jQuery */
 /* globals __JQUERY_PLUGIN_VERSION__ */
 
-
-(function(jQuery, window, document) {
-
+(function (jQuery, window, document) {
   var rb = window.Rollbar;
   if (!rb) {
     return;
@@ -16,14 +14,14 @@
       notifier: {
         plugins: {
           jquery: {
-            version: JQUERY_PLUGIN_VERSION
-          }
-        }
-      }
-    }
+            version: JQUERY_PLUGIN_VERSION,
+          },
+        },
+      },
+    },
   });
 
-  var logError = function(e) {
+  var logError = function (e) {
     rb.error(e);
     if (window.console) {
       var msg = '[reported to Rollbar]';
@@ -35,35 +33,37 @@
   };
 
   // Report any ajax errors to Rollbar
-  jQuery(document).ajaxError(function(event, jqXHR, ajaxSettings, thrownError) {
-    var status = jqXHR.status;
-    var url = ajaxSettings.url;
-    var type = ajaxSettings.type;
+  jQuery(document).ajaxError(
+    function (event, jqXHR, ajaxSettings, thrownError) {
+      var status = jqXHR.status;
+      var url = ajaxSettings.url;
+      var type = ajaxSettings.type;
 
-    // If status === 0 it means the user left the page before the ajax event finished
-    // or other uninteresting events.
-    if (!status) {
-      return;
-    }
+      // If status === 0 it means the user left the page before the ajax event finished
+      // or other uninteresting events.
+      if (!status) {
+        return;
+      }
 
-    var extra = {
-      status: status,
-      url: url,
-      type: type,
-      isAjax: true,
-      data: ajaxSettings.data,
-      jqXHR_responseText: jqXHR.responseText,
-      jqXHR_statusText: jqXHR.statusText
-    };
-    var msg = thrownError ? thrownError : 'jQuery ajax error for ' + type;
-    rb.warning(msg, extra);
-  });
+      var extra = {
+        status: status,
+        url: url,
+        type: type,
+        isAjax: true,
+        data: ajaxSettings.data,
+        jqXHR_responseText: jqXHR.responseText,
+        jqXHR_statusText: jqXHR.statusText,
+      };
+      var msg = thrownError ? thrownError : 'jQuery ajax error for ' + type;
+      rb.warning(msg, extra);
+    },
+  );
 
   // Wraps functions passed into jQuery's ready() with try/catch to
   // report errors to Rollbar
   var origReady = jQuery.fn.ready;
-  jQuery.fn.ready = function(fn) {
-    return origReady.call(this, function($) {
+  jQuery.fn.ready = function (fn) {
+    return origReady.call(this, function ($) {
       try {
         fn($);
       } catch (e) {
@@ -75,10 +75,10 @@
   // Modified from the code removed from Tracekit in this commit
   // https://github.com/occ/TraceKit/commit/0d39401
   var _oldEventAdd = jQuery.event.add;
-  jQuery.event.add = function(elem, types, handler, data, selector) {
+  jQuery.event.add = function (elem, types, handler, data, selector) {
     var _handler;
-    var wrap = function(fn) {
-      return function() {
+    var wrap = function (fn) {
+      return function () {
         try {
           return fn.apply(this, arguments);
         } catch (e) {

package/src/browser/predicates.js

@@ -8,5 +8,5 @@ function checkIgnore(item, settings) {
 }
 
 module.exports = {
-  checkIgnore: checkIgnore
+  checkIgnore: checkIgnore,
 };

package/src/browser/replay/defaults.js

@@ -0,0 +1,71 @@
+/**
+ * Default options for the rrweb recorder
+ * See https://github.com/rrweb-io/rrweb/blob/master/guide.md#options for details
+ */
+export default {
+  enabled: false, // Whether recording is enabled
+  autoStart: true, // Start recording automatically when Rollbar initializes
+  maxSeconds: 300, // Maximum recording duration in seconds
+
+  // trigger options
+  triggerOptions: {
+    // Trigger replay on specific items (occurrences)
+    item: {
+      levels: ['error', 'critical'], // Trigger on item level
+    }
+  },
+
+  debug: {
+    logErrors: true, // Whether to log errors emitted by rrweb.
+    logEmits: false, // Whether to log emitted events
+  },
+
+  // Recording options
+  inlineStylesheet: true, // Whether to inline stylesheets to improve replay accuracy
+  inlineImages: false, // Whether to record the image content
+  collectFonts: true, // Whether to collect fonts in the website
+
+  // Privacy options
+  // Fine-grained control over which input types to mask
+  // By default only password inputs are masked if maskInputs is true
+  maskInputOptions: {
+    password: true,
+    email: false,
+    tel: false,
+    text: false,
+    color: false,
+    date: false,
+    'datetime-local': false,
+    month: false,
+    number: false,
+    range: false,
+    search: false,
+    time: false,
+    url: false,
+    week: false,
+  },
+
+  // Remove unnecessary parts of the DOM
+  // By default all removable elements are removed
+  slimDOMOptions: {
+    script: true, // Remove script elements
+    comment: true, // Remove comments
+    headFavicon: true, // Remove favicons in the head
+    headWhitespace: true, // Remove whitespace in head
+    headMetaDescKeywords: true, // Remove meta description and keywords
+    headMetaSocial: true, // Remove social media meta tags
+    headMetaRobots: true, // Remove robots meta directives
+    headMetaHttpEquiv: true, // Remove http-equiv meta directives
+    headMetaAuthorship: true, // Remove authorship meta directives
+    headMetaVerification: true, // Remove verification meta directives
+  },
+
+  // Custom callbacks for advanced use cases
+  // These are undefined by default and can be set programmatically
+  // maskInputFn: undefined,      // Custom function to mask input values
+  // maskTextFn: undefined,       // Custom function to mask text content
+  // errorHandler: undefined,     // Custom error handler for recording errors
+
+  // Plugin system
+  // plugins: []                  // List of plugins to use (must be set programmatically)
+};

package/src/browser/replay/recorder.js

@@ -0,0 +1,193 @@
+import { record as rrwebRecordFn } from '@rrweb/record';
+import { EventType } from '@rrweb/types';
+
+import hrtime from '../../tracing/hrtime.js';
+import logger from '../logger.js';
+
+export default class Recorder {
+  #options;
+  #rrwebOptions;
+  #stopFn = null;
+  #recordFn;
+  #events = {
+    previous: [],
+    current: [],
+  };
+
+  /**
+   * Creates a new Recorder instance for capturing DOM events
+   *
+   * @param {Object} options - Configuration options for the recorder
+   * @param {Function} [recordFn=rrwebRecordFn] - The recording function to use
+   */
+  constructor(options, recordFn = rrwebRecordFn) {
+    if (!recordFn) {
+      throw new TypeError("Expected 'recordFn' to be provided");
+    }
+
+    this.options = options;
+    this.#recordFn = recordFn;
+  }
+
+  get isRecording() {
+    return this.#stopFn !== null;
+  }
+
+  get options() {
+    return this.#options;
+  }
+
+  set options(newOptions) {
+    this.configure(newOptions);
+  }
+
+  configure(newOptions) {
+    const {
+      // Rollbar options
+      enabled,
+      autoStart,
+      maxSeconds,
+      triggerOptions,
+
+      // disallowed rrweb options
+      emit,
+      checkoutEveryNms,
+
+      // rrweb options
+      ...rrwebOptions
+    } = newOptions;
+    this.#options = { enabled, autoStart, maxSeconds, triggerOptions };
+    this.#rrwebOptions = rrwebOptions;
+
+    if (this.isRecording && newOptions.enabled === false) {
+      this.stop();
+    }
+  }
+
+  checkoutEveryNms() {
+    // Recording may be up to two checkout intervals, therefore the checkout
+    // interval is set to half of the maxSeconds.
+    return (this.options.maxSeconds || 10) * 1000 / 2;
+  }
+
+  /**
+   * Converts recorded events into a formatted payload ready for transport.
+   *
+   * This method takes the recorder's stored events, creates a new span with the
+   * provided tracing context, attaches all events with their timestamps as span
+   * events, and then returns a payload ready for transport to the server.
+   *
+   * @param {Object} tracing - The tracing system instance to create spans
+   * @param {string} replayId - Unique identifier to associate with this replay recording
+   * @returns {Object|null} A formatted payload containing spans data in OTLP format, or null if no events exist
+   */
+  dump(tracing, replayId, occurrenceUuid) {
+    const events = this.#events.previous.concat(this.#events.current);
+
+    if (events.length < 2) {
+      logger.error('Replay recording cannot have less than 2 events');
+      return null;
+    }
+
+    const recordingSpan = tracing.startSpan('rrweb-replay-recording', {});
+
+    recordingSpan.setAttribute('rollbar.replay.id', replayId);
+
+    if (occurrenceUuid) {
+      recordingSpan.setAttribute('rollbar.occurrence.uuid', occurrenceUuid);
+    }
+
+    const earliestEvent = events.reduce((earliestEvent, event) =>
+      event.timestamp < earliestEvent.timestamp ? event : earliestEvent,
+    );
+
+    recordingSpan.span.startTime = hrtime.fromMillis(earliestEvent.timestamp);
+
+    for (const event of events) {
+      recordingSpan.addEvent(
+        'rrweb-replay-events',
+        {
+          eventType: event.type,
+          json: JSON.stringify(event.data),
+          'rollbar.replay.id': replayId,
+        },
+        hrtime.fromMillis(event.timestamp),
+      );
+    }
+
+    recordingSpan.end();
+
+    return tracing.exporter.toPayload();
+  }
+
+  start() {
+    if (this.isRecording || this.options.enabled === false) {
+      return;
+    }
+
+    this.clear();
+
+    this.#stopFn = this.#recordFn({
+      emit: (event, isCheckout) => {
+        if (this.options.debug?.logEmits) {
+          this._logEvent(event, isCheckout);
+        }
+
+        if (isCheckout && event.type === EventType.Meta) {
+          this.#events.previous = this.#events.current;
+          this.#events.current = [];
+        }
+
+        this.#events.current.push(event);
+      },
+      checkoutEveryNms: this.checkoutEveryNms(),
+      errorHandler: (error) => {
+        if (this.options.debug?.logErrors) {
+          logger.error('Error during replay recording', error);
+        }
+        return true; // swallow the error instead of throwing it to the window
+      },
+      ...this.#rrwebOptions,
+    });
+
+    return this;
+  }
+
+  stop() {
+    if (!this.isRecording) {
+      return;
+    }
+
+    this.#stopFn();
+    this.#stopFn = null;
+
+    return this;
+  }
+
+  clear() {
+    this.#events = {
+      previous: [],
+      current: [],
+    };
+  }
+
+  _logEvent(event, isCheckout) {
+    logger.log(
+      `Recorder: ${isCheckout ? 'checkout' : ''} event\n`,
+      ((e) => {
+        const seen = new WeakSet();
+        return JSON.stringify(
+          e,
+          (_, v) => {
+            if (typeof v === 'object' && v !== null) {
+              if (seen.has(v)) return '[Circular]';
+              seen.add(v);
+            }
+            return v;
+          },
+          2,
+        );
+      })(event),
+    );
+  }
+}

package/src/browser/replay/replayMap.js

@@ -0,0 +1,195 @@
+import id from '../../tracing/id.js';
+import logger from '../logger.js';
+
+/**
+ * ReplayMap - Manages the mapping between error occurrences and their associated
+ * session recordings. This class handles the coordination between when recordings
+ * are dumped and when they are eventually sent to the backend.
+ */
+export default class ReplayMap {
+  #map;
+  #recorder;
+  #api;
+  #tracing;
+
+  /**
+   * Creates a new ReplayMap instance
+   *
+   * @param {Object} props - Configuration props
+   * @param {Object} props.recorder - The recorder instance that dumps replay data into spans
+   * @param {Object} props.api - The API instance used to send replay payloads to the backend
+   * @param {Object} props.tracing - The tracing instance used to create spans and manage context
+   */
+  constructor({ recorder, api, tracing }) {
+    if (!recorder) {
+      throw new TypeError("Expected 'recorder' to be provided");
+    }
+
+    if (!api) {
+      throw new TypeError("Expected 'api' to be provided");
+    }
+
+    if (!tracing) {
+      throw new TypeError("Expected 'tracing' to be provided");
+    }
+
+    this.#map = new Map();
+    this.#recorder = recorder;
+    this.#api = api;
+    this.#tracing = tracing;
+  }
+
+  /**
+   * Processes a replay by converting recorder events into a transport-ready payload.
+   *
+   * Calls recorder.dump() to capture events as spans, formats them into a proper payload,
+   * and stores the result in the map using replayId as the key.
+   *
+   * @param {string} replayId - The unique ID for this replay
+   * @returns {Promise<string>} A promise resolving to the processed replayId
+   * @private
+   */
+  async _processReplay(replayId, occurrenceUuid) {
+    try {
+      const payload = this.#recorder.dump(
+        this.#tracing,
+        replayId,
+        occurrenceUuid,
+      );
+
+      this.#map.set(replayId, payload);
+    } catch (transformError) {
+      logger.error('Error transforming spans:', transformError);
+
+      this.#map.set(replayId, null); // TODO(matux): Error span?
+    }
+
+    return replayId;
+  }
+
+  /**
+   * Adds a replay to the map and returns a uniquely generated replay ID.
+   *
+   * This method immediately returns the replayId and asynchronously processes
+   * the replay data in the background. The processing involves converting
+   * recorder events into a payload format and storing it in the map.
+   *
+   * @returns {string} A unique identifier for this replay
+   */
+  add(replayId, occurrenceUuid) {
+    replayId = replayId || id.gen(8);
+
+    this._processReplay(replayId, occurrenceUuid).catch((error) => {
+      logger.error('Failed to process replay:', error);
+    });
+
+    return replayId;
+  }
+
+  /**
+   * Sends the replay payload associated with the given replayId to the backend
+   * and removes it from the map.
+   *
+   * Retrieves the payload from the map, checks if it's valid, then sends it
+   * to the API endpoint for processing. The payload can be either a spans array
+   * or a formatted OTLP payload object.
+   *
+   * @param {string} replayId - The ID of the replay to send
+   * @returns {Promise<boolean>} A promise that resolves to true if the payload was found and sent, false otherwise
+   */
+  async send(replayId) {
+    if (!replayId) {
+      logger.error('ReplayMap.send: No replayId provided');
+      return false;
+    }
+
+    if (!this.#map.has(replayId)) {
+      logger.error(`ReplayMap.send: No replay found for replayId: ${replayId}`);
+      return false;
+    }
+
+    const payload = this.#map.get(replayId);
+    this.#map.delete(replayId);
+
+    // Check if payload is empty (could be raw spans array or OTLP payload)
+    const isEmpty =
+      !payload ||
+      (Array.isArray(payload) && payload.length === 0) ||
+      (payload.resourceSpans && payload.resourceSpans.length === 0);
+
+    if (isEmpty) {
+      logger.error(
+        `ReplayMap.send: No payload found for replayId: ${replayId}`,
+      );
+      return false;
+    }
+
+    try {
+      await this.#api.postSpans(payload);
+      return true;
+    } catch (error) {
+      logger.error('Error sending replay:', error);
+      return false;
+    }
+  }
+
+  /**
+   * Discards the replay associated with the given replay ID by removing
+   * it from the map without sending it.
+   *
+   * @param {string} replayId - The ID of the replay to discard
+   * @returns {boolean} True if a replay was found and discarded, false otherwise
+   */
+  discard(replayId) {
+    if (!replayId) {
+      logger.error('ReplayMap.discard: No replayId provided');
+      return false;
+    }
+
+    if (!this.#map.has(replayId)) {
+      logger.error(
+        `ReplayMap.discard: No replay found for replayId: ${replayId}`,
+      );
+      return false;
+    }
+
+    this.#map.delete(replayId);
+    return true;
+  }
+
+  /**
+   * Gets spans for the given replay ID
+   *
+   * @param {string} replayId - The ID to retrieve spans for
+   * @returns {Array|null} The spans array or null if not found
+   */
+  getSpans(replayId) {
+    return this.#map.get(replayId) ?? null;
+  }
+
+  /**
+   * Sets spans for a given replay ID
+   *
+   * @param {string} replayId - The ID to set spans for
+   * @param {Array} spans - The spans to set
+   */
+  setSpans(replayId, spans) {
+    this.#map.set(replayId, spans);
+  }
+
+  /**
+   * Returns the size of the map (number of stored replays)
+   *
+   * @returns {number} The number of replays currently stored
+   */
+  get size() {
+    return this.#map.size;
+  }
+
+  /**
+   * Clears all stored replays without sending them
+   */
+  clear() {
+    this.#map.clear();
+  }
+}

package/src/browser/rollbar.js

@@ -1,10 +1,12 @@
-var Rollbar = require('./core');
-var telemeter = require('../telemetry');
-var instrumenter = require('./telemetry');
-var polyfillJSON = require('../utility/polyfillJSON');
-var wrapGlobals = require('./wrapGlobals');
-var scrub = require('../scrub');
-var truncation = require('../truncation');
+const Rollbar = require('./core');
+const telemeter = require('../telemetry');
+const instrumenter = require('./telemetry');
+const polyfillJSON = require('../utility/polyfillJSON');
+const wrapGlobals = require('./wrapGlobals');
+const scrub = require('../scrub');
+const truncation = require('../truncation');
+const Tracing = require('../tracing/tracing');
+const Recorder = require('./replay/recorder');
 
 Rollbar.setComponents({
   telemeter: telemeter,
@@ -12,7 +14,9 @@ Rollbar.setComponents({
   polyfillJSON: polyfillJSON,
   wrapGlobals: wrapGlobals,
   scrub: scrub,
-  truncation: truncation
+  truncation: truncation,
+  tracing: Tracing.default,
+  recorder: Recorder.default,
 });
 
 module.exports = Rollbar;

package/src/browser/rollbarWrapper.js

@@ -5,8 +5,8 @@ function RollbarWrap(impl, options) {
 }
 
 function _setupForwarding(prototype) {
-  var _forward = function(method) {
-    return function() {
+  var _forward = function (method) {
+    return function () {
       var args = Array.prototype.slice.call(arguments, 0);
       if (this.impl[method]) {
         return this.impl[method].apply(this.impl, args);
@@ -14,13 +14,16 @@ function _setupForwarding(prototype) {
     };
   };
 
-  var _methods = 'log,debug,info,warn,warning,error,critical,global,configure,handleUncaughtException,handleAnonymousErrors,handleUnhandledRejection,_createItem,wrap,loadFull,shimId,captureEvent,captureDomContentLoaded,captureLoad'.split(',');
-  for (var i=0; i<_methods.length; i++) {
+  var _methods =
+    'log,debug,info,warn,warning,error,critical,global,configure,handleUncaughtException,handleAnonymousErrors,handleUnhandledRejection,_createItem,wrap,loadFull,shimId,captureEvent,captureDomContentLoaded,captureLoad'.split(
+      ',',
+    );
+  for (var i = 0; i < _methods.length; i++) {
     prototype[_methods[i]] = _forward(_methods[i]);
   }
 }
 
-RollbarWrap.prototype._swapAndProcessMessages = function(impl, messages) {
+RollbarWrap.prototype._swapAndProcessMessages = function (impl, messages) {
   this.impl = impl(this.options);
   var msg, method, args;
   while ((msg = messages.shift())) {