@newrelic/browser-agent 1.232.0 → 1.233.0

package/dist/esm/features/metrics/aggregate/index.js

@@ -3,16 +3,17 @@ import { registerHandler } from '../../../common/event-emitter/register-handler'
 import { HarvestScheduler } from '../../../common/harvest/harvest-scheduler';
 import { FEATURE_NAME, SUPPORTABILITY_METRIC, CUSTOM_METRIC, SUPPORTABILITY_METRIC_CHANNEL, CUSTOM_METRIC_CHANNEL } from '../constants';
 import { drain } from '../../../common/drain/drain';
-import { getFrameworks } from '../../../common/metrics/framework-detection';
+import { getFrameworks } from './framework-detection';
+import { getPolyfills } from './polyfill-detection';
 import { isFileProtocol } from '../../../common/url/protocol';
 import { getRules, validateRules } from '../../../common/util/obfuscate';
 import { VERSION } from "../../../common/constants/env.npm";
 import { onDOMContentLoaded } from '../../../common/window/load';
 import { windowAddEventListener } from '../../../common/event-listener/event-listener-opts';
 import { isBrowserScope } from '../../../common/util/global-scope';
-import { FeatureBase } from '../../utils/feature-base';
+import { AggregateBase } from '../../utils/aggregate-base';
 import { stringify } from '../../../common/util/stringify';
-export class Aggregate extends FeatureBase {
+export class Aggregate extends AggregateBase {
   static featureName = FEATURE_NAME;
   constructor(agentIdentifier, aggregator) {
     super(agentIdentifier, aggregator, FEATURE_NAME);
@@ -76,6 +77,9 @@ export class Aggregate extends FeatureBase {
         });
       });
     }
+    getPolyfills().forEach(polyfill => {
+      this.storeSupportabilityMetrics('Polyfill/' + polyfill + '/Detected');
+    });
 
     // file protocol detection
     if (isFileProtocol()) {

package/dist/esm/features/metrics/aggregate/polyfill-detection.es5.js

@@ -0,0 +1,8 @@
+/**
+ * This file is used as a replacement for the polyfill-detection.es5.js
+ * file when running the polyfills webpack build.
+ * @returns {string[]} an empty array
+ */
+export function getPolyfills() {
+  return [];
+}

package/dist/esm/features/metrics/aggregate/polyfill-detection.es5.test.js

@@ -0,0 +1,15 @@
+import { getPolyfills } from './polyfill-detection.es5';
+afterEach(() => {
+  jest.resetAllMocks();
+});
+test('should always return an empty array', () => {
+  const originalFn = Array.from;
+  Array.from = jest.fn(function () {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    return originalFn.apply(this, args);
+  });
+  expect(getPolyfills()).toEqual([]);
+  Array.from = originalFn;
+});

package/dist/esm/features/metrics/aggregate/polyfill-detection.js

@@ -0,0 +1,47 @@
+const detectionRegex = /\{ \[native code\] \}/;
+const POLYFILLS = {
+  FUNCTION_BIND: 'Function.bind',
+  FUNCTION_APPLY: 'Function.apply',
+  FUNCTION_CALL: 'Function.call',
+  ARRAY_INCLUDES: 'Array.includes',
+  ARRAY_FROM: 'Array.from',
+  ARRAY_FIND: 'Array.find',
+  ARRAY_FLAT: 'Array.flat',
+  ARRAY_FLATMAP: 'Array.flatMap',
+  OBJECT_ASSIGN: 'Object.assign',
+  OBJECT_ENTRIES: 'Object.entries',
+  OBJECT_VALUES: 'Object.values',
+  MAP: 'Map',
+  SET: 'Set',
+  WEAK_MAP: 'WeakMap',
+  WEAK_SET: 'WeakSet'
+};
+
+/**
+ * Checks for native globals to see if they have been polyfilled by customer code.
+ * @returns {string[]} Array of methods that were detected to have been polyfilled
+ */
+export function getPolyfills() {
+  const polyfills = [];
+  const mockFunction = function () {/* noop */};
+  try {
+    if (typeof mockFunction.bind === 'function' && !detectionRegex.test(mockFunction.bind.toString())) polyfills.push(POLYFILLS.FUNCTION_BIND);
+    if (typeof mockFunction.apply === 'function' && !detectionRegex.test(mockFunction.apply.toString())) polyfills.push(POLYFILLS.FUNCTION_APPLY);
+    if (typeof mockFunction.call === 'function' && !detectionRegex.test(mockFunction.call.toString())) polyfills.push(POLYFILLS.FUNCTION_CALL);
+    if (typeof [].includes === 'function' && !detectionRegex.test([].includes.toString())) polyfills.push(POLYFILLS.ARRAY_INCLUDES);
+    if (typeof Array.from === 'function' && !detectionRegex.test(Array.from.toString())) polyfills.push(POLYFILLS.ARRAY_FROM);
+    if (typeof [].find === 'function' && !detectionRegex.test([].find.toString())) polyfills.push(POLYFILLS.ARRAY_FIND);
+    if (typeof [].flat === 'function' && !detectionRegex.test([].flat.toString())) polyfills.push(POLYFILLS.ARRAY_FLAT);
+    if (typeof [].flatMap === 'function' && !detectionRegex.test([].flatMap.toString())) polyfills.push(POLYFILLS.ARRAY_FLATMAP);
+    if (typeof Object.assign === 'function' && !detectionRegex.test(Object.assign.toString())) polyfills.push(POLYFILLS.OBJECT_ASSIGN);
+    if (typeof Object.entries === 'function' && !detectionRegex.test(Object.entries.toString())) polyfills.push(POLYFILLS.OBJECT_ENTRIES);
+    if (typeof Object.values === 'function' && !detectionRegex.test(Object.values.toString())) polyfills.push(POLYFILLS.OBJECT_VALUES);
+    if (typeof Map === 'function' && !detectionRegex.test(Map.toString())) polyfills.push(POLYFILLS.MAP);
+    if (typeof Set === 'function' && !detectionRegex.test(Set.toString())) polyfills.push(POLYFILLS.SET);
+    if (typeof WeakMap === 'function' && !detectionRegex.test(WeakMap.toString())) polyfills.push(POLYFILLS.WEAK_MAP);
+    if (typeof WeakSet === 'function' && !detectionRegex.test(WeakSet.toString())) polyfills.push(POLYFILLS.WEAK_SET);
+  } catch (err) {
+    // Possibly not supported
+  }
+  return polyfills;
+}

package/dist/esm/features/metrics/aggregate/polyfill-detection.test.js

@@ -0,0 +1,163 @@
+/* eslint-disable no-global-assign */
+/* eslint-disable no-extend-native */
+import { getPolyfills } from './polyfill-detection';
+
+// DO NOT test Function.prototype.apply, it causes recursion in Jest
+
+test('should return an empty array when nothing is polyfilled', () => {
+  expect(getPolyfills()).toEqual([]);
+});
+test('should indicate Function.prototype.bind is polyfilled', () => {
+  const originalFn = Function.prototype.bind;
+  Function.prototype.bind = jest.fn(function () {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    return originalFn.apply(this, args);
+  });
+  expect(getPolyfills()).toEqual(['Function.bind']);
+  Function.prototype.bind = originalFn;
+});
+test('should indicate Function.prototype.call is polyfilled', () => {
+  const originalFn = Function.prototype.call;
+  Function.prototype.call = jest.fn(function () {
+    for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+      args[_key2] = arguments[_key2];
+    }
+    return originalFn.apply(this, args);
+  });
+  expect(getPolyfills()).toEqual(['Function.call']);
+  Function.prototype.call = originalFn;
+});
+test('should indicate Array.prototype.includes is polyfilled', () => {
+  const originalFn = Array.prototype.includes;
+  Array.prototype.includes = jest.fn(function () {
+    for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
+      args[_key3] = arguments[_key3];
+    }
+    return originalFn.apply(this, args);
+  });
+  expect(getPolyfills()).toEqual(['Array.includes']);
+  Array.prototype.includes = originalFn;
+});
+test('should indicate Array.from is polyfilled', () => {
+  const originalFn = Array.from;
+  Array.from = jest.fn(function () {
+    for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {
+      args[_key4] = arguments[_key4];
+    }
+    return originalFn.apply(this, args);
+  });
+  expect(getPolyfills()).toEqual(['Array.from']);
+  Array.from = originalFn;
+});
+test('should indicate Array.prototype.find is polyfilled', () => {
+  const originalFn = Array.prototype.find;
+  Array.prototype.find = jest.fn(function () {
+    for (var _len5 = arguments.length, args = new Array(_len5), _key5 = 0; _key5 < _len5; _key5++) {
+      args[_key5] = arguments[_key5];
+    }
+    return originalFn.apply(this, args);
+  });
+  expect(getPolyfills()).toEqual(['Array.find']);
+  Array.prototype.find = originalFn;
+});
+test('should indicate Array.prototype.flat is polyfilled', () => {
+  const originalFn = Array.prototype.flat;
+  Array.prototype.flat = jest.fn(function () {
+    for (var _len6 = arguments.length, args = new Array(_len6), _key6 = 0; _key6 < _len6; _key6++) {
+      args[_key6] = arguments[_key6];
+    }
+    return originalFn.apply(this, args);
+  });
+  expect(getPolyfills()).toEqual(['Array.flat']);
+  Array.prototype.flat = originalFn;
+});
+test('should indicate Array.prototype.flatMap is polyfilled', () => {
+  const originalFn = Array.prototype.flatMap;
+  Array.prototype.flatMap = jest.fn(function () {
+    for (var _len7 = arguments.length, args = new Array(_len7), _key7 = 0; _key7 < _len7; _key7++) {
+      args[_key7] = arguments[_key7];
+    }
+    return originalFn.apply(this, args);
+  });
+  expect(getPolyfills()).toEqual(['Array.flatMap']);
+  Array.prototype.flatMap = originalFn;
+});
+test('should indicate Object.assign is polyfilled', () => {
+  const originalFn = Object.assign;
+  Object.assign = jest.fn(function () {
+    for (var _len8 = arguments.length, args = new Array(_len8), _key8 = 0; _key8 < _len8; _key8++) {
+      args[_key8] = arguments[_key8];
+    }
+    return originalFn.apply(this, args);
+  });
+  expect(getPolyfills()).toEqual(['Object.assign']);
+  Object.assign = originalFn;
+});
+test('should indicate Object.entries is polyfilled', () => {
+  const originalFn = Object.entries;
+  Object.entries = jest.fn(function () {
+    for (var _len9 = arguments.length, args = new Array(_len9), _key9 = 0; _key9 < _len9; _key9++) {
+      args[_key9] = arguments[_key9];
+    }
+    return originalFn.apply(this, args);
+  });
+  expect(getPolyfills()).toEqual(['Object.entries']);
+  Object.entries = originalFn;
+});
+test('should indicate Object.values is polyfilled', () => {
+  const originalFn = Object.values;
+  Object.values = jest.fn(function () {
+    for (var _len10 = arguments.length, args = new Array(_len10), _key10 = 0; _key10 < _len10; _key10++) {
+      args[_key10] = arguments[_key10];
+    }
+    return originalFn.apply(this, args);
+  });
+  expect(getPolyfills()).toEqual(['Object.values']);
+  Object.values = originalFn;
+});
+test('should indicate Map constructor is polyfilled', () => {
+  const originalFn = Map;
+  Map = jest.fn(function () {
+    for (var _len11 = arguments.length, args = new Array(_len11), _key11 = 0; _key11 < _len11; _key11++) {
+      args[_key11] = arguments[_key11];
+    }
+    return originalFn.apply(this, args);
+  });
+  expect(getPolyfills()).toEqual(['Map']);
+  Map = originalFn;
+});
+test('should indicate Set constructor is polyfilled', () => {
+  const originalFn = Set;
+  Set = jest.fn(function () {
+    for (var _len12 = arguments.length, args = new Array(_len12), _key12 = 0; _key12 < _len12; _key12++) {
+      args[_key12] = arguments[_key12];
+    }
+    return originalFn.apply(this, args);
+  });
+  expect(getPolyfills()).toEqual(['Set']);
+  Set = originalFn;
+});
+test('should indicate WeakMap constructor is polyfilled', () => {
+  const originalFn = WeakMap;
+  WeakMap = jest.fn(function () {
+    for (var _len13 = arguments.length, args = new Array(_len13), _key13 = 0; _key13 < _len13; _key13++) {
+      args[_key13] = arguments[_key13];
+    }
+    return originalFn.apply(this, args);
+  });
+  expect(getPolyfills()).toEqual(['WeakMap']);
+  WeakMap = originalFn;
+});
+test('should indicate WeakSet constructor is polyfilled', () => {
+  const originalFn = WeakSet;
+  WeakSet = jest.fn(function () {
+    for (var _len14 = arguments.length, args = new Array(_len14), _key14 = 0; _key14 < _len14; _key14++) {
+      args[_key14] = arguments[_key14];
+    }
+    return originalFn.apply(this, args);
+  });
+  expect(getPolyfills()).toEqual(['WeakSet']);
+  WeakSet = originalFn;
+});

package/dist/esm/features/page_action/aggregate/index.js

@@ -12,8 +12,8 @@ import { getConfigurationValue, getInfo, getRuntime } from '../../../common/conf
 import { FEATURE_NAME } from '../constants';
 import { drain } from '../../../common/drain/drain';
 import { isBrowserScope } from '../../../common/util/global-scope';
-import { FeatureBase } from '../../utils/feature-base';
-export class Aggregate extends FeatureBase {
+import { AggregateBase } from '../../utils/aggregate-base';
+export class Aggregate extends AggregateBase {
   static featureName = FEATURE_NAME;
   constructor(agentIdentifier, aggregator) {
     var _this;

package/dist/esm/features/page_view_event/aggregate/index.js

@@ -14,9 +14,9 @@ import * as CONSTANTS from '../constants';
 import { getActivatedFeaturesFlags } from './initialized-features';
 import { globalScope, isBrowserScope } from '../../../common/util/global-scope';
 import { drain } from '../../../common/drain/drain';
-import { FeatureBase } from '../../utils/feature-base';
+import { AggregateBase } from '../../utils/aggregate-base';
 const jsonp = 'NREUM.setToken';
-export class Aggregate extends FeatureBase {
+export class Aggregate extends AggregateBase {
   static featureName = CONSTANTS.FEATURE_NAME;
   constructor(agentIdentifier, aggregator) {
     super(agentIdentifier, aggregator, CONSTANTS.FEATURE_NAME);
@@ -134,7 +134,10 @@ export class Aggregate extends FeatureBase {
 
     // Capture query bytes sent to RUM call endpoint (currently `1`) as a supportability metric. See metrics aggregator (on unload).
     agentRuntime.queryBytesSent[protocol] = (agentRuntime.queryBytesSent[protocol] || 0) + queryString?.length || 0;
-    const isValidJsonp = submitData.jsonp(this.getScheme() + '://' + info.beacon + '/' + protocol + '/' + info.licenseKey + queryString, jsonp);
+    const isValidJsonp = submitData.jsonp({
+      url: this.getScheme() + '://' + info.beacon + '/' + protocol + '/' + info.licenseKey + '?' + queryString,
+      jsonp
+    });
     // Usually `drain` is invoked automatically after processing feature flags contained in the JSONP callback from
     // ingest (see `activateFeatures`), so when JSONP cannot execute (as with module workers), we drain manually.
     if (!isValidJsonp) drain(this.agentIdentifier, CONSTANTS.FEATURE_NAME);

package/dist/esm/features/page_view_timing/aggregate/index.js

@@ -17,8 +17,8 @@ import { getInfo, getConfigurationValue, getRuntime } from '../../../common/conf
 import { FEATURE_NAME } from '../constants';
 import { drain } from '../../../common/drain/drain';
 import { FEATURE_NAMES } from '../../../loaders/features/features';
-import { FeatureBase } from '../../utils/feature-base';
-export class Aggregate extends FeatureBase {
+import { AggregateBase } from '../../utils/aggregate-base';
+export class Aggregate extends AggregateBase {
   static featureName = FEATURE_NAME;
   constructor(agentIdentifier, aggregator) {
     var _this;

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

@@ -0,0 +1,327 @@
+/*
+ * 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.
+ */
+
+import { drain } from '../../../common/drain/drain';
+import { registerHandler } from '../../../common/event-emitter/register-handler';
+import { HarvestScheduler } from '../../../common/harvest/harvest-scheduler';
+import { FEATURE_NAME } from '../constants';
+import { stringify } from '../../../common/util/stringify';
+import { getConfigurationValue, getInfo, getRuntime } from '../../../common/config/config';
+import { SESSION_EVENTS } from '../../../common/session/session-entity';
+import { AggregateBase } from '../../utils/aggregate-base';
+
+// would be better to get this dynamically in some way
+export const RRWEB_VERSION = '2.0.0-alpha.8';
+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;
+export class Aggregate extends AggregateBase {
+  static featureName = FEATURE_NAME;
+  constructor(agentIdentifier, aggregator) {
+    super(agentIdentifier, aggregator, 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 = 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(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(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('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
+    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
+          } = 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() < getConfigurationValue(this.agentIdentifier, 'session_replay.errorSampleRate'), Math.random() < getConfigurationValue(this.agentIdentifier, 'session_replay.sampleRate'));
+    });
+    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
+    } = 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 import( /* webpackChunkName: "recorder" */'rrweb')).record;
+    this.startRecording();
+    const {
+      gzipSync,
+      strToU8
+    } = await import( /* 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(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 = getRuntime(this.agentIdentifier);
+    const info = 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
+    } = 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 = 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
+    } = 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;
+  }
+}

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

@@ -0,0 +1,2 @@
+import { FEATURE_NAMES } from '../../loaders/features/features';
+export const FEATURE_NAME = FEATURE_NAMES.sessionReplay;

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

@@ -0,0 +1,12 @@
+/*
+ * Copyright 2023 New Relic Corporation. All rights reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
+/**
+ * @file The top-level entry point for the eventual Session Replay feature.
+ *
+ * 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.
+ */
+export { Instrument as SessionReplay } from './instrument/index';