feat: Origin of agent webpack chunks now changeable

babel.config.js

@@ -94,7 +94,8 @@ module.exports = function (api, ...args) {
         [
           './tools/babel/plugins/transform-import',
           {
-            '(constants/)env$': '$1env.npm'
+            '(constants/)env$': '$1env.npm',
+            '(configure/)public-path$': '$1public-path.npm'
           }
         ]
       ]
@@ -112,7 +113,8 @@ module.exports = function (api, ...args) {
         [
           './tools/babel/plugins/transform-import',
           {
-            '(constants/)env$': '$1env.npm'
+            '(constants/)env$': '$1env.npm',
+            '(configure/)public-path$': '$1public-path.npm'
           }
         ]
       ]

src/common/config/state/init.js

@@ -8,6 +8,10 @@ const model = () => {
     maskInputOptions: { password: true }
   }
   return {
+    proxy: {
+      assets: undefined, // if this value is set, it will be used to overwrite the webpack asset path used to fetch assets
+      beacon: undefined // likewise for the url to which we send analytics
+    },
     privacy: { cookies_enabled: true }, // *cli - per discussion, default should be true
     ajax: { deny_list: undefined, block_internal: true, enabled: true, harvestTimeSeconds: 10, autoStart: true },
     distributed_tracing: {

src/common/constants/runtime.js

@@ -48,7 +48,7 @@ export const initiallyHidden = Boolean(globalScope?.document?.visibilityState ==
 
 export const initialLocation = '' + globalScope?.location
 
-export const isiOS = /iPad|iPhone|iPod/.test(navigator.userAgent)
+export const isiOS = /iPad|iPhone|iPod/.test(globalScope.navigator?.userAgent)
 
 /**
  * Shared Web Workers introduced in iOS 16.0+ and n/a in 15.6-
@@ -60,7 +60,7 @@ export const isiOS = /iPad|iPhone|iPod/.test(navigator.userAgent)
 export const iOSBelow16 = (isiOS && typeof SharedWorker === 'undefined')
 
 export const ffVersion = (() => {
-  const match = navigator.userAgent.match(/Firefox[/\s](\d+\.\d+)/)
+  const match = globalScope.navigator?.userAgent?.match(/Firefox[/\s](\d+\.\d+)/)
   if (Array.isArray(match) && match.length >= 2) {
     return +match[1]
   }
@@ -70,6 +70,6 @@ export const ffVersion = (() => {
 
 export const isIE = Boolean(isBrowserScope && window.document.documentMode) // deprecated property that only works in IE
 
-export const supportsSendBeacon = !!navigator.sendBeacon
+export const supportsSendBeacon = !!globalScope.navigator?.sendBeacon
 
 export const offset = Math.floor(globalScope?.performance?.timeOrigin || globalScope?.performance?.timing?.navigationStart || Date.now())

src/common/constants/runtime.test.js

@@ -106,10 +106,12 @@ test.each([
   { userAgent: 'Mozilla/5.0 (Macintosh; Intel Mac OS X 13.4; rv:109.0) Gecko/20100101 Firefox/114.0', expected: false }
 ])('should set isiOS to $expected for $userAgent', async ({ userAgent, expected }) => {
   global.navigator.userAgent = userAgent
+  global.window = { navigator: global.navigator, document: true }
 
   const runtime = await import('./runtime')
 
   expect(runtime.isiOS).toEqual(expected)
+  delete global.window
 })
 
 test.each([
@@ -127,12 +129,14 @@ test.each([
     global.SharedWorker = class SharedWorker {}
   }
   global.navigator.userAgent = userAgent
+  global.window = { navigator: global.navigator, document: true }
 
   const runtime = await import('./runtime')
 
   delete global.SharedWorker
 
   expect(runtime.iOSBelow16).toEqual(expected)
+  delete global.window
 })
 
 test.each([
@@ -144,10 +148,12 @@ test.each([
   { userAgent: 'Mozilla/5.0 (Macintosh; Intel Mac OS X 13.4; rv:109.0) Gecko/20100101 Firefox/114.0', expected: 114 }
 ])('should set ffVersion to $expected for $userAgent', async ({ userAgent, expected }) => {
   global.navigator.userAgent = userAgent
+  global.window = { navigator: global.navigator, document: true }
 
   const runtime = await import('./runtime')
 
   expect(runtime.ffVersion).toEqual(expected)
+  delete global.window
 })
 
 test('should set supportsSendBeacon to false', async () => {
@@ -161,8 +167,10 @@ test('should set supportsSendBeacon to false', async () => {
 
 test('should set supportsSendBeacon to true', async () => {
   global.navigator.sendBeacon = jest.fn()
+  global.window = { navigator: global.navigator, document: true }
 
   const runtime = await import('./runtime')
 
   expect(runtime.supportsSendBeacon).toEqual(true)
+  delete global.window
 })

src/common/harvest/harvest.js

@@ -7,7 +7,7 @@ import { obj as encodeObj, param as encodeParam } from '../url/encode'
 import { stringify } from '../util/stringify'
 import * as submitData from '../util/submit-data'
 import { getLocation } from '../url/location'
-import { getInfo, getConfigurationValue, getRuntime } from '../config/config'
+import { getInfo, getConfigurationValue, getRuntime, getConfiguration } from '../config/config'
 import { cleanURL } from '../url/clean-url'
 import { now } from '../timing/now'
 import { eventListenerOpts } from '../event-listener/event-listener-opts'
@@ -33,7 +33,6 @@ export class Harvest extends SharedContext {
 
     this.tooManyRequestsDelay = getConfigurationValue(this.sharedContext.agentIdentifier, 'harvest.tooManyRequestsDelay') || 60
     this.obfuscator = new Obfuscator(this.sharedContext)
-    this.getScheme = () => (getConfigurationValue(this.sharedContext.agentIdentifier, 'ssl') === false) ? 'http' : 'https'
 
     this._events = {}
   }
@@ -96,10 +95,13 @@ export class Harvest extends SharedContext {
       return false
     }
 
+    const init = getConfiguration(this.sharedContext.agentIdentifier)
+    const protocol = init.ssl === false ? 'http' : 'https'
+    const perceviedBeacon = init.proxy.beacon || info.errorBeacon
     const endpointURLPart = endpoint !== 'rum' ? `/${endpoint}` : ''
-    let url = `${this.getScheme()}://${info.errorBeacon}${endpointURLPart}/1/${info.licenseKey}`
+    let url = `${protocol}://${perceviedBeacon}${endpointURLPart}/1/${info.licenseKey}`
     if (customUrl) url = customUrl
-    if (raw) url = `${this.getScheme()}://${info.errorBeacon}/${endpoint}`
+    if (raw) url = `${protocol}://${perceviedBeacon}/${endpoint}`
 
     const baseParams = !raw && includeBaseParams ? this.baseQueryString() : ''
     let payloadParams = encodeObj(qs, agentRuntime.maxBytes)

src/common/harvest/harvest.test.js

@@ -159,6 +159,10 @@ describe('_send', () => {
     jest.mocked(configModule.getRuntime).mockReturnValue({
       maxBytes: Infinity
     })
+    jest.mocked(configModule.getConfiguration).mockReturnValue({
+      ssl: undefined,
+      proxy: {}
+    })
 
     spec = {
       endpoint: faker.datatype.uuid(),
@@ -223,6 +227,19 @@ describe('_send', () => {
     })
   })
 
+  test('able to use and send to proxy when defined', () => {
+    jest.mocked(configModule.getConfiguration).mockReturnValue({ proxy: { beacon: 'some_other_string' } })
+    const result = harvestInstance._send(spec)
+
+    expect(result).toEqual(true)
+    expect(submitMethod).toHaveBeenCalledWith({
+      body: JSON.stringify(spec.payload.body),
+      headers: [{ key: 'content-type', value: 'text/plain' }],
+      sync: undefined,
+      url: expect.stringContaining(`https://some_other_string/${spec.endpoint}/1/${licenseKey}?`)
+    })
+  })
+
   test('should use the custom defined url', () => {
     spec.customUrl = faker.internet.url()
 

src/features/ajax/aggregate/index.js

@@ -67,6 +67,9 @@ export class Aggregate extends AggregateBase {
 
     this.drain()
 
+    const beacon = getInfo(agentIdentifier).errorBeacon
+    const proxyBeacon = agentInit.proxy.beacon
+
     function storeXhr (params, metrics, startTime, endTime, type) {
       metrics.time = startTime
 
@@ -86,7 +89,8 @@ export class Aggregate extends AggregateBase {
       if (!allAjaxIsEnabled) return
 
       if (!shouldCollectEvent(params)) {
-        if (params.hostname === getInfo(agentIdentifier).errorBeacon) {
+        if (params.hostname === beacon || (proxyBeacon && params.hostname === proxyBeacon)) {
+          // This doesn't make a distinction if the same-domain request is going to a different port or path...
           handle(SUPPORTABILITY_METRIC_CHANNEL, ['Ajax/Events/Excluded/Agent'], undefined, FEATURE_NAMES.metrics, ee)
         } else {
           handle(SUPPORTABILITY_METRIC_CHANNEL, ['Ajax/Events/Excluded/App'], undefined, FEATURE_NAMES.metrics, ee)

src/features/page_view_event/aggregate/index.js

@@ -1,7 +1,7 @@
 import { globalScope, isBrowserScope } from '../../../common/constants/runtime'
 import { addPT, addPN } from '../../../common/timing/nav-timing'
 import { stringify } from '../../../common/util/stringify'
-import { getConfigurationValue, getInfo, getRuntime } from '../../../common/config/config'
+import { getInfo, getRuntime } from '../../../common/config/config'
 import { Harvest } from '../../../common/harvest/harvest'
 import * as CONSTANTS from '../constants'
 import { getActivatedFeaturesFlags } from './initialized-features'
@@ -36,10 +36,6 @@ export class Aggregate extends AggregateBase {
     }
   }
 
-  getScheme () {
-    return getConfigurationValue(this.agentIdentifier, 'ssl') === false ? 'http' : 'https'
-  }
-
   sendRum () {
     const info = getInfo(this.agentIdentifier)
     const agentRuntime = getRuntime(this.agentIdentifier)

src/loaders/agent.js

@@ -1,3 +1,5 @@
+// important side effects
+import './configure/public-path'
 // loader files
 import { AgentBase } from './agent-base'
 import { getEnabledFeatures } from './features/enabled-features'

src/loaders/api/apiAsync.js

@@ -1,5 +1,5 @@
 import { FEATURE_NAMES } from '../features/features'
-import { getConfigurationValue, getInfo, getRuntime } from '../../common/config/config'
+import { getConfiguration, getInfo, getRuntime } from '../../common/config/config'
 import { ee } from '../../common/event-emitter/contextual-ee'
 import { handle } from '../../common/event-emitter/handle'
 import { registerHandler } from '../../common/event-emitter/register-handler'
@@ -12,8 +12,6 @@ export function setAPI (agentIdentifier) {
   var instanceEE = ee.get(agentIdentifier)
   var cycle = 0
 
-  var scheme = (getConfigurationValue(agentIdentifier, 'ssl') === false) ? 'http' : 'https'
-
   var api = {
     finished: single(finished),
     setErrorHandler,
@@ -66,7 +64,10 @@ export function setAPI (agentIdentifier) {
     const agentInfo = getInfo(agentIdentifier)
     if (!agentInfo.beacon) return
 
-    var url = scheme + '://' + agentInfo.beacon + '/1/' + agentInfo.licenseKey
+    const agentInit = getConfiguration(agentIdentifier)
+    const scheme = agentInit.ssl === false ? 'http' : 'https'
+    const beacon = agentInit.proxy.beacon || agentInfo.beacon
+    let url = `${scheme}://${beacon}/1/${agentInfo.licenseKey}`
 
     url += '?a=' + agentInfo.applicationID + '&'
     url += 't=' + requestName + '&'

src/loaders/configure/configure.js

@@ -3,6 +3,13 @@ import { addToNREUM, gosCDN, gosNREUMInitializedAgents } from '../../common/wind
 import { getConfiguration, setConfiguration, setInfo, setLoaderConfig, setRuntime } from '../../common/config/config'
 import { activatedFeatures } from '../../common/util/feature-flags'
 import { isWorkerScope } from '../../common/constants/runtime'
+import { redefinePublicPath } from './public-path'
+import { handle } from '../../common/event-emitter/handle'
+import { SUPPORTABILITY_METRIC_CHANNEL } from '../../features/metrics/constants'
+import { ee } from '../../common/event-emitter/contextual-ee'
+import { FEATURE_NAMES } from '../features/features'
+
+let alreadySetOnce = false // the configure() function can run multiple times in agent lifecycle
 
 export function configure (agentIdentifier, opts = {}, loaderType, forceDrain) {
   // eslint-disable-next-line camelcase
@@ -14,6 +21,7 @@ export function configure (agentIdentifier, opts = {}, loaderType, forceDrain) {
     // eslint-disable-next-line camelcase
     loader_config = nr.loader_config
   }
+  const agentEE = ee.get(agentIdentifier)
 
   setConfiguration(agentIdentifier, init || {})
   // eslint-disable-next-line camelcase
@@ -26,14 +34,23 @@ export function configure (agentIdentifier, opts = {}, loaderType, forceDrain) {
   setInfo(agentIdentifier, info)
 
   const updatedInit = getConfiguration(agentIdentifier)
+  const internalTrafficList = [info.beacon, info.errorBeacon]
+  if (!alreadySetOnce) {
+    alreadySetOnce = true
+    if (updatedInit.proxy.assets) {
+      redefinePublicPath(updatedInit.proxy.assets + '/') // much like the info.beacon & init.proxy.beacon, this input should not end in a slash, but one is needed for webpack concat
+      handle(SUPPORTABILITY_METRIC_CHANNEL, ['Config/AssetsUrl/Changed'], undefined, FEATURE_NAMES.metrics, agentEE)
+      internalTrafficList.push(updatedInit.proxy.assets)
+    }
+    if (updatedInit.proxy.beacon) {
+      handle(SUPPORTABILITY_METRIC_CHANNEL, ['Config/BeaconUrl/Changed'], undefined, FEATURE_NAMES.metrics, agentEE)
+      internalTrafficList.push(updatedInit.proxy.beacon)
+    }
+  }
+
   runtime.denyList = [
-    ...(updatedInit.ajax?.deny_list || []),
-    ...(updatedInit.ajax?.block_internal
-      ? [
-          info.beacon,
-          info.errorBeacon
-        ]
-      : [])
+    ...(updatedInit.ajax.deny_list || []),
+    ...(updatedInit.ajax.block_internal ? internalTrafficList : [])
   ]
   setRuntime(agentIdentifier, runtime)
 

src/loaders/configure/public-path.js

@@ -0,0 +1,6 @@
+// Set the default CDN or remote for fetching the assets; NPM shouldn't change this var.
+
+export const redefinePublicPath = (url) => {
+  // There's no URL validation here, so caller should check arg if need be.
+  __webpack_public_path__ = url // eslint-disable-line
+}

src/loaders/configure/public-path.npm.js

@@ -0,0 +1,4 @@
+
+export const redefinePublicPath = () => {
+  // We don't support setting public path in webpack via NPM build.
+}

tests/specs/proxy.e2e.js

@@ -0,0 +1,56 @@
+import { notIE, notSafari, notIOS } from '../../tools/browser-matcher/common-matchers.mjs'
+
+describe('Using proxy servers -', () => {
+  it.withBrowsersMatching(notIE)('setting an assets url changes where agent fetches its chunks from', async () => {
+    const { host, port } = browser.testHandle.assetServerConfig
+    /** This is where we expect the agent to fetch its chunk. '/build/' is necessary within the URL because the way our asset server
+     * handles each test requests -- see /testing-server/plugins/test-handle/index.js. */
+    const assetServerChangedUrl = `http://${host}:${port}/build/fakepath`
+    let url = await browser.testHandle.assetURL('instrumented.html', { init: { proxy: { assets: assetServerChangedUrl } } })
+
+    // Expecting a resource fetch to https://bam-test-1.nr-local.net:<asset port>/build/fakepath/nr-spa.min.js for chunk
+    await browser.setTimeout({ pageLoad: 10000 }) // not expecting RUM to be called, etc.
+    await browser.url(url)
+    await browser.pause(500) // give it a bit of time to process
+    let resources = await browser.execute(function () { // IE11 hates this for some reason
+      return performance.getEntriesByType('resource')
+    })
+
+    expect(resources.some(entry => entry.name.includes('/build/fakepath/nr-spa'))).toBeTruthy()
+  })
+
+  // Safari does not include resource entries for failed-to-load script & ajax requests, so it's totally excluded.
+  it.withBrowsersMatching([notIE, notSafari, notIOS])('setting a beacon url changes RUM call destination', async () => {
+    let url = await browser.testHandle.assetURL('instrumented.html', { init: { proxy: { beacon: 'localhost:1234' } } })
+    await browser.setTimeout({ pageLoad: 10000 })
+    await browser.url(url)
+    if (browser.capabilities.browserName === 'firefox') await browser.pause(10000) // for some reason firefox takes longer to fail & create entry, maybe it's the localhost
+    else await browser.pause(5000) // takes RUM a while to get sent (< 3s but better more stable)
+
+    let resources = await browser.execute(function () {
+      return performance.getEntriesByType('resource')
+    })
+    expect(resources.some(entry => entry.name.startsWith('http://localhost:1234/1/'))).toBeTruthy()
+  })
+
+  it.withBrowsersMatching(notIE)('should send SM when beacon is changed', async () => {
+    const { host: bamHost, port: bamPort } = browser.testHandle.bamServerConfig
+    const { host: assetHost, port: assetPort } = browser.testHandle.assetServerConfig
+    // Even though the beacon isn't actually changed, this should still trigger the agent to emit sm due to difference between bam-test url vs actual default.
+    let url = await browser.testHandle.assetURL('instrumented.html', { init: { proxy: { beacon: `${bamHost}:${bamPort}`, assets: `http://${assetHost}:${assetPort}/build` } } })
+    await browser.url(url).then(() => browser.waitForAgentLoad())
+    const [unloadSupportMetricsResults] = await Promise.all([
+      browser.testHandle.expectSupportMetrics(),
+      await browser.url(await browser.testHandle.assetURL('/')) // Setup expects before navigating
+    ])
+
+    const supportabilityMetrics = unloadSupportMetricsResults.request.body.sm || []
+    expect(supportabilityMetrics).toEqual(expect.arrayContaining([{
+      params: { name: 'Config/BeaconUrl/Changed' },
+      stats: { c: 1 }
+    }, {
+      params: { name: 'Config/AssetsUrl/Changed' },
+      stats: { c: 1 }
+    }]))
+  })
+})

tools/browser-matcher/common-matchers.mjs

@@ -56,6 +56,7 @@ export const notSafari = new SpecMatcher()
   .include('firefox')
   .include('ios')
   .include('android')
+  .include('ie')
 
 export const onlyChrome = new SpecMatcher()
   .include('chrome')

tools/testing-server/plugins/agent-injector/loader-transform.js

@@ -20,13 +20,14 @@ async function getLoaderContent (request, reply, testServer) {
       testServer.config.polyfills ? '-polyfills' : ''
     }.min.js`
   )
-  const loaderFileStats = await fs.promises.stat(loaderFilePath)
 
-  if (!loaderFileStats.isFile()) {
+  let file
+  try {
+    file = (await fs.promises.readFile(loaderFilePath)).toString()
+  } catch (_) {
     throw new Error(`Could not find loader file ${loaderFilePath}`)
   }
-
-  return (await fs.promises.readFile(loaderFilePath)).toString()
+  return file
 }
 
 /**