@newrelic/browser-agent 1.280.0 → 1.282.0

package/CHANGELOG.md

@@ -3,6 +3,20 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.282.0](https://github.com/newrelic/newrelic-browser-agent/compare/v1.281.0...v1.282.0) (2025-02-13)
+
+
+### Features
+
+* Re-implement wrap-websocket into agent ([#1342](https://github.com/newrelic/newrelic-browser-agent/issues/1342)) ([9b2756f](https://github.com/newrelic/newrelic-browser-agent/commit/9b2756f520cb946192e72d138e14fb4fca75a7b8))
+
+## [1.281.0](https://github.com/newrelic/newrelic-browser-agent/compare/v1.280.0...v1.281.0) (2025-02-04)
+
+
+### Features
+
+* Capture Nearest UserAction Fields ([#1267](https://github.com/newrelic/newrelic-browser-agent/issues/1267)) ([d410937](https://github.com/newrelic/newrelic-browser-agent/commit/d410937983545a6a6aa39c52c3762f621acf1110))
+
 ## [1.280.0](https://github.com/newrelic/newrelic-browser-agent/compare/v1.279.1...v1.280.0) (2025-01-31)
 
 

package/dist/cjs/common/config/init.js

@@ -211,7 +211,8 @@ const model = () => {
     },
     ssl: undefined,
     user_actions: {
-      enabled: true
+      enabled: true,
+      elementAttributes: ['id', 'className', 'tagName', 'type']
     }
   };
 };

package/dist/cjs/common/constants/env.cdn.js

@@ -17,7 +17,7 @@ exports.VERSION = exports.RRWEB_VERSION = exports.DIST_METHOD = exports.BUILD_EN
 /**
  * Exposes the version of the agent
  */
-const VERSION = exports.VERSION = "1.280.0";
+const VERSION = exports.VERSION = "1.282.0";
 
 /**
  * Exposes the build type of the agent

package/dist/cjs/common/constants/env.npm.js

@@ -17,7 +17,7 @@ exports.VERSION = exports.RRWEB_VERSION = exports.DIST_METHOD = exports.BUILD_EN
 /**
  * Exposes the version of the agent
  */
-const VERSION = exports.VERSION = "1.280.0";
+const VERSION = exports.VERSION = "1.282.0";
 
 /**
  * Exposes the build type of the agent

package/dist/cjs/common/dom/selector-path.js

@@ -16,8 +16,11 @@ exports.generateSelectorPath = void 0;
  * @param {boolean} includeClass
  * @returns {string|undefined}
  */
-const generateSelectorPath = elem => {
-  if (!elem) return;
+const generateSelectorPath = (elem, targetFields = []) => {
+  if (!elem) return {
+    path: undefined,
+    nearestFields: {}
+  };
   const getNthOfTypeIndex = node => {
     try {
       let i = 1;
@@ -35,12 +38,16 @@ const generateSelectorPath = elem => {
   };
   let pathSelector = '';
   let index = getNthOfTypeIndex(elem);
+  const nearestFields = {};
   try {
     while (elem?.tagName) {
       const {
         id,
         localName
       } = elem;
+      targetFields.forEach(field => {
+        nearestFields[nearestAttrName(field)] ||= elem[field];
+      });
       const selector = [localName, id ? "#".concat(id) : '', pathSelector ? ">".concat(pathSelector) : ''].join('');
       pathSelector = selector;
       elem = elem.parentNode;
@@ -48,6 +55,16 @@ const generateSelectorPath = elem => {
   } catch (err) {
     // do nothing for now
   }
-  return pathSelector ? index ? "".concat(pathSelector, ":nth-of-type(").concat(index, ")") : pathSelector : undefined;
+  const path = pathSelector ? index ? "".concat(pathSelector, ":nth-of-type(").concat(index, ")") : pathSelector : undefined;
+  return {
+    path,
+    nearestFields
+  };
+  function nearestAttrName(originalFieldName) {
+    /** preserve original renaming structure for pre-existing field maps */
+    if (originalFieldName === 'tagName') originalFieldName = 'tag';
+    if (originalFieldName === 'className') originalFieldName = 'class';
+    return "nearest".concat(originalFieldName.charAt(0).toUpperCase() + originalFieldName.slice(1));
+  }
 };
 exports.generateSelectorPath = generateSelectorPath;

package/dist/cjs/common/wrap/wrap-function.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.copy = copy;
 exports.createWrapperWithEmitter = createWrapperWithEmitter;
 exports.flag = exports.default = void 0;
 var _contextualEe = require("../event-emitter/contextual-ee");

package/dist/cjs/common/wrap/wrap-websocket.js

@@ -30,49 +30,33 @@ function wrapWebSocket(sharedEE) {
       sharedEE.emit(WEBSOCKET_TAG + message, [timestamp, timestamp - createdAt, isLoaded, socketId, ...data]);
     };
   }
-  Object.defineProperty(WrappedWebSocket, 'name', {
-    value: 'WebSocket'
-  });
-  function WrappedWebSocket() {
-    const ws = new originals.WS(...arguments);
-    const socketId = (0, _uniqueId.generateRandomHexString)(6);
-    const report = reporter(socketId);
-    report('new');
-    const events = ['message', 'error', 'open', 'close'];
-    /** add event listeners */
-    events.forEach(evt => {
-      ws.addEventListener(evt, function (e) {
-        report(ADD_EVENT_LISTENER_TAG, {
-          eventType: evt,
-          event: e
+  class WrappedWebSocket extends WebSocket {
+    static name = 'WebSocket';
+    constructor(...args) {
+      super(...args);
+      const socketId = (0, _uniqueId.generateRandomHexString)(6);
+      this.report = reporter(socketId);
+      this.report('new');
+      const events = ['message', 'error', 'open', 'close'];
+      /** add event listeners */
+      events.forEach(evt => {
+        this.addEventListener(evt, function (e) {
+          this.report(ADD_EVENT_LISTENER_TAG, {
+            eventType: evt,
+            event: e
+          });
         });
       });
-    })
-
-    /** could also observe the on-events for runtime processing, but not implemented yet */
-
-    /** observe the static method send, but noteably not close, as that is currently observed with the event listener */;
-    ['send'].forEach(wrapStaticProperty);
-    function wrapStaticProperty(prop) {
-      const originalProp = ws[prop];
-      if (originalProp) {
-        Object.defineProperty(proxiedProp, 'name', {
-          value: prop
-        });
-        function proxiedProp() {
-          report(prop, ...arguments);
-          try {
-            return originalProp.apply(this, arguments);
-          } catch (err) {
-            report(prop + '-err', ...arguments);
-            // rethrow error so we don't effect execution by observing.
-            throw err;
-          }
-        }
-        ws[prop] = proxiedProp;
+    }
+    send(...args) {
+      this.report('send', ...args);
+      try {
+        return super.send(...args);
+      } catch (err) {
+        this.report('send-err', ...args);
+        throw err;
       }
     }
-    return ws;
   }
   _runtime.globalScope.WebSocket = WrappedWebSocket;
   return sharedEE;

package/dist/cjs/features/generic_events/aggregate/index.js

@@ -61,7 +61,7 @@ class Aggregate extends _aggregateBase.AggregateBase {
           });
         }, this.featureName, this.ee);
       }
-      let addUserAction;
+      let addUserAction = () => {/** no-op */};
       if (_runtime.isBrowserScope && agentRef.init.user_actions.enabled) {
         this.userActionAggregator = new _userActionsAggregator.UserActionsAggregator();
         this.harvestOpts.beforeUnload = () => addUserAction?.(this.userActionAggregator.aggregationEvent);
@@ -87,20 +87,27 @@ class Aggregate extends _aggregateBase.AggregateBase {
                 ...((0, _iframe.isIFrameWindow)(window) && {
                   iframe: true
                 }),
-                ...(canTrustTargetAttribute('id') && {
-                  targetId: target.id
-                }),
-                ...(canTrustTargetAttribute('tagName') && {
-                  targetTag: target.tagName
-                }),
-                ...(canTrustTargetAttribute('type') && {
-                  targetType: target.type
-                }),
-                ...(canTrustTargetAttribute('className') && {
-                  targetClass: target.className
-                })
+                ...this.agentRef.init.user_actions.elementAttributes.reduce((acc, field) => {
+                  /** prevent us from capturing an obscenely long value */
+                  if (canTrustTargetAttribute(field)) acc[targetAttrName(field)] = String(target[field]).trim().slice(0, 128);
+                  return acc;
+                }, {}),
+                ...aggregatedUserAction.nearestTargetFields
               });
 
+              /**
+               * Returns the original target field name with `target` prepended and camelCased
+               * @param {string} originalFieldName
+               * @returns {string} the target field name
+               */
+              function targetAttrName(originalFieldName) {
+                /** preserve original renaming structure for pre-existing field maps */
+                if (originalFieldName === 'tagName') originalFieldName = 'tag';
+                if (originalFieldName === 'className') originalFieldName = 'class';
+                /** return the original field name, cap'd and prepended with target to match formatting */
+                return "target".concat(originalFieldName.charAt(0).toUpperCase() + originalFieldName.slice(1));
+              }
+
               /**
                * Only trust attributes that exist on HTML element targets, which excludes the window and the document targets
                * @param {string} attribute The attribute to check for on the target element
@@ -116,7 +123,7 @@ class Aggregate extends _aggregateBase.AggregateBase {
         };
         (0, _registerHandler.registerHandler)('ua', evt => {
           /** the processor will return the previously aggregated event if it has been completed by processing the current event */
-          addUserAction(this.userActionAggregator.process(evt));
+          addUserAction(this.userActionAggregator.process(evt, this.agentRef.init.user_actions.elementAttributes));
         }, this.featureName, this.ee);
       }
 

package/dist/cjs/features/generic_events/aggregate/user-actions/aggregated-user-action.js

@@ -11,13 +11,14 @@ var _constants = require("../../constants");
  */
 
 class AggregatedUserAction {
-  constructor(evt, selectorPath) {
+  constructor(evt, selectorPath, nearestTargetFields) {
     this.event = evt;
     this.count = 1;
     this.originMs = Math.floor(evt.timeStamp);
     this.relativeMs = [0];
     this.selectorPath = selectorPath;
     this.rageClick = undefined;
+    this.nearestTargetFields = nearestTargetFields;
   }
 
   /**

package/dist/cjs/features/generic_events/aggregate/user-actions/user-actions-aggregator.js

@@ -31,9 +31,12 @@ class UserActionsAggregator {
    * @param {Event} evt The event supplied by the addEventListener callback
    * @returns {AggregatedUserAction|undefined} The previous aggregation set if it has been completed by processing the current event
    */
-  process(evt) {
+  process(evt, targetFields) {
     if (!evt) return;
-    const selectorPath = getSelectorPath(evt);
+    const {
+      selectorPath,
+      nearestTargetFields
+    } = getSelectorPath(evt, targetFields);
     const aggregationKey = getAggregationKey(evt, selectorPath);
     if (!!aggregationKey && aggregationKey === this.#aggregationKey) {
       // an aggregation exists already, so lets just continue to increment
@@ -43,7 +46,7 @@ class UserActionsAggregator {
       const finishedEvent = this.#aggregationEvent;
       // then set as this new event aggregation
       this.#aggregationKey = aggregationKey;
-      this.#aggregationEvent = new _aggregatedUserAction.AggregatedUserAction(evt, selectorPath);
+      this.#aggregationEvent = new _aggregatedUserAction.AggregatedUserAction(evt, selectorPath, nearestTargetFields);
       return finishedEvent;
     }
   }
@@ -56,13 +59,24 @@ class UserActionsAggregator {
  * @returns {string}
  */
 exports.UserActionsAggregator = UserActionsAggregator;
-function getSelectorPath(evt) {
+function getSelectorPath(evt, targetFields) {
   let selectorPath;
+  let nearestTargetFields = {};
   if (_constants.OBSERVED_WINDOW_EVENTS.includes(evt.type) || evt.target === window) selectorPath = 'window';else if (evt.target === document) selectorPath = 'document';
   // if still no selectorPath, generate one from target tree that includes elem ids
-  else selectorPath = (0, _selectorPath.generateSelectorPath)(evt.target);
+  else {
+    const {
+      path,
+      nearestFields
+    } = (0, _selectorPath.generateSelectorPath)(evt.target, targetFields);
+    selectorPath = path;
+    nearestTargetFields = nearestFields;
+  }
   // if STILL no selectorPath, it will return undefined which will skip aggregation for this event
-  return selectorPath;
+  return {
+    selectorPath,
+    nearestTargetFields
+  };
 }
 
 /**

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

@@ -13,14 +13,13 @@ var _eventListenerOpts = require("../../../common/event-listener/event-listener-
 var _runtime = require("../../../common/constants/runtime");
 var _aggregateBase = require("../../utils/aggregate-base");
 var _iframe = require("../../../common/dom/iframe");
+var _wrapWebsocket = require("../../../common/wrap/wrap-websocket");
+var _websocketDetection = require("./websocket-detection");
 /**
  * Copyright 2020-2025 New Relic, Inc. All rights reserved.
  * SPDX-License-Identifier: Apache-2.0
  */
 
-// import { WEBSOCKET_TAG } from '../../../common/wrap/wrap-websocket'
-// import { handleWebsocketEvents } from './websocket-detection'
-
 class Aggregate extends _aggregateBase.AggregateBase {
   static featureName = _constants.FEATURE_NAME;
   constructor(agentRef) {
@@ -134,12 +133,11 @@ class Aggregate extends _aggregateBase.AggregateBase {
         subtree: true
       });
     }
-
-    // WATCHABLE_WEB_SOCKET_EVENTS.forEach(tag => {
-    //   registerHandler('buffered-' + WEBSOCKET_TAG + tag, (...args) => {
-    //     handleWebsocketEvents(this.storeSupportabilityMetrics.bind(this), tag, ...args)
-    //   }, this.featureName, this.ee)
-    // })
+    _constants.WATCHABLE_WEB_SOCKET_EVENTS.forEach(tag => {
+      (0, _registerHandler.registerHandler)('buffered-' + _wrapWebsocket.WEBSOCKET_TAG + tag, (...args) => {
+        (0, _websocketDetection.handleWebsocketEvents)(this.storeSupportabilityMetrics.bind(this), tag, ...args);
+      }, this.featureName, this.ee);
+    });
   }
   eachSessionChecks() {
     if (!_runtime.isBrowserScope) return;

package/dist/cjs/features/metrics/constants.js

@@ -3,19 +3,17 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.SUPPORTABILITY_METRIC_CHANNEL = exports.SUPPORTABILITY_METRIC = exports.FEATURE_NAME = exports.CUSTOM_METRIC_CHANNEL = exports.CUSTOM_METRIC = void 0;
+exports.WATCHABLE_WEB_SOCKET_EVENTS = exports.SUPPORTABILITY_METRIC_CHANNEL = exports.SUPPORTABILITY_METRIC = exports.FEATURE_NAME = exports.CUSTOM_METRIC_CHANNEL = exports.CUSTOM_METRIC = void 0;
+var _wrapWebsocket = require("../../common/wrap/wrap-websocket");
 var _features = require("../../loaders/features/features");
 /**
  * Copyright 2020-2025 New Relic, Inc. All rights reserved.
  * SPDX-License-Identifier: Apache-2.0
  */
 
-// import { ADD_EVENT_LISTENER_TAG } from '../../common/wrap/wrap-websocket'
-
 const FEATURE_NAME = exports.FEATURE_NAME = _features.FEATURE_NAMES.metrics;
 const SUPPORTABILITY_METRIC = exports.SUPPORTABILITY_METRIC = 'sm';
 const CUSTOM_METRIC = exports.CUSTOM_METRIC = 'cm';
 const SUPPORTABILITY_METRIC_CHANNEL = exports.SUPPORTABILITY_METRIC_CHANNEL = 'storeSupportabilityMetrics';
 const CUSTOM_METRIC_CHANNEL = exports.CUSTOM_METRIC_CHANNEL = 'storeEventMetrics';
-
-// export const WATCHABLE_WEB_SOCKET_EVENTS = ['new', 'send', 'close', ADD_EVENT_LISTENER_TAG]
+const WATCHABLE_WEB_SOCKET_EVENTS = exports.WATCHABLE_WEB_SOCKET_EVENTS = ['new', 'send', 'close', _wrapWebsocket.ADD_EVENT_LISTENER_TAG];

package/dist/cjs/features/metrics/instrument/index.js

@@ -4,6 +4,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Metrics = exports.Instrument = void 0;
+var _handle = require("../../../common/event-emitter/handle");
+var _wrapWebsocket = require("../../../common/wrap/wrap-websocket");
 var _instrumentBase = require("../../utils/instrument-base");
 var _constants = require("../constants");
 /**
@@ -11,21 +13,16 @@ var _constants = require("../constants");
  * SPDX-License-Identifier: Apache-2.0
  */
 
-// import { handle } from '../../../common/event-emitter/handle'
-// import { WEBSOCKET_TAG, wrapWebSocket } from '../../../common/wrap/wrap-websocket'
-
 class Instrument extends _instrumentBase.InstrumentBase {
   static featureName = _constants.FEATURE_NAME;
   constructor(agentRef, auto = true) {
     super(agentRef, _constants.FEATURE_NAME, auto);
-    // wrapWebSocket(this.ee)
-
-    // WATCHABLE_WEB_SOCKET_EVENTS.forEach((suffix) => {
-    //   this.ee.on(WEBSOCKET_TAG + suffix, (...args) => {
-    //     handle('buffered-' + WEBSOCKET_TAG + suffix, [...args], undefined, this.featureName, this.ee)
-    //   })
-    // })
-
+    (0, _wrapWebsocket.wrapWebSocket)(this.ee);
+    _constants.WATCHABLE_WEB_SOCKET_EVENTS.forEach(suffix => {
+      this.ee.on(_wrapWebsocket.WEBSOCKET_TAG + suffix, (...args) => {
+        (0, _handle.handle)('buffered-' + _wrapWebsocket.WEBSOCKET_TAG + suffix, [...args], undefined, this.featureName, this.ee);
+      });
+    });
     this.importAggregator(agentRef);
   }
 }

package/dist/esm/common/config/init.js

@@ -202,7 +202,8 @@ const model = () => {
     },
     ssl: undefined,
     user_actions: {
-      enabled: true
+      enabled: true,
+      elementAttributes: ['id', 'className', 'tagName', 'type']
     }
   };
 };

package/dist/esm/common/constants/env.cdn.js

@@ -11,7 +11,7 @@
 /**
  * Exposes the version of the agent
  */
-export const VERSION = "1.280.0";
+export const VERSION = "1.282.0";
 
 /**
  * Exposes the build type of the agent

package/dist/esm/common/constants/env.npm.js

@@ -11,7 +11,7 @@
 /**
  * Exposes the version of the agent
  */
-export const VERSION = "1.280.0";
+export const VERSION = "1.282.0";
 
 /**
  * Exposes the build type of the agent

package/dist/esm/common/dom/selector-path.js

@@ -10,8 +10,11 @@
  * @param {boolean} includeClass
  * @returns {string|undefined}
  */
-export const generateSelectorPath = elem => {
-  if (!elem) return;
+export const generateSelectorPath = (elem, targetFields = []) => {
+  if (!elem) return {
+    path: undefined,
+    nearestFields: {}
+  };
   const getNthOfTypeIndex = node => {
     try {
       let i = 1;
@@ -29,12 +32,16 @@ export const generateSelectorPath = elem => {
   };
   let pathSelector = '';
   let index = getNthOfTypeIndex(elem);
+  const nearestFields = {};
   try {
     while (elem?.tagName) {
       const {
         id,
         localName
       } = elem;
+      targetFields.forEach(field => {
+        nearestFields[nearestAttrName(field)] ||= elem[field];
+      });
       const selector = [localName, id ? "#".concat(id) : '', pathSelector ? ">".concat(pathSelector) : ''].join('');
       pathSelector = selector;
       elem = elem.parentNode;
@@ -42,5 +49,15 @@ export const generateSelectorPath = elem => {
   } catch (err) {
     // do nothing for now
   }
-  return pathSelector ? index ? "".concat(pathSelector, ":nth-of-type(").concat(index, ")") : pathSelector : undefined;
+  const path = pathSelector ? index ? "".concat(pathSelector, ":nth-of-type(").concat(index, ")") : pathSelector : undefined;
+  return {
+    path,
+    nearestFields
+  };
+  function nearestAttrName(originalFieldName) {
+    /** preserve original renaming structure for pre-existing field maps */
+    if (originalFieldName === 'tagName') originalFieldName = 'tag';
+    if (originalFieldName === 'className') originalFieldName = 'class';
+    return "nearest".concat(originalFieldName.charAt(0).toUpperCase() + originalFieldName.slice(1));
+  }
 };

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

@@ -173,7 +173,7 @@ function report(args, emitter) {
  *     Defaults to the global event emitter.
  * @returns {object} - The destination founction or object with copied properties.
  */
-function copy(from, to, emitter) {
+export function copy(from, to, emitter) {
   if (Object.defineProperty && Object.keys) {
     // Create accessors that proxy to actual function
     try {

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

@@ -22,49 +22,33 @@ export function wrapWebSocket(sharedEE) {
       sharedEE.emit(WEBSOCKET_TAG + message, [timestamp, timestamp - createdAt, isLoaded, socketId, ...data]);
     };
   }
-  Object.defineProperty(WrappedWebSocket, 'name', {
-    value: 'WebSocket'
-  });
-  function WrappedWebSocket() {
-    const ws = new originals.WS(...arguments);
-    const socketId = generateRandomHexString(6);
-    const report = reporter(socketId);
-    report('new');
-    const events = ['message', 'error', 'open', 'close'];
-    /** add event listeners */
-    events.forEach(evt => {
-      ws.addEventListener(evt, function (e) {
-        report(ADD_EVENT_LISTENER_TAG, {
-          eventType: evt,
-          event: e
+  class WrappedWebSocket extends WebSocket {
+    static name = 'WebSocket';
+    constructor(...args) {
+      super(...args);
+      const socketId = generateRandomHexString(6);
+      this.report = reporter(socketId);
+      this.report('new');
+      const events = ['message', 'error', 'open', 'close'];
+      /** add event listeners */
+      events.forEach(evt => {
+        this.addEventListener(evt, function (e) {
+          this.report(ADD_EVENT_LISTENER_TAG, {
+            eventType: evt,
+            event: e
+          });
         });
       });
-    })
-
-    /** could also observe the on-events for runtime processing, but not implemented yet */
-
-    /** observe the static method send, but noteably not close, as that is currently observed with the event listener */;
-    ['send'].forEach(wrapStaticProperty);
-    function wrapStaticProperty(prop) {
-      const originalProp = ws[prop];
-      if (originalProp) {
-        Object.defineProperty(proxiedProp, 'name', {
-          value: prop
-        });
-        function proxiedProp() {
-          report(prop, ...arguments);
-          try {
-            return originalProp.apply(this, arguments);
-          } catch (err) {
-            report(prop + '-err', ...arguments);
-            // rethrow error so we don't effect execution by observing.
-            throw err;
-          }
-        }
-        ws[prop] = proxiedProp;
+    }
+    send(...args) {
+      this.report('send', ...args);
+      try {
+        return super.send(...args);
+      } catch (err) {
+        this.report('send-err', ...args);
+        throw err;
       }
     }
-    return ws;
   }
   globalScope.WebSocket = WrappedWebSocket;
   return sharedEE;

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

@@ -54,7 +54,7 @@ export class Aggregate extends AggregateBase {
           });
         }, this.featureName, this.ee);
       }
-      let addUserAction;
+      let addUserAction = () => {/** no-op */};
       if (isBrowserScope && agentRef.init.user_actions.enabled) {
         this.userActionAggregator = new UserActionsAggregator();
         this.harvestOpts.beforeUnload = () => addUserAction?.(this.userActionAggregator.aggregationEvent);
@@ -80,20 +80,27 @@ export class Aggregate extends AggregateBase {
                 ...(isIFrameWindow(window) && {
                   iframe: true
                 }),
-                ...(canTrustTargetAttribute('id') && {
-                  targetId: target.id
-                }),
-                ...(canTrustTargetAttribute('tagName') && {
-                  targetTag: target.tagName
-                }),
-                ...(canTrustTargetAttribute('type') && {
-                  targetType: target.type
-                }),
-                ...(canTrustTargetAttribute('className') && {
-                  targetClass: target.className
-                })
+                ...this.agentRef.init.user_actions.elementAttributes.reduce((acc, field) => {
+                  /** prevent us from capturing an obscenely long value */
+                  if (canTrustTargetAttribute(field)) acc[targetAttrName(field)] = String(target[field]).trim().slice(0, 128);
+                  return acc;
+                }, {}),
+                ...aggregatedUserAction.nearestTargetFields
               });
 
+              /**
+               * Returns the original target field name with `target` prepended and camelCased
+               * @param {string} originalFieldName
+               * @returns {string} the target field name
+               */
+              function targetAttrName(originalFieldName) {
+                /** preserve original renaming structure for pre-existing field maps */
+                if (originalFieldName === 'tagName') originalFieldName = 'tag';
+                if (originalFieldName === 'className') originalFieldName = 'class';
+                /** return the original field name, cap'd and prepended with target to match formatting */
+                return "target".concat(originalFieldName.charAt(0).toUpperCase() + originalFieldName.slice(1));
+              }
+
               /**
                * Only trust attributes that exist on HTML element targets, which excludes the window and the document targets
                * @param {string} attribute The attribute to check for on the target element
@@ -109,7 +116,7 @@ export class Aggregate extends AggregateBase {
         };
         registerHandler('ua', evt => {
           /** the processor will return the previously aggregated event if it has been completed by processing the current event */
-          addUserAction(this.userActionAggregator.process(evt));
+          addUserAction(this.userActionAggregator.process(evt, this.agentRef.init.user_actions.elementAttributes));
         }, this.featureName, this.ee);
       }
 

package/dist/esm/features/generic_events/aggregate/user-actions/aggregated-user-action.js

@@ -4,13 +4,14 @@
  */
 import { RAGE_CLICK_THRESHOLD_EVENTS, RAGE_CLICK_THRESHOLD_MS } from '../../constants';
 export class AggregatedUserAction {
-  constructor(evt, selectorPath) {
+  constructor(evt, selectorPath, nearestTargetFields) {
     this.event = evt;
     this.count = 1;
     this.originMs = Math.floor(evt.timeStamp);
     this.relativeMs = [0];
     this.selectorPath = selectorPath;
     this.rageClick = undefined;
+    this.nearestTargetFields = nearestTargetFields;
   }
 
   /**