@newrelic/browser-agent 1.265.1 → 1.267.0

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

@@ -103,7 +103,6 @@ export class Aggregate extends AggregateBase {
       block_selector,
       mask_text_selector,
       mask_all_inputs,
-      inline_stylesheet,
       inline_images,
       collect_fonts
     } = getConfigurationValue(this.agentIdentifier, 'session_replay');
@@ -130,7 +129,6 @@ export class Aggregate extends AggregateBase {
     /** Detect if the default configs have been altered and report a SM.  This is useful to evaluate what the reasonable defaults are across a customer base over time */
     if (!autoStart) handle(SUPPORTABILITY_METRIC_CHANNEL, ['Config/SessionReplay/AutoStart/Modified'], undefined, FEATURE_NAMES.metrics, this.ee);
     if (collect_fonts === true) handle(SUPPORTABILITY_METRIC_CHANNEL, ['Config/SessionReplay/CollectFonts/Modified'], undefined, FEATURE_NAMES.metrics, this.ee);
-    if (inline_stylesheet !== true) handle(SUPPORTABILITY_METRIC_CHANNEL, ['Config/SessionReplay/InlineStylesheet/Modified'], undefined, FEATURE_NAMES.metrics, this.ee);
     if (inline_images === true) handle(SUPPORTABILITY_METRIC_CHANNEL, ['Config/SessionReplay/InlineImages/Modifed'], undefined, FEATURE_NAMES.metrics, this.ee);
     if (mask_all_inputs !== true) handle(SUPPORTABILITY_METRIC_CHANNEL, ['Config/SessionReplay/MaskAllInputs/Modified'], undefined, FEATURE_NAMES.metrics, this.ee);
     if (block_selector !== '[data-nr-block]') handle(SUPPORTABILITY_METRIC_CHANNEL, ['Config/SessionReplay/BlockSelector/Modified'], undefined, FEATURE_NAMES.metrics, this.ee);
@@ -248,7 +246,7 @@ export class Aggregate extends AggregateBase {
   prepareHarvest({
     opts
   } = {}) {
-    if (!this.recorder || !this.timeKeeper?.ready) return;
+    if (!this.recorder || !this.timeKeeper?.ready || !this.recorder.hasSeenSnapshot) return;
     const recorderEvents = this.recorder.getEvents();
     // get the event type and use that to trigger another harvest if needed
     if (!recorderEvents.events.length || this.mode !== MODE.FULL || this.blocked) return;

package/dist/esm/features/session_replay/shared/recorder.js

@@ -27,14 +27,14 @@ export class Recorder {
     this.recording = false;
     /** The pointer to the current bucket holding rrweb events */
     this.currentBufferTarget = this.#events;
+    /** Only set to true once a snapshot node has been processed.  Used to block preload harvests from sending before we know we have a snapshot */
+    this.hasSeenSnapshot = false;
     /** Hold on to the last meta node, so that it can be re-inserted if the meta and snapshot nodes are broken up due to harvesting */
     this.lastMeta = false;
     /** The parent class that instantiated the recorder */
     this.parent = parent;
-    /** Config to inform to inline stylesheet contents (true default) */
-    this.shouldInlineStylesheets = getConfigurationValue(this.parent.agentIdentifier, 'session_replay.inline_stylesheet');
     /** A flag that can be set to false by failing conversions to stop the fetching process */
-    this.shouldFix = this.shouldInlineStylesheets && getConfigurationValue(this.parent.agentIdentifier, 'session_replay.fix_stylesheets');
+    this.shouldFix = getConfigurationValue(this.parent.agentIdentifier, 'session_replay.fix_stylesheets');
     /** 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 */};
   }
@@ -76,13 +76,16 @@ export class Recorder {
       mask_input_options,
       mask_text_selector,
       mask_all_inputs,
-      inline_stylesheet,
       inline_images,
       collect_fonts
     } = getConfigurationValue(this.parent.agentIdentifier, 'session_replay');
     const customMasker = (text, element) => {
-      if (element?.type?.toLowerCase() !== 'password' && (element?.dataset.nrUnmask !== undefined || element?.classList.contains('nr-unmask'))) return text;
-      return '*'.repeat(text.length);
+      try {
+        if (typeof element?.type === 'string' && element.type.toLowerCase() !== 'password' && (element?.dataset?.nrUnmask !== undefined || element?.classList?.contains('nr-unmask'))) return text;
+      } catch (err) {
+        // likely an element was passed to this handler that was invalid and was missing attributes or methods
+      }
+      return '*'.repeat(text?.length || 0);
     };
     // set up rrweb configurations for maximum privacy --
     // https://newrelic.atlassian.net/wiki/spaces/O11Y/pages/2792293280/2023+02+28+Browser+-+Session+Replay#Configuration-options
@@ -97,7 +100,7 @@ export class Recorder {
       maskTextFn: customMasker,
       maskAllInputs: mask_all_inputs,
       maskInputFn: customMasker,
-      inlineStylesheet: inline_stylesheet,
+      inlineStylesheet: true,
       inlineImages: inline_images,
       collectFonts: collect_fonts,
       checkoutEveryNms: CHECKOUT_MS[this.parent.mode],
@@ -124,13 +127,17 @@ export class Recorder {
    * @param {*} isCheckout - Flag indicating if the payload was triggered as a checkout
    */
   audit(event, isCheckout) {
-    /** only run the audit if inline_stylesheets is configured as on (default behavior) */
-    if (this.shouldInlineStylesheets === false || !this.shouldFix) {
-      this.currentBufferTarget.inlinedAllStylesheets = false;
-      return this.store(event, isCheckout);
-    }
     /** An count of stylesheet objects that were blocked from accessing contents via JS */
     const incompletes = stylesheetEvaluator.evaluate();
+    const missingInlineSMTag = 'SessionReplay/Payload/Missing-Inline-Css/';
+    /** only run the full fixing behavior (more costly) if fix_stylesheets is configured as on (default behavior) */
+    if (!this.shouldFix) {
+      if (incompletes > 0) {
+        this.currentBufferTarget.inlinedAllStylesheets = false;
+        handle(SUPPORTABILITY_METRIC_CHANNEL, [missingInlineSMTag + 'Skipped', incompletes], undefined, FEATURE_NAMES.metrics, this.parent.ee);
+      }
+      return this.store(event, isCheckout);
+    }
     /** Only stop ignoring data if already ignoring and a new valid snapshap is taking place (0 incompletes and we get a meta node for the snap) */
     if (!incompletes && this.#fixing && event.type === RRWEB_EVENT_TYPES.Meta) this.#fixing = false;
     if (incompletes > 0) {
@@ -140,8 +147,8 @@ export class Recorder {
           this.currentBufferTarget.inlinedAllStylesheets = false;
           this.shouldFix = false;
         }
-        handle(SUPPORTABILITY_METRIC_CHANNEL, ['SessionReplay/Payload/Missing-Inline-Css/Failed', failedToFix], undefined, FEATURE_NAMES.metrics, this.parent.ee);
-        handle(SUPPORTABILITY_METRIC_CHANNEL, ['SessionReplay/Payload/Missing-Inline-Css/Fixed', incompletes - failedToFix], undefined, FEATURE_NAMES.metrics, this.parent.ee);
+        handle(SUPPORTABILITY_METRIC_CHANNEL, [missingInlineSMTag + 'Failed', failedToFix], undefined, FEATURE_NAMES.metrics, this.parent.ee);
+        handle(SUPPORTABILITY_METRIC_CHANNEL, [missingInlineSMTag + 'Fixed', incompletes - failedToFix], undefined, FEATURE_NAMES.metrics, this.parent.ee);
         this.takeFullSnapshot();
       });
       /** Only start ignoring data if got a faulty snapshot */
@@ -184,6 +191,7 @@ export class Recorder {
     // snapshot event
     if (event.type === RRWEB_EVENT_TYPES.FullSnapshot) {
       this.currentBufferTarget.hasSnapshot = true;
+      this.hasSeenSnapshot = true;
     }
     this.currentBufferTarget.add(event);
 

package/dist/esm/features/session_replay/shared/stylesheet-evaluator.js

@@ -2,7 +2,7 @@ import { gosNREUMOriginals } from '../../../common/window/nreum';
 import { isBrowserScope } from '../../../common/constants/runtime';
 class StylesheetEvaluator {
   #evaluated = new WeakSet();
-  #fetchProms = [];
+  #brokenSheets = [];
   /**
   * Flipped to true if stylesheets that cannot be natively inlined are detected by the stylesheetEvaluator class
   * Used at harvest time to denote that all subsequent payloads are subject to this and customers should be advised to handle crossorigin decoration
@@ -16,6 +16,7 @@ class StylesheetEvaluator {
    */
   evaluate() {
     let incompletes = 0;
+    this.#brokenSheets = [];
     if (isBrowserScope) {
       for (let i = 0; i < Object.keys(document.styleSheets).length; i++) {
         if (!this.#evaluated.has(document.styleSheets[i])) {
@@ -26,7 +27,7 @@ class StylesheetEvaluator {
           } catch (err) {
             if (!document.styleSheets[i].href) return;
             incompletes++;
-            this.#fetchProms.push(this.#fetchAndOverride(document.styleSheets[i]));
+            this.#brokenSheets.push(document.styleSheets[i]);
           }
         }
       }
@@ -40,8 +41,8 @@ class StylesheetEvaluator {
    * @returns {Promise}
    */
   async fix() {
-    await Promise.all(this.#fetchProms);
-    this.#fetchProms = [];
+    await Promise.all(this.#brokenSheets.map(sheet => this.#fetchAndOverride(sheet)));
+    this.#brokenSheets = [];
     const failedToFix = this.failedToFix;
     this.failedToFix = 0;
     return failedToFix;

package/dist/esm/features/utils/event-buffer.js

@@ -45,7 +45,7 @@ export class EventBuffer {
    * held is another event buffer
    */
   get held() {
-    this.#held ??= new EventBuffer(this.maxPayloadSize);
+    if (!this.#held) this.#held = new EventBuffer(this.maxPayloadSize);
     return this.#held;
   }
 
@@ -58,7 +58,8 @@ export class EventBuffer {
   }
 
   /**
-   * Adds an event object to the buffer while tallying size
+   * Adds an event object to the buffer while tallying size. Only adds the event if it is valid
+   * and would not make the event buffer exceed the maxPayloadSize.
    * @param {Object} event the event object to add to the buffer
    * @returns {EventBuffer} returns the event buffer for chaining
    */

package/dist/esm/loaders/browser-agent.js

@@ -9,6 +9,7 @@ import { Instrument as InstrumentSpa } from '../features/spa/instrument';
 import { Instrument as InstrumentSessionReplay } from '../features/session_replay/instrument';
 import { Instrument as InstrumentGenericEvents } from '../features/generic_events/instrument';
 import { Instrument as InstrumentLogs } from '../features/logging/instrument';
+import { Instrument as InstrumentSoftNav } from '../features/soft_navigations/instrument';
 
 /**
  * An agent class with all feature modules available. Features may be disabled and enabled via runtime configuration.
@@ -18,7 +19,7 @@ export class BrowserAgent extends Agent {
   constructor(args) {
     super({
       ...args,
-      features: [InstrumentXhr, InstrumentPageViewEvent, InstrumentPageViewTiming, InstrumentSessionTrace, InstrumentMetrics, InstrumentErrors, InstrumentSpa, InstrumentSessionReplay, InstrumentGenericEvents, InstrumentLogs],
+      features: [InstrumentXhr, InstrumentPageViewEvent, InstrumentPageViewTiming, InstrumentSessionTrace, InstrumentMetrics, InstrumentErrors, InstrumentSpa, InstrumentSoftNav, InstrumentSessionReplay, InstrumentGenericEvents, InstrumentLogs],
       loaderType: 'browser-agent'
     });
   }

package/dist/types/common/config/init.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"init.d.ts","sourceRoot":"","sources":["../../../../src/common/config/init.js"],"names":[],"mappings":"AAkHA,+CAIC;AAED,0DAKC;AAED,+DAYC"}
+{"version":3,"file":"init.d.ts","sourceRoot":"","sources":["../../../../src/common/config/init.js"],"names":[],"mappings":"AAiHA,+CAIC;AAED,0DAKC;AAED,+DAYC"}

package/dist/types/common/timing/time-keeper.d.ts

@@ -13,8 +13,9 @@ export class TimeKeeper {
      * @param rumRequest {XMLHttpRequest} The xhr for the rum request
      * @param startTime {number} The start time of the RUM request
      * @param endTime {number} The end time of the RUM request
+     * @param nrServerTime {number} the unix number value of the NR server time in MS, returned in the RUM request body
      */
-    processRumRequest(rumRequest: XMLHttpRequest, startTime: number, endTime: number): void;
+    processRumRequest(rumRequest: XMLHttpRequest, startTime: number, endTime: number, nrServerTime: number): void;
     /**
      * Converts a page origin relative time to an absolute timestamp
      * using the user's local clock.

package/dist/types/common/timing/time-keeper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"time-keeper.d.ts","sourceRoot":"","sources":["../../../../src/common/timing/time-keeper.js"],"names":[],"mappings":"AAKA;;;;GAIG;AACH;IA2BE,kCAGC;IAED,qBAEC;IAED,kCAEC;IAED,4BAEC;IAED;;;;;OAKG;IACH,8BAJsB,cAAc,aACf,MAAM,WACR,MAAM,QA2BxB;IAED;;;;;OAKG;IACH,uCAHwB,MAAM,GACjB,MAAM,CAIlB;IAED;;;;;OAKG;IACH,0CAFa,MAAM,CAIlB;IAED;;;;OAIG;IACH,oCAHqB,MAAM,GACf,MAAM,CAIjB;IAED,+FAA+F;IAC/F,0BASC;;CACF"}
+{"version":3,"file":"time-keeper.d.ts","sourceRoot":"","sources":["../../../../src/common/timing/time-keeper.js"],"names":[],"mappings":"AAGA;;;;GAIG;AACH;IA2BE,kCAGC;IAED,qBAEC;IAED,kCAEC;IAED,4BAEC;IAED;;;;;;OAMG;IACH,8BALsB,cAAc,aACf,MAAM,WACR,MAAM,gBACD,MAAM,QAqB7B;IAED;;;;;OAKG;IACH,uCAHwB,MAAM,GACjB,MAAM,CAIlB;IAED;;;;;OAKG;IACH,0CAFa,MAAM,CAIlB;IAED;;;;OAIG;IACH,oCAHqB,MAAM,GACf,MAAM,CAIjB;IAED,+FAA+F;IAC/F,0BASC;;CACF"}

package/dist/types/common/util/stringify.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stringify.d.ts","sourceRoot":"","sources":["../../../../src/common/util/stringify.js"],"names":[],"mappings":"AAyBA;;;;;GAKG;AACH,+BAHW,GAAC,GACC,MAAM,CAYlB"}
+{"version":3,"file":"stringify.d.ts","sourceRoot":"","sources":["../../../../src/common/util/stringify.js"],"names":[],"mappings":"AAyBA;;;;;GAKG;AACH,+BAHW,GAAC,GACC,MAAM,CAclB"}

package/dist/types/common/vitals/constants.d.ts

@@ -5,7 +5,6 @@ export namespace VITAL_NAMES {
     let LARGEST_CONTENTFUL_PAINT: string;
     let CUMULATIVE_LAYOUT_SHIFT: string;
     let INTERACTION_TO_NEXT_PAINT: string;
-    let LONG_TASK: string;
     let TIME_TO_FIRST_BYTE: string;
 }
 //# sourceMappingURL=constants.d.ts.map

package/dist/types/features/metrics/aggregate/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/metrics/aggregate/index.js"],"names":[],"mappings":"AAeA;IACE,2BAAiC;IACjC,mDAsBC;IAED,wDAKC;IAED,iDAKC;IAED,qBAsEC;IAED,0BAOC;IAED,eAkCC;IA/BG,mCAAyB;CAgC9B;8BAjK6B,4BAA4B"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/metrics/aggregate/index.js"],"names":[],"mappings":"AAeA;IACE,2BAAiC;IACjC,mDAsBC;IAED,wDAKC;IAED,iDAKC;IAED,qBAqEC;IAED,0BAOC;IAED,eAkCC;IA/BG,mCAAyB;CAgC9B;8BAhK6B,4BAA4B"}

package/dist/types/features/page_view_event/aggregate/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/page_view_event/aggregate/index.js"],"names":[],"mappings":"AAkBA;IACE,2BAA2C;IAC3C,mDA0BC;IAvBC,wBAAwB;IACxB,8BAA8B;IAC9B,8BAA8B;IAC9B,uBAAsD;IAsBxD,gBAqGC;CACF;8BA5I6B,4BAA4B;2BAK/B,oCAAoC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/page_view_event/aggregate/index.js"],"names":[],"mappings":"AAkBA;IACE,2BAA2C;IAC3C,mDA0BC;IAvBC,wBAAwB;IACxB,8BAA8B;IAC9B,8BAA8B;IAC9B,uBAAsD;IAsBxD,gBAmGC;CACF;8BA1I6B,4BAA4B;2BAK/B,oCAAoC"}

package/dist/types/features/page_view_timing/aggregate/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/page_view_timing/aggregate/index.js"],"names":[],"mappings":"AA0BA;IACE,2BAAiC;IAMjC,mDAyCC;IAtCC,qBAAgC;IAChC,4BAA+B;IAuCjC;;;OAGG;IACH,6BAFW,MAAM,QAOhB;IAED;;OAEG;IACH,uCAUC;IAED,mDAuBC;IAED,qCAGC;IAED,gDAWC;IAGD;;;;kBAUC;IAGD,8BAuBC;;CACF;8BA1K6B,4BAA4B;4BAW9B,0BAA0B"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/page_view_timing/aggregate/index.js"],"names":[],"mappings":"AAyBA;IACE,2BAAiC;IAMjC,mDAuCC;IApCC,qBAAgC;IAChC,4BAA+B;IAqCjC;;;OAGG;IACH,6BAFW,MAAM,QAOhB;IAED;;OAEG;IACH,uCAUC;IAED,mDAuBC;IAED,qCAGC;IAED,gDAWC;IAGD;;;;kBAUC;IAGD,8BAuBC;;CACF;8BAvK6B,4BAA4B;4BAU9B,0BAA0B"}

package/dist/types/features/session_replay/aggregate/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/session_replay/aggregate/index.js"],"names":[],"mappings":"AA+BA;IACE,2BAAiC;IAIjC,8DAuGC;IA1GD,aAAe;IAKb,8GAA8G;IAC9G,wBAAgH;IAChH,iFAAiF;IACjF,qBAAwB;IAGxB,2CAA2C;IAC3C,sDAAwB;IACxB,6CAA6C;IAC7C,gDAAmB;IAEnB,0BAA0B;IAC1B,kBAAqB;IACrB,6CAA6C;IAC7C,gBAA2B;IAE3B,cAA8B;IAC9B,kBAA+C;IAoC/C,4BAKQ;IA6CV,0BAMC;IAED,qBAWC;IAED;;;;;;;OAOG;IACH,gDAHW,OAAO,GACL,IAAI,CA8DhB;IAED,2BASC;IAED;;;;;;;;;;;;oBAiDC;IAED,sCAIC;IAED;;;;;;;;;;MA2EC;IAED,qCAOC;IAED;;;;OAIG;IACH,mCAKC;IAED,yDAAyD;IACzD,+CAUC;IAED,yCAGC;CACF;8BAjZ6B,4BAA4B;iCALzB,2CAA2C"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/session_replay/aggregate/index.js"],"names":[],"mappings":"AA+BA;IACE,2BAAiC;IAIjC,8DAsGC;IAzGD,aAAe;IAKb,8GAA8G;IAC9G,wBAAgH;IAChH,iFAAiF;IACjF,qBAAwB;IAGxB,2CAA2C;IAC3C,sDAAwB;IACxB,6CAA6C;IAC7C,gDAAmB;IAEnB,0BAA0B;IAC1B,kBAAqB;IACrB,6CAA6C;IAC7C,gBAA2B;IAE3B,cAA8B;IAC9B,kBAA+C;IAoC/C,4BAKQ;IA4CV,0BAMC;IAED,qBAWC;IAED;;;;;;;OAOG;IACH,gDAHW,OAAO,GACL,IAAI,CA8DhB;IAED,2BASC;IAED;;;;;;;;;;;;oBAiDC;IAED,sCAIC;IAED;;;;;;;;;;MA2EC;IAED,qCAOC;IAED;;;;OAIG;IACH,mCAKC;IAED,yDAAyD;IACzD,+CAUC;IAED,yCAGC;CACF;8BAhZ6B,4BAA4B;iCALzB,2CAA2C"}

package/dist/types/features/session_replay/shared/recorder.d.ts

@@ -4,12 +4,12 @@ export class Recorder {
     recording: boolean;
     /** The pointer to the current bucket holding rrweb events */
     currentBufferTarget: RecorderEvents;
+    /** Only set to true once a snapshot node has been processed.  Used to block preload harvests from sending before we know we have a snapshot */
+    hasSeenSnapshot: boolean;
     /** Hold on to the last meta node, so that it can be re-inserted if the meta and snapshot nodes are broken up due to harvesting */
     lastMeta: boolean;
     /** The parent class that instantiated the recorder */
     parent: any;
-    /** Config to inform to inline stylesheet contents (true default) */
-    shouldInlineStylesheets: any;
     /** A flag that can be set to false by failing conversions to stop the fetching process */
     shouldFix: any;
     /** The method to stop recording. This defaults to a noop, but is overwritten once the recording library is imported and initialized */

package/dist/types/features/session_replay/shared/recorder.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"recorder.d.ts","sourceRoot":"","sources":["../../../../../src/features/session_replay/shared/recorder.js"],"names":[],"mappings":"AAaA;IAUE,yBAkBC;IAdC,iEAAiE;IACjE,mBAAsB;IACtB,6DAA6D;IAC7D,oCAAuC;IACvC,kIAAkI;IAClI,kBAAqB;IACrB,sDAAsD;IACtD,YAAoB;IACpB,oEAAoE;IACpE,6BAAqH;IACrH,0FAA0F;IAC1F,eAAqI;IACrI,uIAAuI;IACvI,0BAAyE;IAG3E;;;;;;;;;MAmBC;IAED,mFAAmF;IACnF,oBAKC;IAED,qDAAqD;IACrD,uBAuCC;IAED;;;;;OAKG;IACH,aAHW,GAAC,cACD,GAAC,QA4BX;IAED,0HAA0H;IAC1H,yCAmDC;IAzCG,8BAAoB;IA2CxB,0HAA0H;IAC1H,yBAOC;IAED,wBAEC;IAED,gCAAgC;IAChC,uCAGC;IAED;;;SAGK;IACL,oCAGC;;CACF;+BAlO8B,mBAAmB"}
+{"version":3,"file":"recorder.d.ts","sourceRoot":"","sources":["../../../../../src/features/session_replay/shared/recorder.js"],"names":[],"mappings":"AAaA;IAUE,yBAkBC;IAdC,iEAAiE;IACjE,mBAAsB;IACtB,6DAA6D;IAC7D,oCAAuC;IACvC,+IAA+I;IAC/I,yBAA4B;IAC5B,kIAAkI;IAClI,kBAAqB;IACrB,sDAAsD;IACtD,YAAoB;IACpB,0FAA0F;IAC1F,eAAqG;IACrG,uIAAuI;IACvI,0BAAyE;IAG3E;;;;;;;;;MAmBC;IAED,mFAAmF;IACnF,oBAKC;IAED,qDAAqD;IACrD,uBA2CC;IAED;;;;;OAKG;IACH,aAHW,GAAC,cACD,GAAC,QAgCX;IAED,0HAA0H;IAC1H,yCAoDC;IA1CG,8BAAoB;IA4CxB,0HAA0H;IAC1H,yBAOC;IAED,wBAEC;IAED,gCAAgC;IAChC,uCAGC;IAED;;;SAGK;IACL,oCAGC;;CACF;+BA3O8B,mBAAmB"}

package/dist/types/features/session_replay/shared/stylesheet-evaluator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stylesheet-evaluator.d.ts","sourceRoot":"","sources":["../../../../../src/features/session_replay/shared/stylesheet-evaluator.js"],"names":[],"mappings":"AAyFA,sDAA4D;AAtF5D;IAGE;;;QAGI;IACJ,oCAAkC;IAClC,oBAAe;IAEf;;;OAGG;IACH,mBAmBC;IAED;;;OAGG;IACH,oBAMC;;CAuCF"}
+{"version":3,"file":"stylesheet-evaluator.d.ts","sourceRoot":"","sources":["../../../../../src/features/session_replay/shared/stylesheet-evaluator.js"],"names":[],"mappings":"AA0FA,sDAA4D;AAvF5D;IAGE;;;QAGI;IACJ,oCAAkC;IAClC,oBAAe;IAEf;;;OAGG;IACH,mBAoBC;IAED;;;OAGG;IACH,oBAMC;;CAuCF"}

package/dist/types/features/utils/event-buffer.d.ts

@@ -32,7 +32,8 @@ export class EventBuffer {
      */
     get hasData(): boolean;
     /**
-     * Adds an event object to the buffer while tallying size
+     * Adds an event object to the buffer while tallying size. Only adds the event if it is valid
+     * and would not make the event buffer exceed the maxPayloadSize.
      * @param {Object} event the event object to add to the buffer
      * @returns {EventBuffer} returns the event buffer for chaining
      */

package/dist/types/features/utils/event-buffer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"event-buffer.d.ts","sourceRoot":"","sources":["../../../../src/features/utils/event-buffer.js"],"names":[],"mappings":"AAGA;;;;;GAKG;AAEH;;GAEG;AACH;IAQE;;;OAGG;IACH,6BAFW,MAAM,YAAC,EAIjB;IADC,uBAAoC;IAGtC;;OAEG;IACH,uBAEC;IAED;;OAEG;IACH,oBAEC;IAED;;OAEG;IACH,wBAGC;IAED;;;OAGG;IACH,uBAEC;IAED;;;;OAIG;IACH,WAHW,MAAM,GACJ,WAAW,CAQvB;IAED;;;OAGG;IACH,SAFa,WAAW,CAMvB;IAED;;;;OAIG;IACH,QAFa,WAAW,CAMvB;IAED;;;;OAIG;IACH,UAFa,WAAW,CAMvB;IAED;;;;;OAKG;IACH,kCAHW,OAAO,GACL,WAAW,CAOvB;IAED;;;;OAIG;IACH,eAHW,MAAM,GACJ,OAAO,CAInB;;CACF"}
+{"version":3,"file":"event-buffer.d.ts","sourceRoot":"","sources":["../../../../src/features/utils/event-buffer.js"],"names":[],"mappings":"AAGA;;;;;GAKG;AAEH;;GAEG;AACH;IAQE;;;OAGG;IACH,6BAFW,MAAM,YAAC,EAIjB;IADC,uBAAoC;IAGtC;;OAEG;IACH,uBAEC;IAED;;OAEG;IACH,oBAEC;IAED;;OAEG;IACH,wBAGC;IAED;;;OAGG;IACH,uBAEC;IAED;;;;;OAKG;IACH,WAHW,MAAM,GACJ,WAAW,CAQvB;IAED;;;OAGG;IACH,SAFa,WAAW,CAMvB;IAED;;;;OAIG;IACH,QAFa,WAAW,CAMvB;IAED;;;;OAIG;IACH,UAFa,WAAW,CAMvB;IAED;;;;;OAKG;IACH,kCAHW,OAAO,GACL,WAAW,CAOvB;IAED;;;;OAIG;IACH,eAHW,MAAM,GACJ,OAAO,CAInB;;CACF"}

package/dist/types/loaders/browser-agent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"browser-agent.d.ts","sourceRoot":"","sources":["../../../src/loaders/browser-agent.js"],"names":[],"mappings":"AAaA;;;GAGG;AACH;IACE,uBAiBC;CACF;sBApCqB,SAAS"}
+{"version":3,"file":"browser-agent.d.ts","sourceRoot":"","sources":["../../../src/loaders/browser-agent.js"],"names":[],"mappings":"AAcA;;;GAGG;AACH;IACE,uBAkBC;CACF;sBAtCqB,SAAS"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@newrelic/browser-agent",
-  "version": "1.265.1",
+  "version": "1.267.0",
   "private": false,
   "author": "New Relic Browser Agent Team <browser-agent@newrelic.com>",
   "description": "New Relic Browser Agent",
@@ -59,6 +59,9 @@
       "features/session_replay": [
         "dist/types/features/session_replay/instrument/index.d.ts"
       ],
+      "features/soft_navigations": [
+        "dist/types/features/soft_navigations/instrument/index.d.ts"
+      ],
       "features/spa": [
         "dist/types/features/spa/instrument/index.d.ts"
       ]
@@ -193,7 +196,7 @@
   "dependencies": {
     "fflate": "0.7.4",
     "rrweb": "2.0.0-alpha.12",
-    "web-vitals": "3.5.2"
+    "web-vitals": "4.2.3"
   },
   "devDependencies": {
     "@babel/cli": "^7.23.4",

package/src/common/config/init.js

@@ -49,7 +49,7 @@ const model = () => {
     obfuscate: undefined,
     page_action: { enabled: true },
     page_view_event: { enabled: true, autoStart: true },
-    page_view_timing: { enabled: true, harvestTimeSeconds: 30, long_task: false, autoStart: true },
+    page_view_timing: { enabled: true, harvestTimeSeconds: 30, autoStart: true },
     privacy: { cookies_enabled: true }, // *cli - per discussion, default should be true
     proxy: {
       assets: undefined, // if this value is set, it will be used to overwrite the webpack asset path used to fetch assets
@@ -69,8 +69,7 @@ const model = () => {
       error_sampling_rate: 100, // float from 0 - 100
       collect_fonts: false, // serialize fonts for collection without public asset url, this is currently broken in RRWeb -- https://github.com/rrweb-io/rrweb/issues/1304.  When fixed, revisit with test cases
       inline_images: false, // serialize images for collection without public asset url -- right now this is only useful for testing as it easily generates payloads too large to be harvested
-      inline_stylesheet: true, // serialize css for collection without public asset url
-      fix_stylesheets: true, // fetch missing stylesheet resources for inlining, only works if 'inline_stylesheet' is also true
+      fix_stylesheets: true, // fetch missing stylesheet resources for inlining
       // recording config settings
       mask_all_inputs: true,
       // this has a getter/setter to facilitate validation of the selectors

package/src/common/timing/time-keeper.js

@@ -1,8 +1,6 @@
 import { originTime } from '../constants/runtime'
 import { getRuntime } from '../config/runtime'
 
-const rfc2616Regex = /^(Mon|Tue|Wed|Thu|Fri|Sat|Sun), ([0-3][0-9]) (Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec) ([0-9]{4}) ([01][0-9]|2[0-3])(:[0-5][0-9]){2} GMT$/
-
 /**
  * Class used to adjust the timestamp of harvested data to New Relic server time. This
  * is done by tracking the performance timings of the RUM call and applying a calculation
@@ -57,28 +55,23 @@ export class TimeKeeper {
    * @param rumRequest {XMLHttpRequest} The xhr for the rum request
    * @param startTime {number} The start time of the RUM request
    * @param endTime {number} The end time of the RUM request
+   * @param nrServerTime {number} the unix number value of the NR server time in MS, returned in the RUM request body
    */
-  processRumRequest (rumRequest, startTime, endTime) {
+  processRumRequest (rumRequest, startTime, endTime, nrServerTime) {
     this.processStoredDiff() // Check session entity for stored time diff
     if (this.#ready) return // Server time calculated from session entity
 
-    const responseDateHeader = rumRequest.getResponseHeader('Date')
-    if (!responseDateHeader) {
-      throw new Error('Missing date header on rum response.')
-    }
-    if (!rfc2616Regex.test(responseDateHeader)) {
-      throw new Error('Date header invalid format.')
-    }
+    if (!nrServerTime) throw new Error('nrServerTime not found')
 
     const medianRumOffset = (endTime - startTime) / 2
     const serverOffset = startTime + medianRumOffset
 
     // Corrected page origin time
-    this.#correctedOriginTime = Math.floor(Date.parse(responseDateHeader) - serverOffset)
+    this.#correctedOriginTime = Math.floor(nrServerTime - serverOffset)
     this.#localTimeDiff = originTime - this.#correctedOriginTime
 
     if (isNaN(this.#correctedOriginTime)) {
-      throw new Error('Date header invalid format.')
+      throw new Error('Failed to correct browser time to server time')
     }
 
     this.#session?.write({ serverTimeDiff: this.#localTimeDiff })

package/src/common/util/stringify.js

@@ -38,5 +38,7 @@ export function stringify (val) {
     } catch (err) {
       // do nothing
     }
+    // return a string so that downstream users of the method do not throw errors
+    return ''
   }
 }

package/src/common/vitals/constants.js

@@ -5,6 +5,5 @@ export const VITAL_NAMES = {
   LARGEST_CONTENTFUL_PAINT: 'lcp',
   CUMULATIVE_LAYOUT_SHIFT: 'cls',
   INTERACTION_TO_NEXT_PAINT: 'inp',
-  LONG_TASK: 'lt',
   TIME_TO_FIRST_BYTE: 'ttfb'
 }

package/src/common/vitals/interaction-to-next-paint.js

@@ -10,9 +10,15 @@ if (isBrowserScope) {
   onINP(({ value, attribution, id }) => {
     const attrs = {
       metricId: id,
-      eventTarget: attribution.eventTarget,
-      eventType: attribution.eventType,
-      eventTime: attribution.eventTime,
+      eventTarget: attribution.interactionTarget, // event* attrs deprecated in v4, kept for NR backwards compatibility
+      eventTime: attribution.interactionTime, // event* attrs deprecated in v4, kept for NR backwards compatibility
+      interactionTarget: attribution.interactionTarget,
+      interactionTime: attribution.interactionTime,
+      interactionType: attribution.interactionType,
+      inputDelay: attribution.inputDelay,
+      nextPaintTime: attribution.nextPaintTime,
+      processingDuration: attribution.processingDuration,
+      presentationDelay: attribution.presentationDelay,
       loadState: attribution.loadState
     }
     interactionToNextPaint.update({ value, attrs })

package/src/common/vitals/largest-contentful-paint.js

@@ -20,7 +20,8 @@ if (isBrowserScope) {
         element: attribution.element,
         timeToFirstByte: attribution.timeToFirstByte,
         resourceLoadDelay: attribution.resourceLoadDelay,
-        resourceLoadTime: attribution.resourceLoadTime,
+        resourceLoadDuration: attribution.resourceLoadDuration,
+        resourceLoadTime: attribution.resourceLoadDuration, // kept for NR backwards compatibility, deprecated in v3->v4
         elementRenderDelay: attribution.elementRenderDelay
       }
       if (attribution.url) attrs.elUrl = cleanURL(attribution.url)

package/src/features/metrics/aggregate/index.js

@@ -56,7 +56,7 @@ export class Aggregate extends AggregateBase {
   singleChecks () {
     // report loaderType
     const { distMethod, loaderType } = getRuntime(this.agentIdentifier)
-    const { proxy, privacy, page_view_timing } = getConfiguration(this.agentIdentifier)
+    const { proxy, privacy } = getConfiguration(this.agentIdentifier)
 
     if (loaderType) this.storeSupportabilityMetrics(`Generic/LoaderType/${loaderType}/Detected`)
     if (distMethod) this.storeSupportabilityMetrics(`Generic/DistMethod/${distMethod}/Detected`)
@@ -77,7 +77,6 @@ export class Aggregate extends AggregateBase {
       })
 
       if (!privacy.cookies_enabled) this.storeSupportabilityMetrics('Config/SessionTracking/Disabled')
-      if (page_view_timing.long_task) this.storeSupportabilityMetrics('Config/LongTask/Enabled')
     } else if (isWorkerScope) {
       this.storeSupportabilityMetrics('Generic/Runtime/Worker/Detected')
     } else {

package/src/features/page_view_event/aggregate/index.js

@@ -125,19 +125,17 @@ export class Aggregate extends AggregateBase {
           return
         }
 
-        try {
-          this.timeKeeper.processRumRequest(xhr, rumStartTime, rumEndTime)
-          if (!this.timeKeeper.ready) throw new Error('TimeKeeper not ready')
-
-          agentRuntime.timeKeeper = this.timeKeeper
-        } catch (error) {
-          this.ee.abort()
-          warn(17, error)
-          return
-        }
-
         try {
           const { app, ...flags } = JSON.parse(responseText)
+          try {
+            this.timeKeeper.processRumRequest(xhr, rumStartTime, rumEndTime, app.nrServerTime)
+            if (!this.timeKeeper.ready) throw new Error('TimeKeeper not ready')
+            agentRuntime.timeKeeper = this.timeKeeper
+          } catch (error) {
+            this.ee.abort()
+            warn(17, error)
+            return
+          }
           agentRuntime.appMetadata = app
           activateFeatures(flags, this.agentIdentifier)
           this.drain()

package/src/features/page_view_timing/aggregate/index.js

@@ -19,7 +19,6 @@ import { firstPaint } from '../../../common/vitals/first-paint'
 import { interactionToNextPaint } from '../../../common/vitals/interaction-to-next-paint'
 import { largestContentfulPaint } from '../../../common/vitals/largest-contentful-paint'
 import { timeToFirstByte } from '../../../common/vitals/time-to-first-byte'
-import { longTask } from '../../../common/vitals/long-task'
 import { subscribeToVisibilityChange } from '../../../common/window/page-visibility'
 import { VITAL_NAMES } from '../../../common/vitals/constants'
 import { EventBuffer } from '../../utils/event-buffer'
@@ -37,8 +36,6 @@ export class Aggregate extends AggregateBase {
     this.timings = new EventBuffer()
     this.curSessEndRecorded = false
 
-    if (getConfigurationValue(this.agentIdentifier, 'page_view_timing.long_task') === true) longTask.subscribe(this.#handleVitalMetric)
-
     registerHandler('docHidden', msTimestamp => this.endCurrentSession(msTimestamp), this.featureName, this.ee)
     registerHandler('winPagehide', msTimestamp => this.recordPageUnload(msTimestamp), this.featureName, this.ee)
 

package/src/features/session_replay/aggregate/index.js

@@ -104,7 +104,7 @@ export class Aggregate extends AggregateBase {
       this.handleError(e)
     }, this.featureName, this.ee)
 
-    const { error_sampling_rate, sampling_rate, autoStart, block_selector, mask_text_selector, mask_all_inputs, inline_stylesheet, inline_images, collect_fonts } = getConfigurationValue(this.agentIdentifier, 'session_replay')
+    const { error_sampling_rate, sampling_rate, autoStart, block_selector, mask_text_selector, mask_all_inputs, inline_images, collect_fonts } = getConfigurationValue(this.agentIdentifier, 'session_replay')
 
     this.waitForFlags(['srs', 'sr']).then(([srMode, entitled]) => {
       this.entitled = !!entitled
@@ -129,7 +129,6 @@ export class Aggregate extends AggregateBase {
     /** Detect if the default configs have been altered and report a SM.  This is useful to evaluate what the reasonable defaults are across a customer base over time */
     if (!autoStart) handle(SUPPORTABILITY_METRIC_CHANNEL, ['Config/SessionReplay/AutoStart/Modified'], undefined, FEATURE_NAMES.metrics, this.ee)
     if (collect_fonts === true) handle(SUPPORTABILITY_METRIC_CHANNEL, ['Config/SessionReplay/CollectFonts/Modified'], undefined, FEATURE_NAMES.metrics, this.ee)
-    if (inline_stylesheet !== true) handle(SUPPORTABILITY_METRIC_CHANNEL, ['Config/SessionReplay/InlineStylesheet/Modified'], undefined, FEATURE_NAMES.metrics, this.ee)
     if (inline_images === true) handle(SUPPORTABILITY_METRIC_CHANNEL, ['Config/SessionReplay/InlineImages/Modifed'], undefined, FEATURE_NAMES.metrics, this.ee)
     if (mask_all_inputs !== true) handle(SUPPORTABILITY_METRIC_CHANNEL, ['Config/SessionReplay/MaskAllInputs/Modified'], undefined, FEATURE_NAMES.metrics, this.ee)
     if (block_selector !== '[data-nr-block]') handle(SUPPORTABILITY_METRIC_CHANNEL, ['Config/SessionReplay/BlockSelector/Modified'], undefined, FEATURE_NAMES.metrics, this.ee)
@@ -242,7 +241,7 @@ export class Aggregate extends AggregateBase {
   }
 
   prepareHarvest ({ opts } = {}) {
-    if (!this.recorder || !this.timeKeeper?.ready) return
+    if (!this.recorder || !this.timeKeeper?.ready || !this.recorder.hasSeenSnapshot) return
     const recorderEvents = this.recorder.getEvents()
     // get the event type and use that to trigger another harvest if needed
     if (!recorderEvents.events.length || (this.mode !== MODE.FULL) || this.blocked) return

package/src/features/session_replay/shared/recorder.js

@@ -29,14 +29,14 @@ export class Recorder {
     this.recording = false
     /** The pointer to the current bucket holding rrweb events */
     this.currentBufferTarget = this.#events
+    /** Only set to true once a snapshot node has been processed.  Used to block preload harvests from sending before we know we have a snapshot */
+    this.hasSeenSnapshot = false
     /** Hold on to the last meta node, so that it can be re-inserted if the meta and snapshot nodes are broken up due to harvesting */
     this.lastMeta = false
     /** The parent class that instantiated the recorder */
     this.parent = parent
-    /** Config to inform to inline stylesheet contents (true default) */
-    this.shouldInlineStylesheets = getConfigurationValue(this.parent.agentIdentifier, 'session_replay.inline_stylesheet')
     /** A flag that can be set to false by failing conversions to stop the fetching process */
-    this.shouldFix = this.shouldInlineStylesheets && getConfigurationValue(this.parent.agentIdentifier, 'session_replay.fix_stylesheets')
+    this.shouldFix = getConfigurationValue(this.parent.agentIdentifier, 'session_replay.fix_stylesheets')
     /** 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 */ }
   }
@@ -73,10 +73,14 @@ export class Recorder {
   /** Begin recording using configured recording lib */
   startRecording () {
     this.recording = true
-    const { block_class, ignore_class, mask_text_class, block_selector, mask_input_options, mask_text_selector, mask_all_inputs, inline_stylesheet, inline_images, collect_fonts } = getConfigurationValue(this.parent.agentIdentifier, 'session_replay')
+    const { block_class, ignore_class, mask_text_class, block_selector, mask_input_options, mask_text_selector, mask_all_inputs, inline_images, collect_fonts } = getConfigurationValue(this.parent.agentIdentifier, 'session_replay')
     const customMasker = (text, element) => {
-      if (element?.type?.toLowerCase() !== 'password' && (element?.dataset.nrUnmask !== undefined || element?.classList.contains('nr-unmask'))) return text
-      return '*'.repeat(text.length)
+      try {
+        if (typeof element?.type === 'string' && element.type.toLowerCase() !== 'password' && (element?.dataset?.nrUnmask !== undefined || element?.classList?.contains('nr-unmask'))) return text
+      } catch (err) {
+        // likely an element was passed to this handler that was invalid and was missing attributes or methods
+      }
+      return '*'.repeat(text?.length || 0)
     }
     // set up rrweb configurations for maximum privacy --
     // https://newrelic.atlassian.net/wiki/spaces/O11Y/pages/2792293280/2023+02+28+Browser+-+Session+Replay#Configuration-options
@@ -91,7 +95,7 @@ export class Recorder {
       maskTextFn: customMasker,
       maskAllInputs: mask_all_inputs,
       maskInputFn: customMasker,
-      inlineStylesheet: inline_stylesheet,
+      inlineStylesheet: true,
       inlineImages: inline_images,
       collectFonts: collect_fonts,
       checkoutEveryNms: CHECKOUT_MS[this.parent.mode],
@@ -119,13 +123,17 @@ export class Recorder {
    * @param {*} isCheckout - Flag indicating if the payload was triggered as a checkout
    */
   audit (event, isCheckout) {
-    /** only run the audit if inline_stylesheets is configured as on (default behavior) */
-    if (this.shouldInlineStylesheets === false || !this.shouldFix) {
-      this.currentBufferTarget.inlinedAllStylesheets = false
-      return this.store(event, isCheckout)
-    }
     /** An count of stylesheet objects that were blocked from accessing contents via JS */
     const incompletes = stylesheetEvaluator.evaluate()
+    const missingInlineSMTag = 'SessionReplay/Payload/Missing-Inline-Css/'
+    /** only run the full fixing behavior (more costly) if fix_stylesheets is configured as on (default behavior) */
+    if (!this.shouldFix) {
+      if (incompletes > 0) {
+        this.currentBufferTarget.inlinedAllStylesheets = false
+        handle(SUPPORTABILITY_METRIC_CHANNEL, [missingInlineSMTag + 'Skipped', incompletes], undefined, FEATURE_NAMES.metrics, this.parent.ee)
+      }
+      return this.store(event, isCheckout)
+    }
     /** Only stop ignoring data if already ignoring and a new valid snapshap is taking place (0 incompletes and we get a meta node for the snap) */
     if (!incompletes && this.#fixing && event.type === RRWEB_EVENT_TYPES.Meta) this.#fixing = false
     if (incompletes > 0) {
@@ -135,8 +143,8 @@ export class Recorder {
           this.currentBufferTarget.inlinedAllStylesheets = false
           this.shouldFix = false
         }
-        handle(SUPPORTABILITY_METRIC_CHANNEL, ['SessionReplay/Payload/Missing-Inline-Css/Failed', failedToFix], undefined, FEATURE_NAMES.metrics, this.parent.ee)
-        handle(SUPPORTABILITY_METRIC_CHANNEL, ['SessionReplay/Payload/Missing-Inline-Css/Fixed', incompletes - failedToFix], undefined, FEATURE_NAMES.metrics, this.parent.ee)
+        handle(SUPPORTABILITY_METRIC_CHANNEL, [missingInlineSMTag + 'Failed', failedToFix], undefined, FEATURE_NAMES.metrics, this.parent.ee)
+        handle(SUPPORTABILITY_METRIC_CHANNEL, [missingInlineSMTag + 'Fixed', incompletes - failedToFix], undefined, FEATURE_NAMES.metrics, this.parent.ee)
         this.takeFullSnapshot()
       })
       /** Only start ignoring data if got a faulty snapshot */
@@ -184,6 +192,7 @@ export class Recorder {
     // snapshot event
     if (event.type === RRWEB_EVENT_TYPES.FullSnapshot) {
       this.currentBufferTarget.hasSnapshot = true
+      this.hasSeenSnapshot = true
     }
     this.currentBufferTarget.add(event)