feat: Soft Navigations trial

.github/actions/build-ab/templates/latest.js

@@ -4,6 +4,6 @@ window.NREUM.loader_config.licenseKey = '{{{args.abLicenseKey}}}'
 window.NREUM.info.applicationID = '{{{args.abAppId}}}'
 window.NREUM.info.licenseKey = '{{{args.abLicenseKey}}}'
 window.NREUM.init.proxy.assets = 'https://staging-js-agent.newrelic.com/dev'
-window.NREUM.init.feature_flags = ['ajax_metrics_deny_list']
+window.NREUM.init.feature_flags = ['soft_nav','ajax_metrics_deny_list']
 
 {{{latestScript}}}

.github/workflows/publish-experiment.yml

@@ -84,8 +84,6 @@ jobs:
         shell: bash
     steps:
       - uses: actions/checkout@v3
-        with:
-          ref: main
       - uses: actions/setup-node@v3
         with:
           node-version: lts/*

src/cdn/experimental.js

@@ -17,7 +17,8 @@ import { Instrument as InstrumentErrors } from '../features/jserrors/instrument'
 import { Instrument as InstrumentXhr } from '../features/ajax/instrument'
 import { Instrument as InstrumentSessionTrace } from '../features/session_trace/instrument'
 import { Instrument as InstrumentSessionReplay } from '../features/session_replay/instrument'
-import { Instrument as InstrumentSpa } from '../features/spa/instrument'
+// import { Instrument as InstrumentSpa } from '../features/spa/instrument'
+import { Instrument as InstrumentSoftNav } from '../features/soft_navigations/instrument'
 import { Instrument as InstrumentPageAction } from '../features/page_action/instrument'
 
 new Agent({
@@ -30,7 +31,8 @@ new Agent({
     InstrumentMetrics,
     InstrumentPageAction,
     InstrumentErrors,
-    InstrumentSpa
+    // InstrumentSpa,
+    InstrumentSoftNav
   ],
   loaderType: 'experimental'
 })

src/cdn/spa.js

@@ -11,6 +11,7 @@ import { Instrument as InstrumentErrors } from '../features/jserrors/instrument'
 import { Instrument as InstrumentXhr } from '../features/ajax/instrument'
 import { Instrument as InstrumentSessionTrace } from '../features/session_trace/instrument'
 import { Instrument as InstrumentSessionReplay } from '../features/session_replay/instrument'
+import { Instrument as InstrumentSoftNav } from '../features/soft_navigations/instrument'
 import { Instrument as InstrumentSpa } from '../features/spa/instrument'
 import { Instrument as InstrumentPageAction } from '../features/page_action/instrument'
 
@@ -24,7 +25,8 @@ new Agent({
     InstrumentMetrics,
     InstrumentPageAction,
     InstrumentErrors,
-    InstrumentSpa
+    InstrumentSoftNav,
+    InstrumentSpa // either the softnav or the old spa will be used (not both), but we still need to pack both to avoid dynamic import for instrument files
   ],
   loaderType: 'spa'
 })

src/common/aggregate/aggregator.js

@@ -82,7 +82,8 @@ export class Aggregator extends SharedContext {
     var hasData = false
     for (var i = 0; i < types.length; i++) {
       type = types[i]
-      results[type] = toArray(this.aggregatedData[type])
+      results[type] = Object.values(this.aggregatedData[type] || {})
+
       if (results[type].length) hasData = true
       delete this.aggregatedData[type]
     }
@@ -159,13 +160,3 @@ function createMetricObject (value) {
     c: 1
   }
 }
-
-function toArray (obj) {
-  if (typeof obj !== 'object') return []
-
-  return mapOwn(obj, getValue)
-}
-
-function getValue (key, value) {
-  return value
-}

src/common/config/state/init.js

@@ -101,7 +101,8 @@ const model = () => {
         else warn('An invalid session_replay.mask_input_option was provided and will not be used', val)
       }
     },
-    spa: { enabled: true, harvestTimeSeconds: 10, autoStart: true }
+    spa: { enabled: true, harvestTimeSeconds: 10, autoStart: true },
+    soft_navigations: { enabled: true, harvestTimeSeconds: 10, autoStart: true }
   }
 }
 

src/common/timing/nav-timing.js

@@ -25,7 +25,7 @@ var RESPONSE = 'response'
 var LOAD_EVENT = 'loadEvent'
 var DOM_CONTENT_LOAD_EVENT = 'domContentLoadedEvent'
 
-export var navTimingValues = []
+export const navTimingValues = []
 
 function getPntType (type) {
   if (typeof type === 'number') return type
@@ -72,6 +72,10 @@ export function addPN (pn, v) {
   return v
 }
 
+/**
+ * By side effect, this modifies 'obj' with a mapping of the 'prop' provided to a 'value', and invalid values are not added.
+ * On the other hand, the local navTimingValues array gets the value appended if valid and 'undefined' appended if invalid, regardless.
+ */
 function handleValue (value, obj, prop, isOldApi) {
   /*
   For L2 Timing API, the value will already be a relative-to-previous-document DOMHighResTimeStamp.
@@ -85,6 +89,6 @@ function handleValue (value, obj, prop, isOldApi) {
     }
     value = Math.round(value)
     obj[prop] = value
-  }
-  navTimingValues.push(value)
+    navTimingValues.push(value)
+  } else navTimingValues.push(undefined)
 }

src/common/timing/now.js

@@ -5,5 +5,5 @@
 
 // This is our own layer around performance.now. It's not strictly necessary, but we keep it in case of future mod-ing of the value for refactor purpose.
 export function now () {
-  return Math.round(performance.now())
+  return Math.floor(performance.now())
 }

src/common/util/feature-flags.js

@@ -11,7 +11,7 @@ const bucketMap = {
   stn: [FEATURE_NAMES.sessionTrace],
   err: [FEATURE_NAMES.jserrors, FEATURE_NAMES.metrics],
   ins: [FEATURE_NAMES.pageAction],
-  spa: [FEATURE_NAMES.spa],
+  spa: [FEATURE_NAMES.spa, FEATURE_NAMES.softNav],
   sr: [FEATURE_NAMES.sessionReplay, FEATURE_NAMES.sessionTrace]
 }
 

src/common/util/feature-flags.test.js

@@ -49,8 +49,8 @@ test('emits the right events when feature flag = 1', () => {
 
   const sharedEE = jest.mocked(eventEmitterModule.ee.get).mock.results[0].value
 
-  // each flag gets emitted to each of its mapped features, and a feat- AND a rumresp- for every emit, so (1+2+1+1+2)*2 = 14
-  expect(handleModule.handle).toHaveBeenCalledTimes(14)
+  // each flag gets emitted to each of its mapped features, and a feat- AND a rumresp- for every emit, so (1+2+1+1+2+2)*2 = 16
+  expect(handleModule.handle).toHaveBeenCalledTimes(16)
   expect(handleModule.handle).toHaveBeenNthCalledWith(1, 'feat-stn', [], undefined, FEATURE_NAMES.sessionTrace, sharedEE)
   expect(handleModule.handle).toHaveBeenLastCalledWith('rumresp-sr', [true], undefined, FEATURE_NAMES.sessionTrace, sharedEE)
 
@@ -65,8 +65,8 @@ test('emits the right events when feature flag = 0', () => {
 
   const sharedEE = jest.mocked(eventEmitterModule.ee.get).mock.results[0].value
 
-  // each flag gets emitted to each of its mapped features, and a block- AND a rumresp- for every emit, so (1+2+1+1+2)*2 = 14
-  expect(handleModule.handle).toHaveBeenCalledTimes(14)
+  // each flag gets emitted to each of its mapped features, and a block- AND a rumresp- for every emit, so (1+2+1+1+2+2)*2 = 16
+  expect(handleModule.handle).toHaveBeenCalledTimes(16)
   expect(handleModule.handle).toHaveBeenNthCalledWith(1, 'block-stn', [], undefined, FEATURE_NAMES.sessionTrace, sharedEE)
   expect(handleModule.handle).toHaveBeenLastCalledWith('rumresp-sr', [false], undefined, FEATURE_NAMES.sessionTrace, sharedEE)
 

src/common/wrap/index.js

@@ -8,10 +8,9 @@ import { wrapHistory } from './wrap-history'
 import { wrapJsonP } from './wrap-jsonp'
 import { wrapMutation } from './wrap-mutation'
 import { wrapPromise } from './wrap-promise'
-import { wrapRaf } from './wrap-raf'
 import { wrapTimer } from './wrap-timer'
 import { wrapXhr } from './wrap-xhr'
 
 export {
-  wrapEvents, wrapFetch, wrapHistory, wrapJsonP, wrapMutation, wrapPromise, wrapRaf, wrapTimer, wrapXhr
+  wrapEvents, wrapFetch, wrapHistory, wrapJsonP, wrapMutation, wrapPromise, wrapTimer, wrapXhr
 }

src/features/ajax/aggregate/index.js

@@ -2,7 +2,7 @@
  * Copyright 2020 New Relic Corporation. All rights reserved.
  * SPDX-License-Identifier: Apache-2.0
  */
-import { registerHandler as register } from '../../../common/event-emitter/register-handler'
+import { registerHandler } from '../../../common/event-emitter/register-handler'
 import { stringify } from '../../../common/util/stringify'
 import { nullable, numeric, getAddStringContext, addCustomAttributes } from '../../../common/serialize/bel-serializer'
 import { handle } from '../../../common/event-emitter/handle'
@@ -14,6 +14,7 @@
 import { SUPPORTABILITY_METRIC_CHANNEL } from '../../metrics/constants'
 import { AggregateBase } from '../../utils/aggregate-base'
 import { parseGQL } from './gql'
+import { getNREUMInitializedAgent } from '../../../common/window/nreum'
 
 export class Aggregate extends AggregateBase {
   static featureName = FEATURE_NAME
@@ -22,7 +23,7 @@
     const agentInit = getConfiguration(agentIdentifier)
     const allAjaxIsEnabled = agentInit.ajax.enabled !== false
 
-    register('xhr', storeXhr, this.featureName, this.ee)
+    registerHandler('xhr', storeXhr, this.featureName, this.ee)
     if (!allAjaxIsEnabled) {
       this.drain()
       return // feature will only collect timeslice metrics & ajax trace nodes if it's not fully enabled
@@ -44,20 +45,21 @@
     this.prepareHarvest = prepareHarvest
     this.getStoredEvents = function () { return { ajaxEvents, spaAjaxEvents } }
 
-    ee.on('interactionSaved', (interaction) => {
-      if (!spaAjaxEvents[interaction.id]) return
-      // remove from the spaAjaxEvents buffer, and let spa harvest it
-      delete spaAjaxEvents[interaction.id]
-    })
-    ee.on('interactionDiscarded', (interaction) => {
+    // --- v Used by old spa feature
+    ee.on('interactionDone', (interaction, wasSaved) => {
       if (!spaAjaxEvents[interaction.id]) return
 
-      spaAjaxEvents[interaction.id].forEach(function (item) {
-        // move it from the spaAjaxEvents buffer to the ajaxEvents buffer for harvesting here
-        ajaxEvents.push(item)
-      })
+      if (!wasSaved) { // if the ixn was saved, then its ajax reqs are part of the payload whereas if it was discarded, it should still be harvested in the ajax feature itself
+        spaAjaxEvents[interaction.id].forEach(function (item) {
+          ajaxEvents.push(item)
+        })
+      }
       delete spaAjaxEvents[interaction.id]
     })
+    // --- ^
+    // --- v Used by new soft nav
+    registerHandler('returnAjax', event => ajaxEvents.push(event), this.featureName, this.ee)
+    // --- ^
 
     const scheduler = new HarvestScheduler('events', {
       onFinished: onEventsHarvestFinished,
@@ -138,12 +140,14 @@
         body: this.body,
         query: this?.parsedOrigin?.search
       })
-
       if (event.gql) handle(SUPPORTABILITY_METRIC_CHANNEL, ['Ajax/Events/GraphQL/Bytes-Added', stringify(event.gql).length], undefined, FEATURE_NAMES.metrics, ee)
 
-      // if the ajax happened inside an interaction, hold it until the interaction finishes
-      if (this.spaNode) {
-        var interactionId = this.spaNode.interaction.id
+      const softNavInUse = Boolean(getNREUMInitializedAgent(agentIdentifier)?.features?.[FEATURE_NAMES.softNav])
+
+      if (softNavInUse) { // For newer soft nav (when running), pass the event to it for evaluation -- either part of an interaction or is given back
+        handle('ajax', [event], undefined, FEATURE_NAMES.softNav, ee)
+      } else if (this.spaNode) { // For old spa (when running), if the ajax happened inside an interaction, hold it until the interaction finishes
+        const interactionId = this.spaNode.interaction.id
         spaAjaxEvents[interactionId] = spaAjaxEvents[interactionId] || []
         spaAjaxEvents[interactionId].push(event)
       } else {
@@ -222,6 +226,7 @@
 
       for (var i = 0; i < events.length; i++) {
         var event = events[i]
+
         var fields = [
           numeric(event.startTime),
           numeric(event.endTime - event.startTime),