@newrelic/browser-agent 1.232.0 → 1.233.0

package/dist/cjs/features/session_replay/aggregate/index.js

@@ -0,0 +1,333 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.RRWEB_VERSION = exports.Aggregate = void 0;
+var _drain = require("../../../common/drain/drain");
+var _registerHandler = require("../../../common/event-emitter/register-handler");
+var _harvestScheduler = require("../../../common/harvest/harvest-scheduler");
+var _constants = require("../constants");
+var _stringify = require("../../../common/util/stringify");
+var _config = require("../../../common/config/config");
+var _sessionEntity = require("../../../common/session/session-entity");
+var _aggregateBase = require("../../utils/aggregate-base");
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } /*
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      * Copyright 2023 New Relic Corporation. All rights reserved.
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      * SPDX-License-Identifier: Apache-2.0
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      */ /**
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          * @file Records, aggregates, and harvests session replay data.
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          *
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          * NOTE: This code is under development and dormant. It will not download to instrumented pages or record any data.
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          * It is not production ready, and is not intended to be imported or implemented in any build of the browser agent until
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          * functionality is validated and a full user experience is curated.
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          */
+// would be better to get this dynamically in some way
+const RRWEB_VERSION = '2.0.0-alpha.8';
+exports.RRWEB_VERSION = RRWEB_VERSION;
+let recorder, gzipper, u8;
+
+/** The "mode" with which the session replay is recording */
+const MODE = {
+  OFF: 0,
+  FULL: 1,
+  ERROR: 2
+};
+/** Vortex caps payload sizes at 1MB */
+const MAX_PAYLOAD_SIZE = 1000000;
+/** Unloading caps around 64kb */
+const IDEAL_PAYLOAD_SIZE = 64000;
+/** Interval between forcing new full snapshots in "error" mode */
+const CHECKOUT_MS = 30000;
+class Aggregate extends _aggregateBase.AggregateBase {
+  static featureName = _constants.FEATURE_NAME;
+  constructor(agentIdentifier, aggregator) {
+    super(agentIdentifier, aggregator, _constants.FEATURE_NAME);
+
+    /** Each page mutation or event will be stored (raw) in this array. This array will be cleared on each harvest */
+    this.events = [];
+    /** The interval to harvest at.  This gets overridden if the size of the payload exceeds certain thresholds */
+    this.harvestTimeSeconds = (0, _config.getConfigurationValue)(this.agentIdentifier, 'session_replay.harvestTimeSeconds') || 60;
+    /** Set once the recorder has fully initialized after flag checks and sampling */
+    this.initialized = false;
+    /** Set once an error has been detected on the page. */
+    this.errorNoticed = false;
+    /** The "mode" to record in.  Defaults to "OFF" until flags and sampling are checked. See "MODE" constant. */
+    this.mode = MODE.OFF;
+    /** Set once the feature has been "aborted" to prevent other side-effects from continuing */
+    this.blocked = false;
+
+    /** Payload metadata -- Should indicate that the payload being sent is the first of a session */
+    this.isFirstChunk = false;
+    /** Payload metadata -- Should indicate that the payload being sent has a full DOM snapshot. This can happen
+     * -- When the recording library begins recording, it starts by taking a DOM snapshot
+     * -- When visibility changes from "hidden" -> "visible", it must capture a full snapshot for the replay to work correctly across tabs
+    */
+    this.hasSnapshot = false;
+    /** Payload metadata -- Should indicate that the payload being sent contains an error.  Used for query/filter purposes in UI */
+    this.hasError = false;
+
+    /** A value which increments with every new mutation node reported. Resets after a harvest is sent */
+    this.payloadBytesEstimation = 0;
+
+    /** The method to stop recording. This defaults to a noop, but is overwritten once the recording library is imported and initialized */
+    this.stopRecording = () => {/* no-op until set by rrweb initializer */};
+
+    // The SessionEntity class can emit a message indicating the session was cleared and reset (expiry, inactivity). This feature must abort and never resume if that occurs.
+    this.ee.on('session-reset', () => {
+      this.abort();
+    });
+
+    // The SessionEntity class can emit a message indicating the session was paused (visibility change). This feature must stop recording if that occurs.
+    this.ee.on(_sessionEntity.SESSION_EVENTS.PAUSE, () => {
+      this.stopRecording();
+    });
+    // The SessionEntity class can emit a message indicating the session was resumed (visibility change). This feature must start running again (if already running) if that occurs.
+    this.ee.on(_sessionEntity.SESSION_EVENTS.RESUME, () => {
+      if (!this.initialized || this.mode === MODE.OFF) return;
+      this.startRecording();
+      this.takeFullSnapshot();
+    });
+
+    // Bespoke logic for new endpoint.  This will change as downstream dependencies become solidified.
+    this.scheduler = new _harvestScheduler.HarvestScheduler('blob', {
+      onFinished: this.onHarvestFinished.bind(this),
+      retryDelay: this.harvestTimeSeconds,
+      getPayload: this.prepareHarvest.bind(this),
+      // TODO -- this stuff needs a better way to be handled
+      includeBaseParams: false,
+      customUrl: 'https://vortex-alb.stg-single-tooth.cell.us.nr-data.net/blob',
+      raw: true,
+      gzip: true
+    }, this);
+
+    // Wait for an error to be reported.  This currently is wrapped around the "Error" feature.  This is a feature-feature dependency.
+    // This was to ensure that all errors, including those on the page before load and those handled with "noticeError" are accounted for. Needs evalulation
+    (0, _registerHandler.registerHandler)('errorAgg', e => {
+      this.hasError = true;
+      // run once
+      if (this.mode === MODE.ERROR) {
+        this.mode = MODE.FULL;
+        // if the error was noticed AFTER the recorder was already imported....
+        if (recorder && this.initialized) {
+          this.stopRecording();
+          this.startRecording();
+          this.scheduler.startTimer(this.harvestTimeSeconds);
+          const {
+            session
+          } = (0, _config.getRuntime)(this.agentIdentifier);
+          session.state.sessionReplay = this.mode;
+        }
+      }
+    }, this.featureName, this.ee);
+
+    // new handler for waiting for multiple flags.  will be useful if/when backend designs multiple flags, or for evaluating multiple feature flags simultaneously (stn vs sr)
+    this.waitForFlags(['sr']).then(_ref => {
+      let [{
+        value
+      }] = _ref;
+      this.initializeRecording(value, Math.random() < (0, _config.getConfigurationValue)(this.agentIdentifier, 'session_replay.errorSampleRate'), Math.random() < (0, _config.getConfigurationValue)(this.agentIdentifier, 'session_replay.sampleRate'));
+    });
+    (0, _drain.drain)(this.agentIdentifier, this.featureName);
+  }
+
+  /**
+   * Evaluate entitlements and sampling before starting feature mechanics, importing and configuring recording library, and setting storage state
+   * @param {boolean} entitlements - the true/false state of the "sr" flag from RUM response
+   * @param {boolean} errorSample - the true/false state of the error sampling decision
+   * @param {boolean} fullSample - the true/false state of the full sampling decision
+   * @returns {void}
+   */
+  async initializeRecording(entitlements, errorSample, fullSample) {
+    this.initialized = true;
+    if (!entitlements) return;
+    const {
+      session
+    } = (0, _config.getRuntime)(this.agentIdentifier);
+    // if theres an existing session replay in progress, there's no need to sample, just check the entitlements response
+    // if not, these sample flags need to be checked
+    // if this isnt the FIRST load of a session AND
+    // we are not actively recording SR... DO NOT import or run the recording library
+    // session replay samples can only be decided on the first load of a session
+    // session replays can continue if already in progress
+    if (!session.isNew) {
+      // inherit the mode of the existing session
+      this.mode = session.state.sessionReplay;
+    } else {
+      // The session is new... determine the mode the new session should start in
+      if (fullSample) this.mode = MODE.FULL; // full mode has precedence over error mode
+      else if (errorSample) this.mode = MODE.ERROR;
+      // If neither are selected, then don't record (early return)
+      return;
+    }
+
+    // FULL mode records AND reports from the beginning, while ERROR mode only records (but does not report).
+    // ERROR mode will do this until an error is thrown, and then switch into FULL mode.
+    // If an error happened in ERROR mode before we've gotten to this stage, it will have already set the mode to FULL
+    if (this.mode === MODE.FULL) {
+      // We only report (harvest) in FULL mode
+      this.scheduler.startTimer(this.harvestTimeSeconds);
+    }
+    // We record in FULL or ERROR mode
+
+    recorder = (await Promise.resolve().then(() => _interopRequireWildcard(require( /* webpackChunkName: "recorder" */'rrweb')))).record;
+    this.startRecording();
+    const {
+      gzipSync,
+      strToU8
+    } = await Promise.resolve().then(() => _interopRequireWildcard(require( /* webpackChunkName: "compressor" */'fflate')));
+    gzipper = gzipSync;
+    u8 = strToU8;
+    this.isFirstChunk = !!session.isNew;
+    session.state.sessionReplay = this.mode;
+  }
+  prepareHarvest(options) {
+    if (this.events.length === 0) return;
+    const payload = this.getHarvestContents();
+    try {
+      payload.body = gzipper(u8((0, _stringify.stringify)(payload.body)));
+      this.scheduler.opts.gzip = true;
+    } catch (err) {
+      // failed to gzip
+      this.scheduler.opts.gzip = false;
+    }
+    // TODO -- Gracefully handle the buffer for retries.
+    this.clearBuffer();
+    return [payload];
+  }
+  getHarvestContents() {
+    const agentRuntime = (0, _config.getRuntime)(this.agentIdentifier);
+    const info = (0, _config.getInfo)(this.agentIdentifier);
+    return {
+      qs: {
+        protocol_version: '0'
+      },
+      body: {
+        type: 'SessionReplay',
+        appId: Number(info.applicationID),
+        timestamp: Date.now(),
+        blob: JSON.stringify(this.events),
+        // this needs to be a stringified JSON array of rrweb nodes
+        attributes: {
+          session: agentRuntime.session.state.value,
+          hasSnapshot: this.hasSnapshot,
+          hasError: this.hasError,
+          agentVersion: agentRuntime.version,
+          isFirstChunk: this.isFirstChunk,
+          'nr.rrweb.version': RRWEB_VERSION
+        }
+      }
+    };
+  }
+  onHarvestFinished(result) {
+    // The mutual decision for now is to stop recording and clear buffers if ingest is experiencing 429 rate limiting
+    if (result.status === 429) {
+      this.abort();
+    }
+    if (this.blocked) this.scheduler.stopTimer(true);
+  }
+
+  /** Clears the buffer (this.events), and resets all payload metadata properties */
+  clearBuffer() {
+    this.events = [];
+    this.isFirstChunk = false;
+    this.hasSnapshot = false;
+    this.hasError = false;
+    this.payloadBytesEstimation = 0;
+  }
+
+  /** Begin recording using configured recording lib */
+  startRecording() {
+    if (!recorder) {
+      warn('Recording library was never imported');
+      return this.abort();
+    }
+    const {
+      blockClass,
+      ignoreClass,
+      maskTextClass,
+      blockSelector,
+      maskInputOptions,
+      maskTextSelector,
+      maskAllInputs
+    } = (0, _config.getConfigurationValue)(this.agentIdentifier, 'session_replay');
+    this.hasSnapshot = true;
+    // set up rrweb configurations for maximum privacy --
+    // https://newrelic.atlassian.net/wiki/spaces/O11Y/pages/2792293280/2023+02+28+Browser+-+Session+Replay#Configuration-options
+    this.stopRecording = recorder({
+      emit: this.store.bind(this),
+      blockClass,
+      ignoreClass,
+      maskTextClass,
+      blockSelector,
+      maskInputOptions,
+      maskTextSelector,
+      maskAllInputs,
+      ...(this.mode === MODE.ERROR && {
+        checkoutEveryNms: CHECKOUT_MS
+      })
+    });
+  }
+
+  /** Store a payload in the buffer (this.events).  This should be the callback to the recording lib noticing a mutation */
+  store(event, isCheckout) {
+    if (this.blocked) return;
+    const eventBytes = (0, _stringify.stringify)(event).length;
+    /** The estimated size of the payload after compression */
+    const payloadSize = this.getPayloadSize(eventBytes);
+    // Vortex will block payloads at a certain size, we might as well not send.
+    if (payloadSize > MAX_PAYLOAD_SIZE) {
+      return this.abort();
+    }
+    // Checkout events are flags by the recording lib that indicate a fullsnapshot was taken every n ms. These are important
+    // to help reconstruct the replay later and must be included.  While waiting and buffering for errors to come through,
+    // each time we see a new checkout, we can drop the old data.
+    if (this.mode === MODE.ERROR && isCheckout) {
+      // we are still waiting for an error to throw, so keep wiping the buffer over time
+      this.clearBuffer();
+    }
+    this.events.push(event);
+    this.payloadBytesEstimation += eventBytes;
+
+    // We are making an effort to try to keep payloads manageable for unloading.  If they reach the unload limit before their interval,
+    // it will send immediately.  This often happens on the first snapshot, which can be significantly larger than the other payloads.
+    if (payloadSize > IDEAL_PAYLOAD_SIZE) {
+      // if we've made it to the ideal size of ~64kb before the interval timer, we should send early.
+      this.scheduler.runHarvest();
+    }
+  }
+
+  /** force the recording lib to take a full DOM snapshot.  This needs to occur in certain cases, like visibility changes */
+  takeFullSnapshot() {
+    if (!recorder) return;
+    recorder.takeFullSnapshot();
+    this.hasSnapshot = true;
+  }
+
+  /** Estimate the payload size */
+  getPayloadSize() {
+    let newBytes = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
+    // the 1KB gives us some padding for the other metadata
+    return this.estimateCompression(this.payloadBytesEstimation + newBytes) + 1000;
+  }
+
+  /** Abort the feature, once aborted it will not resume */
+  abort() {
+    this.blocked = true;
+    this.stopRecording();
+    const {
+      session
+    } = (0, _config.getRuntime)(this.agentIdentifier);
+    session.state.sessionReplay = this.mode;
+  }
+
+  /** Extensive research has yielded about an 88% compression factor on these payloads.
+   * This is an estimation using that factor as to not cause performance issues while evaluating
+   * https://staging.onenr.io/037jbJWxbjy
+   * */
+  estimateCompression(data) {
+    return data * 0.12;
+  }
+}
+exports.Aggregate = Aggregate;

package/dist/cjs/features/session_replay/constants.js

@@ -0,0 +1,9 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FEATURE_NAME = void 0;
+var _features = require("../../loaders/features/features");
+const FEATURE_NAME = _features.FEATURE_NAMES.sessionReplay;
+exports.FEATURE_NAME = FEATURE_NAME;

package/dist/cjs/features/session_replay/index.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "SessionReplay", {
+  enumerable: true,
+  get: function () {
+    return _index.Instrument;
+  }
+});
+var _index = require("./instrument/index");

package/dist/cjs/features/session_replay/instrument/index.js

@@ -0,0 +1,29 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Instrument = void 0;
+var _instrumentBase = require("../../utils/instrument-base");
+var _constants = require("../constants");
+/*
+ * Copyright 2023 New Relic Corporation. All rights reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
+/**
+ * @file Primes the Session Replay feature for lazy loading.
+ *
+ * NOTE: This code is under development and dormant. It will not download to instrumented pages or record any data.
+ * It is not production ready, and is not intended to be imported or implemented in any build of the browser agent until
+ * functionality is validated and a full user experience is curated.
+ */
+
+class Instrument extends _instrumentBase.InstrumentBase {
+  static featureName = _constants.FEATURE_NAME;
+  constructor(agentIdentifier, aggregator) {
+    let auto = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
+    super(agentIdentifier, aggregator, _constants.FEATURE_NAME, auto);
+    this.importAggregator();
+  }
+}
+exports.Instrument = Instrument;