@newrelic/browser-agent 0.0.9 → 0.1.229

package/dist/esm/common/wrap/wrap-xhr.js

@@ -0,0 +1,199 @@
+/*
+ * Copyright 2020 New Relic Corporation. All rights reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
+/**
+ * @file Wraps AJAX (XHR) related methods for instrumentation.
+ * This module is used by: ajax, jserrors, spa.
+ */
+
+import { wrapEvents, unwrapEvents } from './wrap-events';
+import { ee as contextualEE } from '../event-emitter/contextual-ee';
+import { eventListenerOpts } from '../event-listener/event-listener-opts';
+import { createWrapperWithEmitter as wfn, unwrapFunction } from './wrap-function';
+import { originals } from '../config/config';
+import { globalScope } from '../util/global-scope';
+import { warn } from '../util/console';
+const wrapped = {};
+const XHR_PROPS = ['open', 'send']; // these are the specific funcs being wrapped on all XMLHttpRequests(.prototype)
+
+/**
+ * Wraps the native XMLHttpRequest (XHR) object to emit custom events to its readystatechange event and an assortment
+ * of handlers. Adds instrumentation in context of a new event emitter scoped only to XHR.
+ * @param {Object} sharedEE - The shared event emitter on which a new scoped event emitter will be based.
+ * @returns {Object} Scoped event emitter with a debug ID of `xhr`.
+ */
+// eslint-disable-next-line
+export function wrapXhr(sharedEE) {
+  var baseEE = sharedEE || contextualEE;
+  const ee = scopedEE(baseEE);
+  if (wrapped[ee.debugId]++)
+    // Notice if our wrapping never ran yet, the falsey NaN will not early return; but if it has,
+    {
+      return ee;
+    } // then we increment the count to track # of feats using this at runtime.
+  wrapped[ee.debugId] = 1; // <- otherwise, first feature to wrap XHR
+
+  wrapEvents(baseEE); // wrap-events patches XMLHttpRequest.prototype.addEventListener for us
+  var wrapFn = wfn(ee);
+  var OrigXHR = originals.XHR;
+  var MutationObserver = originals.MO;
+  var Promise = originals.PR;
+  var setImmediate = originals.SI;
+  var READY_STATE_CHANGE = 'readystatechange';
+  var handlers = ['onload', 'onerror', 'onabort', 'onloadstart', 'onloadend', 'onprogress', 'ontimeout'];
+  var pendingXhrs = [];
+  var activeListeners = globalScope.XMLHttpRequest.listeners;
+  var XHR = globalScope.XMLHttpRequest = newXHR;
+  function newXHR(opts) {
+    var xhr = new OrigXHR(opts);
+    this.listeners = activeListeners ? [...activeListeners, intercept] : [intercept];
+    function intercept() {
+      try {
+        ee.emit('new-xhr', [xhr], xhr);
+        xhr.addEventListener(READY_STATE_CHANGE, wrapXHR, eventListenerOpts(false));
+      } catch (e) {
+        warn('An error occured while intercepting XHR', e);
+        try {
+          ee.emit('internal-error', [e]);
+        } catch (err) {
+          // do nothing
+        }
+      }
+    }
+    this.listeners.forEach(listener => listener());
+    return xhr;
+  }
+  copy(OrigXHR, XHR);
+  XHR.prototype = OrigXHR.prototype;
+  wrapFn.inPlace(XHR.prototype, XHR_PROPS, '-xhr-', getObject);
+  ee.on('send-xhr-start', function (args, xhr) {
+    wrapOnreadystatechange(args, xhr);
+    enqueuePendingXhr(xhr);
+  });
+  ee.on('open-xhr-start', wrapOnreadystatechange);
+  function wrapOnreadystatechange(args, xhr) {
+    wrapFn.inPlace(xhr, ['onreadystatechange'], 'fn-', getObject);
+  }
+  function wrapXHR() {
+    var xhr = this;
+    var ctx = ee.context(xhr);
+    if (xhr.readyState > 3 && !ctx.resolved) {
+      ctx.resolved = true;
+      ee.emit('xhr-resolved', [], xhr);
+    }
+    wrapFn.inPlace(xhr, handlers, 'fn-', getObject);
+  }
+
+  // Wrapping the onreadystatechange property of XHRs takes some special tricks.
+  //
+  // The issue is that the onreadystatechange property may be assigned *after*
+  // send() is called against an XHR. This is of particular importance because
+  // jQuery uses a single onreadystatechange handler to implement all of the XHR
+  // callbacks thtat it provides, and it assigns that property after calling send.
+  //
+  // There are several 'obvious' approaches to wrapping the onreadystatechange
+  // when it's assigned after send:
+  //
+  // 1. Try to wrap the onreadystatechange handler from a readystatechange
+  //    addEventListener callback (the addEventListener callback will fire before
+  //    the onreadystatechange callback).
+  //
+  //      Caveat: this doesn't work in Chrome or Safari, and in fact will cause
+  //      the onreadystatechange handler to not be invoked at all during the
+  //      firing cycle in which it is wrapped, which may break applications :(
+  //
+  // 2. Use Object.defineProperty to create a setter for the onreadystatechange
+  //    property, and wrap from that setter.
+  //
+  //      Caveat: onreadystatechange is not a configurable property in Safari or
+  //      older versions of the Android browser.
+  //
+  // 3. Schedule wrapping of the onreadystatechange property using a setTimeout
+  //    call issued just before the call to send.
+  //
+  //      Caveat: sometimes, the onreadystatechange handler fires before the
+  //      setTimeout, meaning the wrapping happens too late.
+  //
+  // The setTimeout approach is closest to what we use here: we want to schedule
+  // the wrapping of the onreadystatechange property when send is called, but
+  // ensure that our wrapping happens before onreadystatechange has a chance to
+  // fire.
+  //
+  // We achieve this using a hybrid approach:
+  //
+  // * In browsers that support MutationObserver, we use that to schedule wrapping
+  //   of onreadystatechange.
+  //
+  // * We have discovered that MutationObserver in IE causes a memory leak, so we
+  //   now will prefer setImmediate for IE, and use a resolved promise to schedule
+  //   the wrapping in Edge (and other browsers that support promises)
+  //
+  // * In older browsers that don't support MutationObserver, we rely on the fact
+  //   that the call to send is probably happening within a callback that we've
+  //   already wrapped, and use our existing fn-end event callback to wrap the
+  //   onreadystatechange at the end of the current callback.
+  //
+
+  if (MutationObserver) {
+    var resolved = Promise && Promise.resolve();
+    if (!setImmediate && !Promise) {
+      var toggle = 1;
+      var dummyNode = document.createTextNode(toggle);
+      new MutationObserver(drainPendingXhrs).observe(dummyNode, {
+        characterData: true
+      });
+    }
+  } else {
+    // this below case applies to web workers too
+    baseEE.on('fn-end', function (args) {
+      // We don't want to try to wrap onreadystatechange from within a
+      // readystatechange callback.
+      if (args[0] && args[0].type === READY_STATE_CHANGE) return;
+      drainPendingXhrs();
+    });
+  }
+  function enqueuePendingXhr(xhr) {
+    pendingXhrs.push(xhr);
+    if (MutationObserver) {
+      if (resolved) {
+        resolved.then(drainPendingXhrs);
+      } else if (setImmediate) {
+        setImmediate(drainPendingXhrs);
+      } else {
+        toggle = -toggle;
+        dummyNode.data = toggle;
+      }
+    }
+  }
+  function drainPendingXhrs() {
+    for (var i = 0; i < pendingXhrs.length; i++) {
+      wrapOnreadystatechange([], pendingXhrs[i]);
+    }
+    if (pendingXhrs.length) pendingXhrs = [];
+  }
+
+  // Use the object these methods are on as their
+  // context store for the event emitter
+  function getObject(args, obj) {
+    return obj;
+  }
+  function copy(from, to) {
+    for (var i in from) {
+      to[i] = from[i];
+    }
+    return to;
+  }
+  return ee;
+}
+
+/**
+ * Returns an event emitter scoped specifically for the `xhr` context. This scoping is a remnant from when all the
+ * features shared the same group in the event, to isolate events between features. It will likely be revisited.
+ * @param {Object} sharedEE - Optional event emitter on which to base the scoped emitter.
+ *     Uses `ee` on the global scope if undefined).
+ * @returns {Object} Scoped event emitter with a debug ID of 'xhr'.
+ */
+export function scopedEE(sharedEE) {
+  return (sharedEE || contextualEE).get('xhr');
+}

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

@@ -0,0 +1,218 @@
+/*
+ * 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 { stringify } from '../../../common/util/stringify';
+import { nullable, numeric, getAddStringContext, addCustomAttributes } from '../../../common/serialize/bel-serializer';
+import { handle } from '../../../common/event-emitter/handle';
+import { getConfigurationValue, getInfo } from '../../../common/config/config';
+import { HarvestScheduler } from '../../../common/harvest/harvest-scheduler';
+import { setDenyList, shouldCollectEvent } from '../../../common/deny-list/deny-list';
+import { AggregateBase } from '../../utils/aggregate-base';
+import { FEATURE_NAME } from '../constants';
+import { drain } from '../../../common/drain/drain';
+import { FEATURE_NAMES } from '../../../loaders/features/features';
+import { SUPPORTABILITY_METRIC_CHANNEL } from '../../metrics/constants';
+export class Aggregate extends AggregateBase {
+  static featureName = FEATURE_NAME;
+  constructor(agentIdentifier, aggregator) {
+    super(agentIdentifier, aggregator, FEATURE_NAME);
+    let ajaxEvents = [];
+    let spaAjaxEvents = {};
+    let sentAjaxEvents = [];
+    let scheduler;
+    const ee = this.ee;
+    const harvestTimeSeconds = getConfigurationValue(agentIdentifier, 'ajax.harvestTimeSeconds') || 10;
+    const MAX_PAYLOAD_SIZE = getConfigurationValue(agentIdentifier, 'ajax.maxPayloadSize') || 1000000;
+
+    // Exposes these methods to browser test files -- future TO DO: can be removed once these fns are extracted from the constructor into class func
+    this.storeXhr = storeXhr;
+    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 => {
+      if (!spaAjaxEvents[interaction.id] || !allAjaxIsEnabled()) return;
+      spaAjaxEvents[interaction.id].forEach(function (item) {
+        // move it from the spaAjaxEvents buffer to the ajaxEvents buffer for harvesting here
+        ajaxEvents.push(item);
+      });
+      delete spaAjaxEvents[interaction.id];
+    });
+    if (allAjaxIsEnabled()) setDenyList(getConfigurationValue(agentIdentifier, 'ajax.deny_list'));
+    register('xhr', storeXhr, this.featureName, this.ee);
+    if (allAjaxIsEnabled()) {
+      scheduler = new HarvestScheduler('events', {
+        onFinished: onEventsHarvestFinished,
+        getPayload: prepareHarvest
+      }, this);
+      ee.on(`drain-${this.featureName}`, () => {
+        scheduler.startTimer(harvestTimeSeconds);
+      });
+    }
+    function storeXhr(params, metrics, startTime, endTime, type) {
+      metrics.time = startTime;
+
+      // send to session traces
+      var hash;
+      if (params.cat) {
+        hash = stringify([params.status, params.cat]);
+      } else {
+        hash = stringify([params.status, params.host, params.pathname]);
+      }
+      handle('bstXhrAgg', ['xhr', hash, params, metrics], undefined, FEATURE_NAMES.sessionTrace, ee);
+
+      // store as metric
+      aggregator.store('xhr', hash, params, metrics);
+      if (!allAjaxIsEnabled()) {
+        return;
+      }
+      if (!shouldCollectEvent(params)) {
+        if (params.hostname === getInfo(agentIdentifier).errorBeacon) {
+          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);
+        }
+        return;
+      }
+      var xhrContext = this;
+      var event = {
+        method: params.method,
+        status: params.status,
+        domain: params.host,
+        path: params.pathname,
+        requestSize: metrics.txSize,
+        responseSize: metrics.rxSize,
+        type: type,
+        startTime: startTime,
+        endTime: endTime,
+        callbackDuration: metrics.cbTime
+      };
+      if (xhrContext.dt) {
+        event.spanId = xhrContext.dt.spanId;
+        event.traceId = xhrContext.dt.traceId;
+        event.spanTimestamp = xhrContext.dt.timestamp;
+      }
+
+      // if the ajax happened inside an interaction, hold it until the interaction finishes
+      if (this.spaNode) {
+        var interactionId = this.spaNode.interaction.id;
+        spaAjaxEvents[interactionId] = spaAjaxEvents[interactionId] || [];
+        spaAjaxEvents[interactionId].push(event);
+      } else {
+        ajaxEvents.push(event);
+      }
+    }
+    function prepareHarvest(options) {
+      options = options || {};
+      if (ajaxEvents.length === 0) {
+        return null;
+      }
+      var payload = getPayload(ajaxEvents, options.maxPayloadSize || MAX_PAYLOAD_SIZE);
+      var payloadObjs = [];
+      for (var i = 0; i < payload.length; i++) {
+        payloadObjs.push({
+          body: {
+            e: payload[i]
+          }
+        });
+      }
+      if (options.retry) {
+        sentAjaxEvents = ajaxEvents.slice();
+      }
+      ajaxEvents = [];
+      return payloadObjs;
+    }
+    function getPayload(events, maxPayloadSize, chunks) {
+      chunks = chunks || 1;
+      var payload = [];
+      var chunkSize = events.length / chunks;
+      var eventChunks = splitChunks(events, chunkSize);
+      var tooBig = false;
+      for (var i = 0; i < eventChunks.length; i++) {
+        var currentChunk = eventChunks[i];
+        if (currentChunk.tooBig(maxPayloadSize)) {
+          if (currentChunk.events.length !== 1) {
+            /* if it is too big BUT it isnt length 1, we can split it down again,
+             else we just want to NOT push it into payload
+             because if it's length 1 and still too big for the maxPayloadSize
+             it cant get any smaller and we dont want to recurse forever */
+            tooBig = true;
+            break;
+          }
+        } else {
+          payload.push(currentChunk.payload);
+        }
+      }
+      // check if the current payload string is too big, if so then run getPayload again with more buckets
+      return tooBig ? getPayload(events, maxPayloadSize, ++chunks) : payload;
+    }
+    function onEventsHarvestFinished(result) {
+      if (result.retry && sentAjaxEvents.length > 0 && allAjaxIsEnabled()) {
+        ajaxEvents = ajaxEvents.concat(sentAjaxEvents);
+        sentAjaxEvents = [];
+      }
+    }
+    function splitChunks(arr, chunkSize) {
+      chunkSize = chunkSize || arr.length;
+      var chunks = [];
+      for (var i = 0, len = arr.length; i < len; i += chunkSize) {
+        chunks.push(new Chunk(arr.slice(i, i + chunkSize)));
+      }
+      return chunks;
+    }
+    function Chunk(events) {
+      this.addString = getAddStringContext(agentIdentifier); // pass agentIdentifier here
+      this.events = events;
+      this.payload = 'bel.7;';
+      for (var i = 0; i < events.length; i++) {
+        var event = events[i];
+        var fields = [numeric(event.startTime), numeric(event.endTime - event.startTime), numeric(0),
+        // callbackEnd
+        numeric(0),
+        // no callbackDuration for non-SPA events
+        this.addString(event.method), numeric(event.status), this.addString(event.domain), this.addString(event.path), numeric(event.requestSize), numeric(event.responseSize), event.type === 'fetch' ? 1 : '', this.addString(0),
+        // nodeId
+        nullable(event.spanId, this.addString, true) +
+        // guid
+        nullable(event.traceId, this.addString, true) +
+        // traceId
+        nullable(event.spanTimestamp, numeric, false) // timestamp
+        ];
+
+        var insert = '2,';
+
+        // add custom attributes
+        var attrParts = addCustomAttributes(getInfo(agentIdentifier).jsAttributes || {}, this.addString);
+        fields.unshift(numeric(attrParts.length));
+        insert += fields.join(',');
+        if (attrParts && attrParts.length > 0) {
+          insert += ';' + attrParts.join(';');
+        }
+        if (i + 1 < events.length) insert += ';';
+        this.payload += insert;
+      }
+      this.tooBig = function (maxPayloadSize) {
+        maxPayloadSize = maxPayloadSize || MAX_PAYLOAD_SIZE;
+        return this.payload.length * 2 > maxPayloadSize;
+      };
+    }
+    function allAjaxIsEnabled() {
+      var enabled = getConfigurationValue(agentIdentifier, 'ajax.enabled');
+      if (enabled === false) {
+        return false;
+      }
+      return true;
+    }
+    drain(this.agentIdentifier, this.featureName);
+  }
+}

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

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

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

@@ -0,0 +1 @@
+export { Instrument as Ajax } from './instrument/index';

package/dist/esm/features/ajax/instrument/distributed-tracing.js

@@ -0,0 +1,137 @@
+/*
+ * Copyright 2020 New Relic Corporation. All rights reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import { getConfiguration, getConfigurationValue, getLoaderConfig } from '../../../common/config/config';
+import { generateSpanId, generateTraceId } from '../../../common/ids/unique-id';
+import { parseUrl } from '../../../common/url/parse-url';
+import { globalScope } from '../../../common/util/global-scope';
+import { stringify } from '../../../common/util/stringify';
+export class DT {
+  constructor(agentIdentifier) {
+    this.agentIdentifier = agentIdentifier;
+    // Binds this class instance context to the following fn used in an external module (exported);
+    //  Alternatively, can make them class field arrow functions, but requires experimental features/plugin for eslint.
+    this.generateTracePayload = this.generateTracePayload.bind(this);
+    this.shouldGenerateTrace = this.shouldGenerateTrace.bind(this);
+  }
+  generateTracePayload(parsedOrigin) {
+    if (!this.shouldGenerateTrace(parsedOrigin)) {
+      return null;
+    }
+    var loader_config = getLoaderConfig(this.agentIdentifier);
+    if (!loader_config) {
+      return null;
+    }
+    var accountId = (loader_config.accountID || '').toString() || null;
+    var agentId = (loader_config.agentID || '').toString() || null;
+    var trustKey = (loader_config.trustKey || '').toString() || null;
+    if (!accountId || !agentId) {
+      return null;
+    }
+    var spanId = generateSpanId();
+    var traceId = generateTraceId();
+    var timestamp = Date.now();
+    var payload = {
+      spanId: spanId,
+      traceId: traceId,
+      timestamp: timestamp
+    };
+    if (parsedOrigin.sameOrigin || this.isAllowedOrigin(parsedOrigin) && this.useTraceContextHeadersForCors()) {
+      payload.traceContextParentHeader = this.generateTraceContextParentHeader(spanId, traceId);
+      payload.traceContextStateHeader = this.generateTraceContextStateHeader(spanId, timestamp, accountId, agentId, trustKey);
+    }
+    if (parsedOrigin.sameOrigin && !this.excludeNewrelicHeader() || !parsedOrigin.sameOrigin && this.isAllowedOrigin(parsedOrigin) && this.useNewrelicHeaderForCors()) {
+      payload.newrelicHeader = this.generateTraceHeader(spanId, traceId, timestamp, accountId, agentId, trustKey);
+    }
+    return payload;
+  }
+  generateTraceContextParentHeader(spanId, traceId) {
+    return '00-' + traceId + '-' + spanId + '-01';
+  }
+  generateTraceContextStateHeader(spanId, timestamp, accountId, appId, trustKey) {
+    var version = 0;
+    var transactionId = '';
+    var parentType = 1;
+    var sampled = '';
+    var priority = '';
+    return trustKey + '@nr=' + version + '-' + parentType + '-' + accountId + '-' + appId + '-' + spanId + '-' + transactionId + '-' + sampled + '-' + priority + '-' + timestamp;
+  }
+  generateTraceHeader(spanId, traceId, timestamp, accountId, appId, trustKey) {
+    var hasBtoa = typeof globalScope?.btoa === 'function';
+    if (!hasBtoa) {
+      return null;
+    }
+    var payload = {
+      v: [0, 1],
+      d: {
+        ty: 'Browser',
+        ac: accountId,
+        ap: appId,
+        id: spanId,
+        tr: traceId,
+        ti: timestamp
+      }
+    };
+    if (trustKey && accountId !== trustKey) {
+      payload.d.tk = trustKey;
+    }
+    return btoa(stringify(payload));
+  }
+
+  // return true if DT is enabled and the origin is allowed, either by being
+  // same-origin, or included in the allowed list
+  shouldGenerateTrace(parsedOrigin) {
+    return this.isDtEnabled() && this.isAllowedOrigin(parsedOrigin);
+  }
+  isAllowedOrigin(parsedOrigin) {
+    var allowed = false;
+    var dtConfig = {};
+    var dt = getConfigurationValue(this.agentIdentifier, 'distributed_tracing');
+    if (dt) {
+      dtConfig = getConfiguration(this.agentIdentifier).distributed_tracing;
+    }
+    if (parsedOrigin.sameOrigin) {
+      allowed = true;
+    } else if (dtConfig.allowed_origins instanceof Array) {
+      for (var i = 0; i < dtConfig.allowed_origins.length; i++) {
+        var allowedOrigin = parseUrl(dtConfig.allowed_origins[i]);
+        if (parsedOrigin.hostname === allowedOrigin.hostname && parsedOrigin.protocol === allowedOrigin.protocol && parsedOrigin.port === allowedOrigin.port) {
+          allowed = true;
+          break;
+        }
+      }
+    }
+    return allowed;
+  }
+  isDtEnabled() {
+    var dt = getConfigurationValue(this.agentIdentifier, 'distributed_tracing');
+    if (dt) {
+      return !!dt.enabled;
+    }
+    return false;
+  }
+
+  // exclude the newrelic header for same-origin calls
+  excludeNewrelicHeader() {
+    var dt = getConfigurationValue(this.agentIdentifier, 'distributed_tracing');
+    if (dt) {
+      return !!dt.exclude_newrelic_header;
+    }
+    return false;
+  }
+  useNewrelicHeaderForCors() {
+    var dt = getConfigurationValue(this.agentIdentifier, 'distributed_tracing');
+    if (dt) {
+      return dt.cors_use_newrelic_header !== false;
+    }
+    return false;
+  }
+  useTraceContextHeadersForCors() {
+    var dt = getConfigurationValue(this.agentIdentifier, 'distributed_tracing');
+    if (dt) {
+      return !!dt.cors_use_tracecontext_headers;
+    }
+    return false;
+  }
+}