@coralogix/browser 3.20.0 → 3.21.0

package/CHANGELOG.md

@@ -1,3 +1,22 @@
+## 3.21.0 (2026-08-09)
+
+### 🚀 Features
+
+- Upgrade the session recording engine to rrweb 2.1.1
+
+### 🩹 Fixes
+
+- Keep session recording working when another library on the page replaces `MutationObserver`
+- Record style changes correctly for CSS rules nested inside `@media` / `@supports`
+- Prevent recording errors on browsers without WebGL support
+- Resolve `url()` references that contain a fragment in captured stylesheets
+
+## 3.20.1 (2026-07-28)
+
+### 🩹 Fixes
+
+- Improve user-interaction tracking for product analytics
+
 ## 3.20.0 (2026-07-21)
 
 ### 🚀 Features

package/index.esm2.js

@@ -1477,10 +1477,56 @@ function cxCancelAnimationFrame(id) {
     var originalCaf = getZoneJsOriginalDom(browserWindow, 'cancelAnimationFrame');
     originalCaf.call(browserWindow, id);
 }
+var RR_BLOCK_CLASS = 'rr-block';
+var untaintedMutationObserver;
+function isNativeFunction(fn) {
+    try {
+        return (typeof fn === 'function' &&
+            Function.prototype.toString.call(fn).indexOf('[native code]') !== -1);
+    }
+    catch (_a) {
+        return false;
+    }
+}
+function getUntaintedMutationObserver() {
+    if (untaintedMutationObserver !== undefined) {
+        return untaintedMutationObserver;
+    }
+    var doc = getBrowserWindow().document;
+    if (!doc || !doc.body) {
+        return null;
+    }
+    untaintedMutationObserver = null;
+    try {
+        var iframe = doc.createElement('iframe');
+        iframe.style.display = 'none';
+        iframe.setAttribute('aria-hidden', 'true');
+        iframe.className = RR_BLOCK_CLASS;
+        doc.body.appendChild(iframe);
+        var frameWindow = iframe.contentWindow;
+        var frameCtor = frameWindow === null || frameWindow === void 0 ? void 0 : frameWindow['MutationObserver'];
+        if (typeof frameCtor === 'function') {
+            untaintedMutationObserver = frameCtor;
+        }
+        else {
+            iframe.remove();
+        }
+    }
+    catch (_a) {
+    }
+    return untaintedMutationObserver;
+}
 function createCxMutationObserver(callback) {
     var browserWindow = getBrowserWindow();
+    if (!shouldRunOutsideZone()) {
+        return new browserWindow.MutationObserver(callback);
+    }
     var OriginalMutationObserver = getZoneJsOriginalDom(browserWindow, 'MutationObserver');
-    return new OriginalMutationObserver(callback);
+    if (isNativeFunction(OriginalMutationObserver)) {
+        return new OriginalMutationObserver(callback);
+    }
+    var UntaintedMutationObserver = getUntaintedMutationObserver();
+    return new (UntaintedMutationObserver !== null && UntaintedMutationObserver !== void 0 ? UntaintedMutationObserver : OriginalMutationObserver)(callback);
 }
 function cxRunOutsideZone(fn) {
     if (!shouldRunOutsideZone()) {
@@ -2144,8 +2190,6 @@ function addEventListeners(eventTarget, eventNames, listener, _a) {
 
 var CX_ACTION_NAME_ATTRIBUTE = 'data-cx-action-name';
 var DATA_TEST_ATTRIBUTE = 'data-test';
-var DATA_TESTID_ATTRIBUTE = 'data-testid';
-var DATA_TEST_ID_ATTRIBUTE = 'data-test-id';
 var RR_IS_PASSWORD_ATTRIBUTE = 'data-rr-is-password';
 
 var knownPasswordInputs = new WeakSet();
@@ -2197,16 +2241,18 @@ function handleMutations(mutations) {
     }
 }
 
-var PARENT_SEARCH_DEPTH = 5;
-var ACTION_NAME_SEARCH_DEPTH = 10;
+var ANCESTOR_SEARCH_DEPTH = 5;
 var POINTER_CURSOR = 'pointer';
+var TEXT_CURSOR = 'text';
+var BODY_NODE_NAME = 'BODY';
 var CLICKABLE_SELECTOR = 'a, button, input, select, textarea, label, summary, option, li, ' +
     '[role="button"], [role="link"], [role="tab"], ' +
     '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"], ' +
     '[role="checkbox"], [role="radio"], [role="switch"], ' +
-    '[role="option"], [role="combobox"]';
+    '[role="option"], [role="combobox"], [contenteditable]:not([contenteditable="false"]), ' +
+    '[role="textbox"], [role="searchbox"], [role="combobox"]';
 function getAttributeFromAncestors(element, attr, depth) {
-    if (depth === void 0) { depth = PARENT_SEARCH_DEPTH; }
+    if (depth === void 0) { depth = ANCESTOR_SEARCH_DEPTH; }
     if (!element || depth <= 0)
         return '';
     var value = element.getAttribute(attr);
@@ -2215,7 +2261,12 @@ function getAttributeFromAncestors(element, attr, depth) {
     return getAttributeFromAncestors(element.parentElement, attr, depth - 1);
 }
 function extractActionName(el) {
-    return getAttributeFromAncestors(el, CX_ACTION_NAME_ATTRIBUTE, ACTION_NAME_SEARCH_DEPTH);
+    if (!el || el.tagName === BODY_NODE_NAME)
+        return '';
+    var value = el.getAttribute(CX_ACTION_NAME_ATTRIBUTE);
+    if (value)
+        return value;
+    return extractActionName(el.parentElement);
 }
 function extractAriaLabel(el) {
     return getAttributeFromAncestors(el, ARIA_LABEL_ATTRIBUTE);
@@ -2227,25 +2278,61 @@ function extractResolvedName(_a) {
     var element = _a.element, config = _a.config, actionName = _a.actionName, ariaLabel = _a.ariaLabel;
     if (!element)
         return '';
-    if (actionName)
-        return actionName;
-    if (isElementMasked(element, config))
-        return MASKED_TEXT;
-    return (ariaLabel || getPlaceholder(element) || getInnerText(element) || '');
+    var resolveName = actionName ||
+        maskedTextIfMasked(element, config) ||
+        resolveFallbackName(element, ariaLabel, ANCESTOR_SEARCH_DEPTH);
+    return normalizeInteractionText(resolveName);
+}
+function maskedTextIfMasked(element, config) {
+    return isElementMasked(element, config) ? MASKED_TEXT : '';
+}
+function resolveFallbackName(element, ariaLabel, depth) {
+    var _a;
+    if (!element || element.nodeName === BODY_NODE_NAME)
+        return '';
+    var resolvedName = getLabelText(element) ||
+        ariaLabel ||
+        getPlaceholder(element) ||
+        getInnerText(element);
+    if (resolvedName)
+        return resolvedName;
+    if ((_a = element.matches) === null || _a === void 0 ? void 0 : _a.call(element, CLICKABLE_SELECTOR))
+        return '';
+    var parent = element.parentElement;
+    if (depth <= 0 || !parent || parent.nodeName === BODY_NODE_NAME)
+        return '';
+    return resolveFallbackName(parent, ariaLabel, depth - 1);
+}
+function getLabelText(element) {
+    var _a;
+    if (!(element instanceof HTMLInputElement ||
+        element instanceof HTMLTextAreaElement ||
+        element instanceof HTMLSelectElement)) {
+        return '';
+    }
+    var label = (_a = element.labels) === null || _a === void 0 ? void 0 : _a[0];
+    return label ? getTextualContent(label) : '';
 }
 function getPlaceholder(element) {
-    if (element instanceof HTMLInputElement || element instanceof HTMLTextAreaElement) {
+    if (element instanceof HTMLInputElement ||
+        element instanceof HTMLTextAreaElement) {
         return element.placeholder || '';
     }
     return '';
 }
-function getInnerText(clickableElement) {
-    if (!clickableElement)
+function getInnerText(element) {
+    if (!element)
         return '';
-    return clickableElement instanceof HTMLElement
-        ? clickableElement.innerText || ''
+    return element instanceof HTMLElement
+        ? normalizeInteractionText(element.innerText || '')
         : '';
 }
+function normalizeInteractionText(text) {
+    return text
+        .slice(0, MAX_INTERACTION_ELEMENT_SIZE)
+        .replace(/\s+/g, ' ')
+        .trim();
+}
 function extractMaskedOrTextContent(clickableElement, config) {
     if (!clickableElement)
         return '';
@@ -2253,7 +2340,7 @@ function extractMaskedOrTextContent(clickableElement, config) {
 }
 function getMaskedOrTextualContent(element, config) {
     if (shouldMaskElement(element, config.maskInputTypes, config.maskClass) ||
-        isParentMasked(element, config.maskClass, PARENT_SEARCH_DEPTH)) {
+        isParentMasked(element, config.maskClass, ANCESTOR_SEARCH_DEPTH)) {
         return MASKED_TEXT;
     }
     var maskedChild = findMaskedChildren(element, config);
@@ -2263,14 +2350,22 @@ function getMaskedOrTextualContent(element, config) {
     return getTextualContent(element);
 }
 function getTextualContent(element) {
-    if (element instanceof HTMLInputElement) {
-        return element.value || '';
+    var _a;
+    if (element instanceof HTMLInputElement ||
+        element instanceof HTMLTextAreaElement) {
+        return normalizeInteractionText(element.value || '');
+    }
+    if (element instanceof HTMLSelectElement) {
+        var selectedIndex = element.selectedIndex, options = element.options;
+        return normalizeInteractionText(((_a = options[selectedIndex]) === null || _a === void 0 ? void 0 : _a.text) || '');
     }
-    return 'innerText' in element ? element.innerText : '';
+    return 'innerText' in element
+        ? normalizeInteractionText(element.innerText)
+        : '';
 }
 function isElementMasked(element, config) {
     return (shouldMaskElement(element, config.maskInputTypes, config.maskClass) ||
-        isParentMasked(element, config.maskClass, PARENT_SEARCH_DEPTH));
+        isParentMasked(element, config.maskClass, ANCESTOR_SEARCH_DEPTH));
 }
 function shouldMaskElement(element, maskInputTypes, maskClass) {
     if (!element)
@@ -2303,7 +2398,7 @@ function isMaskedByClass(className, maskClass) {
     return className.includes(maskClass);
 }
 function isParentMasked(element, maskClass, maxDepth) {
-    if (maxDepth === void 0) { maxDepth = PARENT_SEARCH_DEPTH; }
+    if (maxDepth === void 0) { maxDepth = ANCESTOR_SEARCH_DEPTH; }
     if (!element || maxDepth <= 0) {
         return false;
     }
@@ -2326,16 +2421,23 @@ function findSemanticClickable(element, maxDepth) {
         return element;
     return findSemanticClickable(element.parentElement, maxDepth - 1);
 }
-function getClickableElement(element) {
-    var _a;
+function findAffordanceClickable(element) {
+    var _a, _b;
     if (!element)
         return null;
-    return ((_a = getComputedStyle(element)) === null || _a === void 0 ? void 0 : _a.cursor) === POINTER_CURSOR ? element : null;
+    var cursor = (_a = getComputedStyle(element)) === null || _a === void 0 ? void 0 : _a.cursor;
+    var isPointer = cursor === POINTER_CURSOR;
+    var isText = cursor === TEXT_CURSOR;
+    var isContentEditable = element instanceof HTMLElement && element.isContentEditable;
+    var active = CxGlobal.document.activeElement;
+    var isFocused = (_b = active === null || active === void 0 ? void 0 : active.matches(CLICKABLE_SELECTOR)) !== null && _b !== void 0 ? _b : false;
+    var isInteractive = isPointer || isContentEditable || isFocused || isText;
+    return isInteractive ? element : null;
 }
 function findClickableElement(element, maxDepth) {
     var _a;
-    if (maxDepth === void 0) { maxDepth = PARENT_SEARCH_DEPTH; }
-    return ((_a = findSemanticClickable(element, maxDepth)) !== null && _a !== void 0 ? _a : getClickableElement(element));
+    if (maxDepth === void 0) { maxDepth = ANCESTOR_SEARCH_DEPTH; }
+    return ((_a = findSemanticClickable(element, maxDepth)) !== null && _a !== void 0 ? _a : findAffordanceClickable(element));
 }
 
 var RAGE_CLICK_THRESHOLD = 3;
@@ -2378,12 +2480,6 @@ var RageClickTracker = (function () {
 }());
 
 var SHADOW_DOM_MARKER = '::shadow ';
-var STABLE_ATTRIBUTES = [
-    CX_ACTION_NAME_ATTRIBUTE,
-    DATA_TEST_ATTRIBUTE,
-    DATA_TESTID_ATTRIBUTE,
-    DATA_TEST_ID_ATTRIBUTE,
-];
 var ESCAPE_FREE_CLASS_NAME = /^[a-zA-Z_-][a-zA-Z0-9_-]*$/;
 var GENERATED_VALUE_PATTERNS = [
     /^\d/,
@@ -2430,7 +2526,11 @@ function getSubtreeSelector(target, root) {
 function getUniqueSegment(element, root, childSelector) {
     var e_1, _a;
     try {
-        for (var _b = __values$1([getAttributeSegment(element), getIdSegment(element)]), _c = _b.next(); !_c.done; _c = _b.next()) {
+        for (var _b = __values$1([
+            getActionNameSegment(element),
+            getIdSegment(element),
+            getTestIdSegment(element),
+        ]), _c = _b.next(); !_c.done; _c = _b.next()) {
             var segment = _c.value;
             if (segment && isUnique(root, joinWithChild(segment, childSelector))) {
                 return segment;
@@ -2449,7 +2549,7 @@ function getUniqueSegment(element, root, childSelector) {
 function getLevelSegment(element, childSelector) {
     var e_2, _a;
     var candidates = [
-        getAttributeSegment(element),
+        getActionNameSegment(element),
         getStableClassSegment(element),
         element.tagName,
     ];
@@ -2470,29 +2570,23 @@ function getLevelSegment(element, childSelector) {
     }
     return "".concat(element.tagName, ":nth-of-type(").concat(nthOfTypeIndex(element), ")");
 }
-function getAttributeSegment(element) {
-    var e_3, _a;
-    try {
-        for (var STABLE_ATTRIBUTES_1 = __values$1(STABLE_ATTRIBUTES), STABLE_ATTRIBUTES_1_1 = STABLE_ATTRIBUTES_1.next(); !STABLE_ATTRIBUTES_1_1.done; STABLE_ATTRIBUTES_1_1 = STABLE_ATTRIBUTES_1.next()) {
-            var attribute = STABLE_ATTRIBUTES_1_1.value;
-            var value = element.getAttribute(attribute);
-            if (value) {
-                return "".concat(element.tagName, "[").concat(attribute, "=\"").concat(CSS.escape(value), "\"]");
-            }
-        }
-    }
-    catch (e_3_1) { e_3 = { error: e_3_1 }; }
-    finally {
-        try {
-            if (STABLE_ATTRIBUTES_1_1 && !STABLE_ATTRIBUTES_1_1.done && (_a = STABLE_ATTRIBUTES_1.return)) _a.call(STABLE_ATTRIBUTES_1);
-        }
-        finally { if (e_3) throw e_3.error; }
-    }
-    return undefined;
+function getActionNameSegment(element) {
+    var value = element.getAttribute(CX_ACTION_NAME_ATTRIBUTE);
+    return value
+        ? "".concat(element.tagName, "[").concat(CX_ACTION_NAME_ATTRIBUTE, "=\"").concat(CSS.escape(value), "\"]")
+        : undefined;
 }
+var CONTAINS_DIGIT = /\d/;
 function getIdSegment(element) {
-    return element.id && !isUnstableValue(element.id)
-        ? "#".concat(CSS.escape(element.id))
+    var id = element.id;
+    return id && !isUnstableValue(id) && !CONTAINS_DIGIT.test(id)
+        ? "#".concat(CSS.escape(id))
+        : undefined;
+}
+function getTestIdSegment(element) {
+    var value = element.getAttribute(DATA_TEST_ATTRIBUTE);
+    return value && !isUnstableValue(value) && !CONTAINS_DIGIT.test(value)
+        ? "".concat(element.tagName, "[").concat(DATA_TEST_ATTRIBUTE, "=\"").concat(CSS.escape(value), "\"]")
         : undefined;
 }
 function getStableClassSegment(element) {
@@ -2511,7 +2605,7 @@ function isUnique(root, selector) {
     return root.querySelectorAll(selector).length === 1;
 }
 function isUniqueAmongSiblings(element, segment, childSelector) {
-    var e_4, _a;
+    var e_3, _a;
     var _b, _c;
     var siblings = (_c = (_b = element.parentElement) === null || _b === void 0 ? void 0 : _b.children) !== null && _c !== void 0 ? _c : [];
     try {
@@ -2526,12 +2620,12 @@ function isUniqueAmongSiblings(element, segment, childSelector) {
             }
         }
     }
-    catch (e_4_1) { e_4 = { error: e_4_1 }; }
+    catch (e_3_1) { e_3 = { error: e_3_1 }; }
     finally {
         try {
             if (siblings_1_1 && !siblings_1_1.done && (_a = siblings_1.return)) _a.call(siblings_1);
         }
-        finally { if (e_4) throw e_4.error; }
+        finally { if (e_3) throw e_3.error; }
     }
     return true;
 }
@@ -2594,7 +2688,7 @@ var CoralogixUserInteractionInstrumentation = (function (_super) {
                 var ariaLabel = extractAriaLabel(eventTarget);
                 var testId = extractTestId(eventTarget);
                 var resolvedName = extractResolvedName({
-                    element: clickableElement !== null && clickableElement !== void 0 ? clickableElement : eventTarget,
+                    element: eventTarget,
                     config: config,
                     actionName: cxActionName,
                     ariaLabel: ariaLabel,
@@ -2615,15 +2709,9 @@ var CoralogixUserInteractionInstrumentation = (function (_super) {
                     [CoralogixAttributes.ELEMENT_ID, id],
                     [CoralogixAttributes.ELEMENT_CLASSES, getClassName(eventTarget)],
                     [CoralogixAttributes.TARGET_ELEMENT_TYPE, type],
-                    [
-                        CoralogixAttributes.ELEMENT_INNER_TEXT,
-                        elementText === null || elementText === void 0 ? void 0 : elementText.slice(0, MAX_INTERACTION_ELEMENT_SIZE),
-                    ],
+                    [CoralogixAttributes.ELEMENT_INNER_TEXT, elementText],
                     [CoralogixAttributes.TARGET_ELEMENT, nodeName],
-                    [
-                        CoralogixAttributes.RESOLVED_NAME,
-                        resolvedName === null || resolvedName === void 0 ? void 0 : resolvedName.slice(0, MAX_INTERACTION_ELEMENT_SIZE),
-                    ],
+                    [CoralogixAttributes.RESOLVED_NAME, resolvedName],
                     [CoralogixAttributes.CX_ACTION_NAME, cxActionName],
                     [CoralogixAttributes.ARIA_LABEL, ariaLabel],
                     [CoralogixAttributes.TEST_ID, testId],
@@ -5044,7 +5132,7 @@ function resolveUrlBlueprinters(urlBlueprinters) {
     return resolvedUrlBlueprinters;
 }
 
-var SDK_VERSION = '3.20.0';
+var SDK_VERSION = '3.21.0';
 
 function shouldDropEvent(cxRumEvent, options) {
     if (isDocumentErrorWithoutMessage(cxRumEvent)) {
@@ -5103,12 +5191,13 @@ function validateBeforeSendResult(beforeSendResult) {
     return beforeSendResult;
 }
 function cxRumEventToEditable(cxRumEvent) {
-    var _a = cxRumEvent.session_context, user_id = _a.user_id, user_name = _a.user_name, user_email = _a.user_email, account_id = _a.account_id, user_metadata = _a.user_metadata; cxRumEvent.browser_sdk; cxRumEvent.timestamp; cxRumEvent.isNavigationEvent; cxRumEvent.isSnapshotEvent; cxRumEvent.view_number; var rest = __rest(cxRumEvent, ["session_context", "browser_sdk", "timestamp", "isNavigationEvent", "isSnapshotEvent", "view_number"]);
+    var _a = cxRumEvent.session_context, user_id = _a.user_id, user_name = _a.user_name, user_email = _a.user_email, account_id = _a.account_id, account_name = _a.account_name, user_metadata = _a.user_metadata; cxRumEvent.browser_sdk; cxRumEvent.timestamp; cxRumEvent.isNavigationEvent; cxRumEvent.isSnapshotEvent; cxRumEvent.view_number; var rest = __rest(cxRumEvent, ["session_context", "browser_sdk", "timestamp", "isNavigationEvent", "isSnapshotEvent", "view_number"]);
     return __assign(__assign({}, rest), { session_context: {
             user_id: user_id,
             user_email: user_email,
             user_name: user_name,
             account_id: account_id,
+            account_name: account_name,
             user_metadata: user_metadata,
         } });
 }
@@ -5161,7 +5250,7 @@ function flattenToAttributes(obj, prefix) {
 function buildRumContextAttributes(cxRumEvent, resolvedLabels) {
     var session_context = cxRumEvent.session_context, page_context = cxRumEvent.page_context, event_context = cxRumEvent.event_context, error_context = cxRumEvent.error_context, network_request_context = cxRumEvent.network_request_context;
     var prefixedLabels = flattenToAttributes(resolvedLabels, 'cx_rum.labels.');
-    return buildCxRumSpanAttributes(__assign(__assign({ 'cx_rum.browser_sdk.version': cxRumEvent.browser_sdk.version, 'cx_rum.platform': cxRumEvent.platform, 'cx_rum.environment': cxRumEvent.environment, 'cx_rum.version_metadata.app_name': cxRumEvent.version_metadata.app_name, 'cx_rum.version_metadata.app_version': cxRumEvent.version_metadata.app_version }, prefixedLabels), { 'cx_rum.session_context.session_id': session_context === null || session_context === void 0 ? void 0 : session_context.session_id, 'cx_rum.session_context.session_creation_date': session_context === null || session_context === void 0 ? void 0 : session_context.session_creation_date, 'cx_rum.session_context.hasRecording': session_context === null || session_context === void 0 ? void 0 : session_context.hasRecording, 'cx_rum.session_context.os': session_context === null || session_context === void 0 ? void 0 : session_context.os, 'cx_rum.session_context.osVersion': session_context === null || session_context === void 0 ? void 0 : session_context.osVersion, 'cx_rum.session_context.browser': session_context === null || session_context === void 0 ? void 0 : session_context.browser, 'cx_rum.session_context.browserVersion': session_context === null || session_context === void 0 ? void 0 : session_context.browserVersion, 'cx_rum.session_context.device': session_context === null || session_context === void 0 ? void 0 : session_context.device, 'cx_rum.session_context.user_agent': session_context === null || session_context === void 0 ? void 0 : session_context.user_agent, 'cx_rum.session_context.user_email': session_context === null || session_context === void 0 ? void 0 : session_context.user_email, 'cx_rum.session_context.user_id': session_context === null || session_context === void 0 ? void 0 : session_context.user_id, 'cx_rum.session_context.user_name': session_context === null || session_context === void 0 ? void 0 : session_context.user_name, 'cx_rum.session_context.account_id': session_context === null || session_context === void 0 ? void 0 : session_context.account_id, 'cx_rum.page_context.page_fragments': page_context === null || page_context === void 0 ? void 0 : page_context.page_fragments, 'cx_rum.page_context.page_url_blueprint': page_context === null || page_context === void 0 ? void 0 : page_context.page_url_blueprint, 'cx_rum.event_context.type': event_context === null || event_context === void 0 ? void 0 : event_context.type, 'cx_rum.event_context.severity': event_context === null || event_context === void 0 ? void 0 : event_context.severity, 'cx_rum.error_context.error_type': error_context === null || error_context === void 0 ? void 0 : error_context.error_type, 'cx_rum.error_context.error_message': error_context === null || error_context === void 0 ? void 0 : error_context.error_message, 'cx_rum.network_request_context.fragments': network_request_context === null || network_request_context === void 0 ? void 0 : network_request_context.fragments, 'cx_rum.network_request_context.url': network_request_context === null || network_request_context === void 0 ? void 0 : network_request_context.url, 'cx_rum.network_request_context.status_code': network_request_context === null || network_request_context === void 0 ? void 0 : network_request_context.status_code, 'cx_rum.network_request_context.method': network_request_context === null || network_request_context === void 0 ? void 0 : network_request_context.method }));
+    return buildCxRumSpanAttributes(__assign(__assign({ 'cx_rum.browser_sdk.version': cxRumEvent.browser_sdk.version, 'cx_rum.platform': cxRumEvent.platform, 'cx_rum.environment': cxRumEvent.environment, 'cx_rum.version_metadata.app_name': cxRumEvent.version_metadata.app_name, 'cx_rum.version_metadata.app_version': cxRumEvent.version_metadata.app_version }, prefixedLabels), { 'cx_rum.session_context.session_id': session_context === null || session_context === void 0 ? void 0 : session_context.session_id, 'cx_rum.session_context.session_creation_date': session_context === null || session_context === void 0 ? void 0 : session_context.session_creation_date, 'cx_rum.session_context.hasRecording': session_context === null || session_context === void 0 ? void 0 : session_context.hasRecording, 'cx_rum.session_context.os': session_context === null || session_context === void 0 ? void 0 : session_context.os, 'cx_rum.session_context.osVersion': session_context === null || session_context === void 0 ? void 0 : session_context.osVersion, 'cx_rum.session_context.browser': session_context === null || session_context === void 0 ? void 0 : session_context.browser, 'cx_rum.session_context.browserVersion': session_context === null || session_context === void 0 ? void 0 : session_context.browserVersion, 'cx_rum.session_context.device': session_context === null || session_context === void 0 ? void 0 : session_context.device, 'cx_rum.session_context.user_agent': session_context === null || session_context === void 0 ? void 0 : session_context.user_agent, 'cx_rum.session_context.user_email': session_context === null || session_context === void 0 ? void 0 : session_context.user_email, 'cx_rum.session_context.user_id': session_context === null || session_context === void 0 ? void 0 : session_context.user_id, 'cx_rum.session_context.user_name': session_context === null || session_context === void 0 ? void 0 : session_context.user_name, 'cx_rum.session_context.account_id': session_context === null || session_context === void 0 ? void 0 : session_context.account_id, 'cx_rum.session_context.account_name': session_context === null || session_context === void 0 ? void 0 : session_context.account_name, 'cx_rum.page_context.page_fragments': page_context === null || page_context === void 0 ? void 0 : page_context.page_fragments, 'cx_rum.page_context.page_url_blueprint': page_context === null || page_context === void 0 ? void 0 : page_context.page_url_blueprint, 'cx_rum.event_context.type': event_context === null || event_context === void 0 ? void 0 : event_context.type, 'cx_rum.event_context.severity': event_context === null || event_context === void 0 ? void 0 : event_context.severity, 'cx_rum.error_context.error_type': error_context === null || error_context === void 0 ? void 0 : error_context.error_type, 'cx_rum.error_context.error_message': error_context === null || error_context === void 0 ? void 0 : error_context.error_message, 'cx_rum.network_request_context.fragments': network_request_context === null || network_request_context === void 0 ? void 0 : network_request_context.fragments, 'cx_rum.network_request_context.url': network_request_context === null || network_request_context === void 0 ? void 0 : network_request_context.url, 'cx_rum.network_request_context.status_code': network_request_context === null || network_request_context === void 0 ? void 0 : network_request_context.status_code, 'cx_rum.network_request_context.method': network_request_context === null || network_request_context === void 0 ? void 0 : network_request_context.method }));
 }
 
 var CoralogixSpanMapProcessor = (function () {
@@ -5673,9 +5762,9 @@ var CoralogixRum = {
     init: function (options) {
         var _a, _b;
         var _this = this;
-        var _c;
+        var _c, _d;
         try {
-            if (isInited) {
+            if (isInited || ((_c = CxGlobal === null || CxGlobal === void 0 ? void 0 : CxGlobal.CoralogixRum) === null || _c === void 0 ? void 0 : _c.isInited)) {
                 if (options === null || options === void 0 ? void 0 : options.debug) {
                     console.debug('CoralogixRum already initialized, skipping init');
                 }
@@ -5791,7 +5880,7 @@ var CoralogixRum = {
             spanMapProcessor = new CoralogixSpanMapProcessor();
             tracerProvider.addSpanProcessor(spanMapProcessor);
             new SnapshotManager();
-            if ((_c = resolvedOptions_1.sessionRecordingConfig) === null || _c === void 0 ? void 0 : _c.enable) {
+            if ((_d = resolvedOptions_1.sessionRecordingConfig) === null || _d === void 0 ? void 0 : _d.enable) {
                 new ClickScreenshotManager();
             }
             snapshotProcessor = new CoralogixSnapshotSpanProcessor();
@@ -5802,10 +5891,10 @@ var CoralogixRum = {
                 tracerProvider: tracerProvider,
                 instrumentations: instrumentations,
             });
-            var _d = __read$1(partition(resolvedOptions_1.labelProviders || [], function (_a) {
+            var _e = __read$1(partition(resolvedOptions_1.labelProviders || [], function (_a) {
                 var urlType = _a.urlType;
                 return urlType === UrlType.PAGE || !urlType;
-            }), 2), pageUrlLabelProviders = _d[0], networkUrlLabelProviders = _d[1];
+            }), 2), pageUrlLabelProviders = _e[0], networkUrlLabelProviders = _e[1];
             saveInternalRumData(PAGE_URL_LABEL_PROVIDERS_KEY, pageUrlLabelProviders);
             saveInternalRumData(NETWORK_URL_LABEL_PROVIDERS_KEY, networkUrlLabelProviders);
             isInited = true;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coralogix/browser",
-  "version": "3.20.0",
+  "version": "3.21.0",
   "description": "Official Coralogix SDK for browsers",
   "license": "Apache-2.0",
   "author": "Coralogix",

package/sessionRecorder.esm.js

@@ -20,6 +20,7 @@ var EventType;
     EventType[EventType["Meta"] = 4] = "Meta";
     EventType[EventType["Custom"] = 5] = "Custom";
     EventType[EventType["Plugin"] = 6] = "Plugin";
+    EventType[EventType["Asset"] = 7] = "Asset";
 })(EventType || (EventType = {}));
 var IncrementalSource;
 (function (IncrementalSource) {
@@ -131,13 +132,14 @@ function getUntaintedPrototype(key) {
     }
     try {
         var iframeEl = document.createElement('iframe');
+        iframeEl.style.display = 'none';
         document.body.appendChild(iframeEl);
         var win = iframeEl.contentWindow;
         if (!win)
             return defaultObj.prototype;
         var untaintedObject = win[key]
             .prototype;
-        document.body.removeChild(iframeEl);
+        iframeEl.remove();
         if (!untaintedObject)
             return defaultPrototype;
         return (untaintedBasePrototype[key] = untaintedObject);
@@ -214,6 +216,10 @@ function querySelectorAll(n, selectors) {
 function mutationObserverCtor() {
     return getUntaintedPrototype('MutationObserver').constructor;
 }
+var nowTimestamp = Date.now;
+if (!(/[1-9][0-9]{12}/.test(Date.now().toString()))) {
+    nowTimestamp = function () { return new Date().getTime(); };
+}
 function patch(source, name, replacement) {
     try {
         if (!(name in source)) {
@@ -254,7 +260,8 @@ var dom = {
     shadowRoot: shadowRoot,
     querySelector: querySelector,
     querySelectorAll: querySelectorAll,
-    mutationObserver: mutationObserverCtor,
+    nowTimestamp: nowTimestamp,
+    mutationObserverCtor: mutationObserverCtor,
     patch: patch,
 };
 
@@ -504,8 +511,10 @@ function absolutifyURLs(cssText, href) {
         if (filePath[0] === '/') {
             return "url(".concat(maybeQuote).concat(extractOrigin(href) + filePath).concat(maybeQuote, ")");
         }
-        var stack = href.split('/');
-        var parts = filePath.split('/');
+        var filePathNoHash = filePath.split('#')[0];
+        var maybeHash = filePath.substring(filePathNoHash.length);
+        var stack = href.split('#')[0].split('/');
+        var parts = filePathNoHash.split('/');
         stack.pop();
         try {
             for (var parts_1 = __values(parts), parts_1_1 = parts_1.next(); !parts_1_1.done; parts_1_1 = parts_1.next()) {
@@ -528,7 +537,7 @@ function absolutifyURLs(cssText, href) {
             }
             finally { if (e_1) throw e_1.error; }
         }
-        return "url(".concat(maybeQuote).concat(stack.join('/')).concat(maybeQuote, ")");
+        return "url(".concat(maybeQuote).concat(stack.join('/')).concat(maybeHash).concat(maybeQuote, ")");
     });
 }
 function normalizeCssString(cssText, _testNoPxNorm) {
@@ -1660,10 +1669,6 @@ function hookSetter(target, key, d, isRevoked, win) {
         });
     return function () { return hookSetter(target, key, original || {}, true); };
 }
-var nowTimestamp = Date.now;
-if (!(/[1-9][0-9]{12}/.test(Date.now().toString()))) {
-    nowTimestamp = function () { return new Date().getTime(); };
-}
 function getWindowScroll(win) {
     var _a, _b, _c, _d;
     var doc = win.document;
@@ -2896,6 +2901,7 @@ function getNestedCSSRulePositions(rule) {
             var rules = Array.from(childRule.parentRule.cssRules);
             var index = rules.indexOf(childRule);
             pos.unshift(index);
+            return recurse(childRule.parentRule, pos);
         }
         else if (childRule.parentStyleSheet) {
             var rules = Array.from(childRule.parentStyleSheet.cssRules);
@@ -4188,7 +4194,9 @@ function patchGLPrototype(prototype, type, cb, blockClass, blockSelector, win) {
 }
 function initCanvasWebGLMutationObserver(cb, win, blockClass, blockSelector) {
     var handlers = [];
-    handlers.push.apply(handlers, __spreadArray([], __read(patchGLPrototype(win.WebGLRenderingContext.prototype, CanvasContext.WebGL, cb, blockClass, blockSelector, win)), false));
+    if (typeof win.WebGLRenderingContext !== 'undefined') {
+        handlers.push.apply(handlers, __spreadArray([], __read(patchGLPrototype(win.WebGLRenderingContext.prototype, CanvasContext.WebGL, cb, blockClass, blockSelector, win)), false));
+    }
     if (typeof win.WebGL2RenderingContext !== 'undefined') {
         handlers.push.apply(handlers, __spreadArray([], __read(patchGLPrototype(win.WebGL2RenderingContext.prototype, CanvasContext.WebGL2, cb, blockClass, blockSelector, win)), false));
     }

package/src/cx-rrweb/rrweb/utils.d.ts

@@ -1,5 +1,6 @@
 import type { addedNodeMutation, blockClass, DeprecatedMirror, DocumentDimension, hookResetter, IMirror, IWindow, listenerHandler, textMutation, throttleOptions } from '../rrweb-types';
 import type { Mirror, SlimDOMOptions } from '../rrweb-snapshot';
+export { nowTimestamp } from '../rrweb-utils';
 interface RRNode {
     nodeName: string;
     nodeType: number;
@@ -11,8 +12,6 @@ export declare function on(type: string, fn: EventListenerOrEventListenerObject,
 export declare let _mirror: DeprecatedMirror;
 export declare function throttle<T>(func: (arg: T) => void, wait: number, options?: throttleOptions): (this: any, ...args: T[]) => void;
 export declare function hookSetter<T>(target: T, key: string | number | symbol, d: PropertyDescriptor, isRevoked?: boolean, win?: Window & typeof globalThis): hookResetter;
-declare let nowTimestamp: () => number;
-export { nowTimestamp };
 export declare function getWindowScroll(win: Window): {
     left: number;
     top: number;
@@ -43,7 +42,7 @@ export declare function getBaseDimension(node: Node, rootIframe: Node): Document
 export declare function hasShadowRoot<T extends Node | RRNode>(n: T): n is T & {
     shadowRoot: ShadowRoot;
 };
-export declare function getNestedRule(rules: CSSRuleList, position: number[]): CSSGroupingRule;
+export declare function getNestedRule(rules: CSSRuleList, position: number[]): CSSGroupingRule | null;
 export declare function getPositionsAndIndex(nestedIndex: number[]): {
     positions: number[];
     index: number | undefined;

package/src/cx-rrweb/rrweb-types/index.d.ts

@@ -5,7 +5,8 @@ export declare enum EventType {
     IncrementalSnapshot = 3,
     Meta = 4,
     Custom = 5,
-    Plugin = 6
+    Plugin = 6,
+    Asset = 7
 }
 export type domContentLoadedEvent = {
     type: EventType.DomContentLoaded;
@@ -51,6 +52,13 @@ export type pluginEvent<T = unknown> = {
         payload: T;
     };
 };
+export type assetEvent = {
+    type: EventType.Asset;
+    data: assetParam;
+};
+export type assetEventWithTime = assetEvent & {
+    timestamp: number;
+};
 export declare enum IncrementalSource {
     Mutation = 0,
     MouseMove = 1,
@@ -115,7 +123,7 @@ export type customElementData = {
     source: IncrementalSource.CustomElement;
 } & customElementParam;
 export type incrementalData = mutationData | mousemoveData | mouseInteractionData | scrollData | viewportResizeData | inputData | mediaInteractionData | styleSheetRuleData | canvasMutationData | fontData | selectionData | styleDeclarationData | adoptedStyleSheetData | customElementData;
-export type eventWithoutTime = domContentLoadedEvent | loadedEvent | fullSnapshotEvent | incrementalSnapshotEvent | metaEvent | customEvent | pluginEvent;
+export type eventWithoutTime = domContentLoadedEvent | loadedEvent | fullSnapshotEvent | incrementalSnapshotEvent | metaEvent | customEvent | pluginEvent | assetEvent;
 export type event = eventWithoutTime;
 export type eventWithTime = eventWithoutTime & {
     timestamp: number;
@@ -258,14 +266,19 @@ export declare enum CanvasContext {
     WebGL = 1,
     WebGL2 = 2
 }
-export type SerializedCanvasArg = {
-    rr_type: 'ArrayBuffer';
-    base64: string;
-} | {
+export type SerializedCssTextArg = {
+    rr_type: 'CssText';
+    cssTexts: string[];
+};
+export type SerializedBlobArg = {
     rr_type: 'Blob';
     data: Array<CanvasArg>;
     type?: string;
-} | {
+};
+export type SerializedCanvasArg = {
+    rr_type: 'ArrayBuffer';
+    base64: string;
+} | SerializedBlobArg | {
     rr_type: string;
     src: string;
 } | {
@@ -422,6 +435,18 @@ export type customElementParam = {
     };
 };
 export type customElementCallback = (c: customElementParam) => void;
+export type assetParam = {
+    url: string;
+    payload: SerializedCanvasArg | SerializedCssTextArg;
+    timestamp?: number;
+} | {
+    url: string;
+    failed: {
+        status?: number;
+        message: string;
+    };
+};
+export type assetCallback = (d: assetParam, timestamp?: number | true) => void;
 interface INode extends Node {
     __sn: serializedNodeWithId;
 }

package/src/cx-rrweb/rrweb-utils/index.d.ts

@@ -21,6 +21,8 @@ export declare function shadowRoot(n: Node): ShadowRoot | null;
 export declare function querySelector(n: Element, selectors: string): Element | null;
 export declare function querySelectorAll(n: Element, selectors: string): NodeListOf<Element>;
 export declare function mutationObserverCtor(): (typeof MutationObserver)['prototype']['constructor'];
+declare let nowTimestamp: () => number;
+export { nowTimestamp };
 export declare function patch(source: {
     [key: string]: any;
 }, name: string, replacement: (...args: any[]) => any): () => void;
@@ -37,7 +39,8 @@ declare const _default: {
     shadowRoot: typeof shadowRoot;
     querySelector: typeof querySelector;
     querySelectorAll: typeof querySelectorAll;
-    mutationObserver: typeof mutationObserverCtor;
+    nowTimestamp: () => number;
+    mutationObserverCtor: typeof mutationObserverCtor;
     patch: typeof patch;
 };
 export default _default;

package/src/dom-attributes.consts.d.ts

@@ -1,5 +1,3 @@
 export declare const CX_ACTION_NAME_ATTRIBUTE = "data-cx-action-name";
 export declare const DATA_TEST_ATTRIBUTE = "data-test";
-export declare const DATA_TESTID_ATTRIBUTE = "data-testid";
-export declare const DATA_TEST_ID_ATTRIBUTE = "data-test-id";
 export declare const RR_IS_PASSWORD_ATTRIBUTE = "data-rr-is-password";

package/src/instrumentations/user-interaction/user-interaction.utils.d.ts

@@ -10,4 +10,4 @@ export declare function extractResolvedName({ element, config, actionName, ariaL
 }): string;
 export declare function extractMaskedOrTextContent(clickableElement: Element | HTMLElement | null, config: CoralogixBrowserSdkConfig): string;
 export declare function getClassName(element: Element | HTMLElement): string;
-export declare function findClickableElement(element: Element | HTMLElement | null, maxDepth?: number): Element | HTMLElement | null;
+export declare function findClickableElement(element: Element | HTMLElement, maxDepth?: number): Element | HTMLElement | null;

package/src/otel/rum-span-attributes.types.d.ts

@@ -19,6 +19,7 @@ export interface CxRumSpanAttributes extends Attributes {
     'cx_rum.session_context.user_id'?: string;
     'cx_rum.session_context.user_name'?: string;
     'cx_rum.session_context.account_id'?: string;
+    'cx_rum.session_context.account_name'?: string;
     'cx_rum.page_context.page_fragments'?: string;
     'cx_rum.page_context.page_url_blueprint'?: string;
     'cx_rum.event_context.type'?: string;

package/src/tools/cx-timers.d.ts

@@ -7,6 +7,7 @@ export interface ZoneType {
 }
 export interface WindowWithZone {
     Zone?: ZoneType;
+    document?: Document;
     setTimeout: typeof setTimeout;
     setInterval: typeof setInterval;
     clearTimeout: typeof clearTimeout;

package/src/types.d.ts

@@ -65,6 +65,7 @@ export interface UserContextConfig {
     user_name: string;
     user_email?: string;
     account_id?: string;
+    account_name?: string;
     user_metadata?: {
         [key: string]: any;
     };
@@ -299,6 +300,7 @@ export interface UserMetadata {
     user_name?: string;
     user_email?: string;
     account_id?: string;
+    account_name?: string;
     user_metadata?: {
         [key: string]: any;
     };

package/src/version.d.ts

@@ -1 +1 @@
-export declare const SDK_VERSION = "3.20.0";
+export declare const SDK_VERSION = "3.21.0";