@sentry/replay 7.92.0 → 7.94.0

package/esm/index.js

@@ -1,4 +1,5 @@
-import { addBreadcrumb, getClient, isSentryRequestUrl, getCurrentScope, addEventProcessor, prepareEvent, getIsolationScope, setContext, captureException } from '@sentry/core';
+import { _nullishCoalesce, _optionalChain } from '@sentry/utils';
+import { addBreadcrumb, getClient, isSentryRequestUrl, getCurrentScope, addEventProcessor, prepareEvent, getIsolationScope, setContext, captureException, spanToJSON, SEMANTIC_ATTRIBUTE_SENTRY_SOURCE } from '@sentry/core';
 import { GLOBAL_OBJ, normalize, fill, htmlTreeAsString, browserPerformanceTimeOrigin, logger, uuid4, SENTRY_XHR_DATA_KEY, dropUndefinedKeys, stringMatchesSomePattern, addFetchInstrumentationHandler, addXhrInstrumentationHandler, addClickKeypressInstrumentationHandler, addHistoryInstrumentationHandler, createEnvelope, createEventEnvelopeHeaders, getSdkMetadataForEnvelopeHeader, updateRateLimits, isRateLimited, consoleSandbox, isBrowser } from '@sentry/utils';
 import { addPerformanceInstrumentationHandler, addLcpInstrumentationHandler } from '@sentry-internal/tracing';
 
@@ -52,37 +53,7 @@ const MIN_REPLAY_DURATION_LIMIT = 15000;
 /** The max. length of a replay. */
 const MAX_REPLAY_DURATION = 3600000; // 60 minutes in ms;
 
-const CANVAS_QUALITY = {
-  low: {
-    sampling: {
-      canvas: 1,
-    },
-    dataURLOptions: {
-      type: 'image/webp',
-      quality: 0.25,
-    },
-  },
-  medium: {
-    sampling: {
-      canvas: 2,
-    },
-    dataURLOptions: {
-      type: 'image/webp',
-      quality: 0.4,
-    },
-  },
-  high: {
-    sampling: {
-      canvas: 4,
-    },
-    dataURLOptions: {
-      type: 'image/webp',
-      quality: 0.5,
-    },
-  },
-};
-
-var NodeType$1;
+function _nullishCoalesce$1(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }function _optionalChain$5(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }var NodeType$1;
 (function (NodeType) {
     NodeType[NodeType["Document"] = 0] = "Document";
     NodeType[NodeType["DocumentType"] = 1] = "DocumentType";
@@ -96,8 +67,8 @@ function isElement$1(n) {
     return n.nodeType === n.ELEMENT_NODE;
 }
 function isShadowRoot(n) {
-    const host = n === null || n === void 0 ? void 0 : n.host;
-    return Boolean((host === null || host === void 0 ? void 0 : host.shadowRoot) === n);
+    const host = _optionalChain$5([n, 'optionalAccess', _ => _.host]);
+    return Boolean(_optionalChain$5([host, 'optionalAccess', _2 => _2.shadowRoot]) === n);
 }
 function isNativeShadowDom(shadowRoot) {
     return Object.prototype.toString.call(shadowRoot) === '[object ShadowRoot]';
@@ -171,11 +142,10 @@ class Mirror {
         this.nodeMetaMap = new WeakMap();
     }
     getId(n) {
-        var _a;
         if (!n)
             return -1;
-        const id = (_a = this.getMeta(n)) === null || _a === void 0 ? void 0 : _a.id;
-        return id !== null && id !== void 0 ? id : -1;
+        const id = _optionalChain$5([this, 'access', _3 => _3.getMeta, 'call', _4 => _4(n), 'optionalAccess', _5 => _5.id]);
+        return _nullishCoalesce$1(id, () => ( -1));
     }
     getNode(id) {
         return this.idNodeMap.get(id) || null;
@@ -506,18 +476,23 @@ function createMatchPredicate(className, selector) {
         const el = node;
         if (el === null)
             return false;
-        if (className) {
-            if (typeof className === 'string') {
-                if (el.matches(`.${className}`))
+        try {
+            if (className) {
+                if (typeof className === 'string') {
+                    if (el.matches(`.${className}`))
+                        return true;
+                }
+                else if (elementClassMatchesRegex(el, className)) {
                     return true;
+                }
             }
-            else if (elementClassMatchesRegex(el, className)) {
+            if (selector && el.matches(selector))
                 return true;
-            }
+            return false;
+        }
+        catch (e2) {
+            return false;
         }
-        if (selector && el.matches(selector))
-            return true;
-        return false;
     };
 }
 function needMaskingText(node, maskTextClass, maskTextSelector, unmaskTextClass, unmaskTextSelector, maskAllText) {
@@ -697,7 +672,6 @@ function getRootId(doc, mirror) {
     return docId === 1 ? undefined : docId;
 }
 function serializeTextNode(n, options) {
-    var _a;
     const { maskAllText, maskTextClass, unmaskTextClass, maskTextSelector, unmaskTextSelector, maskTextFn, maskInputOptions, maskInputFn, rootId, } = options;
     const parentTagName = n.parentNode && n.parentNode.tagName;
     let textContent = n.textContent;
@@ -708,7 +682,7 @@ function serializeTextNode(n, options) {
         try {
             if (n.nextSibling || n.previousSibling) {
             }
-            else if ((_a = n.parentNode.sheet) === null || _a === void 0 ? void 0 : _a.cssRules) {
+            else if (_optionalChain$5([n, 'access', _6 => _6.parentNode, 'access', _7 => _7.sheet, 'optionalAccess', _8 => _8.cssRules])) {
                 textContent = stringifyStylesheet(n.parentNode.sheet);
             }
         }
@@ -1261,6 +1235,7 @@ function snapshot(n, options) {
     });
 }
 
+function _optionalChain$4(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
 function on(type, fn, target = document) {
     const options = { capture: true, passive: true };
     target.addEventListener(type, fn, options);
@@ -1367,7 +1342,7 @@ function patch(source, name, replacement) {
             source[name] = original;
         };
     }
-    catch (_a) {
+    catch (e2) {
         return () => {
         };
     }
@@ -1377,24 +1352,23 @@ if (!(/[1-9][0-9]{12}/.test(Date.now().toString()))) {
     nowTimestamp = () => new Date().getTime();
 }
 function getWindowScroll(win) {
-    var _a, _b, _c, _d, _e, _f;
     const doc = win.document;
     return {
         left: doc.scrollingElement
             ? doc.scrollingElement.scrollLeft
             : win.pageXOffset !== undefined
                 ? win.pageXOffset
-                : (doc === null || doc === void 0 ? void 0 : doc.documentElement.scrollLeft) ||
-                    ((_b = (_a = doc === null || doc === void 0 ? void 0 : doc.body) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.scrollLeft) ||
-                    ((_c = doc === null || doc === void 0 ? void 0 : doc.body) === null || _c === void 0 ? void 0 : _c.scrollLeft) ||
+                : _optionalChain$4([doc, 'optionalAccess', _ => _.documentElement, 'access', _2 => _2.scrollLeft]) ||
+                    _optionalChain$4([doc, 'optionalAccess', _3 => _3.body, 'optionalAccess', _4 => _4.parentElement, 'optionalAccess', _5 => _5.scrollLeft]) ||
+                    _optionalChain$4([doc, 'optionalAccess', _6 => _6.body, 'optionalAccess', _7 => _7.scrollLeft]) ||
                     0,
         top: doc.scrollingElement
             ? doc.scrollingElement.scrollTop
             : win.pageYOffset !== undefined
                 ? win.pageYOffset
-                : (doc === null || doc === void 0 ? void 0 : doc.documentElement.scrollTop) ||
-                    ((_e = (_d = doc === null || doc === void 0 ? void 0 : doc.body) === null || _d === void 0 ? void 0 : _d.parentElement) === null || _e === void 0 ? void 0 : _e.scrollTop) ||
-                    ((_f = doc === null || doc === void 0 ? void 0 : doc.body) === null || _f === void 0 ? void 0 : _f.scrollTop) ||
+                : _optionalChain$4([doc, 'optionalAccess', _8 => _8.documentElement, 'access', _9 => _9.scrollTop]) ||
+                    _optionalChain$4([doc, 'optionalAccess', _10 => _10.body, 'optionalAccess', _11 => _11.parentElement, 'optionalAccess', _12 => _12.scrollTop]) ||
+                    _optionalChain$4([doc, 'optionalAccess', _13 => _13.body, 'optionalAccess', _14 => _14.scrollTop]) ||
                     0,
     };
 }
@@ -1496,7 +1470,7 @@ function isSerializedStylesheet(n, mirror) {
         mirror.getMeta(n));
 }
 function hasShadowRoot(n) {
-    return Boolean(n === null || n === void 0 ? void 0 : n.shadowRoot);
+    return Boolean(_optionalChain$4([n, 'optionalAccess', _18 => _18.shadowRoot]));
 }
 class StyleSheetMirror {
     constructor() {
@@ -1505,8 +1479,7 @@ class StyleSheetMirror {
         this.idStyleMap = new Map();
     }
     getId(stylesheet) {
-        var _a;
-        return (_a = this.styleIDMap.get(stylesheet)) !== null && _a !== void 0 ? _a : -1;
+        return _nullishCoalesce(this.styleIDMap.get(stylesheet), () => ( -1));
     }
     has(stylesheet) {
         return this.styleIDMap.has(stylesheet);
@@ -1537,9 +1510,8 @@ class StyleSheetMirror {
     }
 }
 function getShadowHost(n) {
-    var _a, _b;
     let shadowHost = null;
-    if (((_b = (_a = n.getRootNode) === null || _a === void 0 ? void 0 : _a.call(n)) === null || _b === void 0 ? void 0 : _b.nodeType) === Node.DOCUMENT_FRAGMENT_NODE &&
+    if (_optionalChain$4([n, 'access', _19 => _19.getRootNode, 'optionalCall', _20 => _20(), 'optionalAccess', _21 => _21.nodeType]) === Node.DOCUMENT_FRAGMENT_NODE &&
         n.getRootNode().host)
         shadowHost = n.getRootNode().host;
     return shadowHost;
@@ -1564,6 +1536,34 @@ function inDom(n) {
         return false;
     return doc.contains(n) || shadowHostInDom(n);
 }
+let cachedRequestAnimationFrameImplementation;
+function getRequestAnimationFrameImplementation() {
+    if (cachedRequestAnimationFrameImplementation) {
+        return cachedRequestAnimationFrameImplementation;
+    }
+    const document = window.document;
+    let requestAnimationFrameImplementation = window.requestAnimationFrame;
+    if (document && typeof document.createElement === 'function') {
+        try {
+            const sandbox = document.createElement('iframe');
+            sandbox.hidden = true;
+            document.head.appendChild(sandbox);
+            const contentWindow = sandbox.contentWindow;
+            if (contentWindow && contentWindow.requestAnimationFrame) {
+                requestAnimationFrameImplementation =
+                    contentWindow.requestAnimationFrame;
+            }
+            document.head.removeChild(sandbox);
+        }
+        catch (e) {
+        }
+    }
+    return (cachedRequestAnimationFrameImplementation =
+        requestAnimationFrameImplementation.bind(window));
+}
+function onRequestAnimationFrame(...rest) {
+    return getRequestAnimationFrameImplementation()(...rest);
+}
 
 var EventType = /* @__PURE__ */ ((EventType2) => {
   EventType2[EventType2["DomContentLoaded"] = 0] = "DomContentLoaded";
@@ -1616,6 +1616,7 @@ var PointerTypes = /* @__PURE__ */ ((PointerTypes2) => {
   return PointerTypes2;
 })(PointerTypes || {});
 
+function _optionalChain$3(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
 function isNodeInLinkedList(n) {
     return '__ln' in n;
 }
@@ -1631,7 +1632,7 @@ class DoubleLinkedList {
         }
         let current = this.head;
         for (let index = 0; index < position; index++) {
-            current = (current === null || current === void 0 ? void 0 : current.next) || null;
+            current = _optionalChain$3([current, 'optionalAccess', _ => _.next]) || null;
         }
         return current;
     }
@@ -2218,6 +2219,7 @@ const callbackWrapper = (cb) => {
     return rrwebWrapped;
 };
 
+function _optionalChain$2(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
 const mutationBuffers = [];
 function getEventTarget(event) {
     try {
@@ -2231,18 +2233,17 @@ function getEventTarget(event) {
             return event.path[0];
         }
     }
-    catch (_a) {
+    catch (e2) {
     }
     return event && event.target;
 }
 function initMutationObserver(options, rootEl) {
-    var _a, _b;
     const mutationBuffer = new MutationBuffer();
     mutationBuffers.push(mutationBuffer);
     mutationBuffer.init(options);
     let mutationObserverCtor = window.MutationObserver ||
         window.__rrMutationObserver;
-    const angularZoneSymbol = (_b = (_a = window === null || window === void 0 ? void 0 : window.Zone) === null || _a === void 0 ? void 0 : _a.__symbol__) === null || _b === void 0 ? void 0 : _b.call(_a, 'MutationObserver');
+    const angularZoneSymbol = _optionalChain$2([window, 'optionalAccess', _ => _.Zone, 'optionalAccess', _2 => _2.__symbol__, 'optionalCall', _3 => _3('MutationObserver')]);
     if (angularZoneSymbol &&
         window[angularZoneSymbol]) {
         mutationObserverCtor = window[angularZoneSymbol];
@@ -2377,7 +2378,13 @@ function initMouseInteractionObserver({ mouseInteractionCb, doc, mirror, blockCl
             }
             const id = mirror.getId(target);
             const { clientX, clientY } = e;
-            callbackWrapper(mouseInteractionCb)(Object.assign({ type: MouseInteractions[thisEventKey], id, x: clientX, y: clientY }, (pointerType !== null && { pointerType })));
+            callbackWrapper(mouseInteractionCb)({
+                type: MouseInteractions[thisEventKey],
+                id,
+                x: clientX,
+                y: clientY,
+                ...(pointerType !== null && { pointerType }),
+            });
         };
     };
     Object.keys(MouseInteractions)
@@ -2514,7 +2521,10 @@ function initInputObserver({ inputCb, doc, mirror, blockClass, blockSelector, un
             lastInputValue.isChecked !== v.isChecked) {
             lastInputValueMap.set(target, v);
             const id = mirror.getId(target);
-            callbackWrapper(inputCb)(Object.assign(Object.assign({}, v), { id }));
+            callbackWrapper(inputCb)({
+                ...v,
+                id,
+            });
         }
     }
     const events = sampling.input === 'last' ? ['change'] : ['input', 'change'];
@@ -2728,17 +2738,16 @@ function initStyleSheetObserver({ styleSheetRuleCb, mirror, stylesheetManager },
     });
 }
 function initAdoptedStyleSheetObserver({ mirror, stylesheetManager, }, host) {
-    var _a, _b, _c;
     let hostId = null;
     if (host.nodeName === '#document')
         hostId = mirror.getId(host);
     else
         hostId = mirror.getId(host.host);
     const patchTarget = host.nodeName === '#document'
-        ? (_a = host.defaultView) === null || _a === void 0 ? void 0 : _a.Document
-        : (_c = (_b = host.ownerDocument) === null || _b === void 0 ? void 0 : _b.defaultView) === null || _c === void 0 ? void 0 : _c.ShadowRoot;
-    const originalPropertyDescriptor = (patchTarget === null || patchTarget === void 0 ? void 0 : patchTarget.prototype)
-        ? Object.getOwnPropertyDescriptor(patchTarget === null || patchTarget === void 0 ? void 0 : patchTarget.prototype, 'adoptedStyleSheets')
+        ? _optionalChain$2([host, 'access', _4 => _4.defaultView, 'optionalAccess', _5 => _5.Document])
+        : _optionalChain$2([host, 'access', _6 => _6.ownerDocument, 'optionalAccess', _7 => _7.defaultView, 'optionalAccess', _8 => _8.ShadowRoot]);
+    const originalPropertyDescriptor = _optionalChain$2([patchTarget, 'optionalAccess', _9 => _9.prototype])
+        ? Object.getOwnPropertyDescriptor(_optionalChain$2([patchTarget, 'optionalAccess', _10 => _10.prototype]), 'adoptedStyleSheets')
         : undefined;
     if (hostId === null ||
         hostId === -1 ||
@@ -2750,12 +2759,10 @@ function initAdoptedStyleSheetObserver({ mirror, stylesheetManager, }, host) {
         configurable: originalPropertyDescriptor.configurable,
         enumerable: originalPropertyDescriptor.enumerable,
         get() {
-            var _a;
-            return (_a = originalPropertyDescriptor.get) === null || _a === void 0 ? void 0 : _a.call(this);
+            return _optionalChain$2([originalPropertyDescriptor, 'access', _11 => _11.get, 'optionalAccess', _12 => _12.call, 'call', _13 => _13(this)]);
         },
         set(sheets) {
-            var _a;
-            const result = (_a = originalPropertyDescriptor.set) === null || _a === void 0 ? void 0 : _a.call(this, sheets);
+            const result = _optionalChain$2([originalPropertyDescriptor, 'access', _14 => _14.set, 'optionalAccess', _15 => _15.call, 'call', _16 => _16(this, sheets)]);
             if (hostId !== null && hostId !== -1) {
                 try {
                     stylesheetManager.adoptStyleSheets(sheets, hostId);
@@ -2779,12 +2786,11 @@ function initStyleDeclarationObserver({ styleDeclarationCb, mirror, ignoreCSSAtt
     const setProperty = win.CSSStyleDeclaration.prototype.setProperty;
     win.CSSStyleDeclaration.prototype.setProperty = new Proxy(setProperty, {
         apply: callbackWrapper((target, thisArg, argumentsList) => {
-            var _a;
             const [property, value, priority] = argumentsList;
             if (ignoreCSSAttributes.has(property)) {
                 return setProperty.apply(thisArg, [property, value, priority]);
             }
-            const { id, styleId } = getIdAndStyleId((_a = thisArg.parentRule) === null || _a === void 0 ? void 0 : _a.parentStyleSheet, mirror, stylesheetManager.styleMirror);
+            const { id, styleId } = getIdAndStyleId(_optionalChain$2([thisArg, 'access', _17 => _17.parentRule, 'optionalAccess', _18 => _18.parentStyleSheet]), mirror, stylesheetManager.styleMirror);
             if ((id && id !== -1) || (styleId && styleId !== -1)) {
                 styleDeclarationCb({
                     id,
@@ -2803,12 +2809,11 @@ function initStyleDeclarationObserver({ styleDeclarationCb, mirror, ignoreCSSAtt
     const removeProperty = win.CSSStyleDeclaration.prototype.removeProperty;
     win.CSSStyleDeclaration.prototype.removeProperty = new Proxy(removeProperty, {
         apply: callbackWrapper((target, thisArg, argumentsList) => {
-            var _a;
             const [property] = argumentsList;
             if (ignoreCSSAttributes.has(property)) {
                 return removeProperty.apply(thisArg, [property]);
             }
-            const { id, styleId } = getIdAndStyleId((_a = thisArg.parentRule) === null || _a === void 0 ? void 0 : _a.parentStyleSheet, mirror, stylesheetManager.styleMirror);
+            const { id, styleId } = getIdAndStyleId(_optionalChain$2([thisArg, 'access', _19 => _19.parentRule, 'optionalAccess', _20 => _20.parentStyleSheet]), mirror, stylesheetManager.styleMirror);
             if ((id && id !== -1) || (styleId && styleId !== -1)) {
                 styleDeclarationCb({
                     id,
@@ -2901,7 +2906,7 @@ function initSelectionObserver(param) {
     let collapsed = true;
     const updateSelection = callbackWrapper(() => {
         const selection = doc.getSelection();
-        if (!selection || (collapsed && (selection === null || selection === void 0 ? void 0 : selection.isCollapsed)))
+        if (!selection || (collapsed && _optionalChain$2([selection, 'optionalAccess', _21 => _21.isCollapsed])))
             return;
         collapsed = selection.isCollapsed || false;
         const ranges = [];
@@ -3067,6 +3072,7 @@ class CrossOriginIframeMirror {
     }
 }
 
+function _optionalChain$1(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
 class IframeManagerNoop {
     constructor() {
         this.crossOriginIframeMirror = new CrossOriginIframeMirror(genId);
@@ -3104,7 +3110,6 @@ class IframeManager {
         this.loadListener = cb;
     }
     attachIframe(iframeEl, childSn) {
-        var _a;
         this.mutationCb({
             adds: [
                 {
@@ -3118,7 +3123,7 @@ class IframeManager {
             attributes: [],
             isAttachIframe: true,
         });
-        (_a = this.loadListener) === null || _a === void 0 ? void 0 : _a.call(this, iframeEl);
+        _optionalChain$1([this, 'access', _ => _.loadListener, 'optionalCall', _2 => _2(iframeEl)]);
         if (iframeEl.contentDocument &&
             iframeEl.contentDocument.adoptedStyleSheets &&
             iframeEl.contentDocument.adoptedStyleSheets.length > 0)
@@ -3140,7 +3145,6 @@ class IframeManager {
             this.wrappedEmit(transformedEvent, crossOriginMessageEvent.data.isCheckout);
     }
     transformCrossOriginEvent(iframeEl, e) {
-        var _a;
         switch (e.type) {
             case EventType.FullSnapshot: {
                 this.crossOriginIframeMirror.reset(iframeEl);
@@ -3241,9 +3245,9 @@ class IframeManager {
                     case IncrementalSource.AdoptedStyleSheet: {
                         this.replaceIds(e.data, iframeEl, ['id']);
                         this.replaceStyleIds(e.data, iframeEl, ['styleIds']);
-                        (_a = e.data.styles) === null || _a === void 0 ? void 0 : _a.forEach((style) => {
+                        _optionalChain$1([e, 'access', _3 => _3.data, 'access', _4 => _4.styles, 'optionalAccess', _5 => _5.forEach, 'call', _6 => _6((style) => {
                             this.replaceStyleIds(style, iframeEl, ['styleId']);
-                        });
+                        })]);
                         return e;
                     }
                 }
@@ -3319,9 +3323,20 @@ class ShadowDomManager {
         if (this.shadowDoms.has(shadowRoot))
             return;
         this.shadowDoms.add(shadowRoot);
-        const observer = initMutationObserver(Object.assign(Object.assign({}, this.bypassOptions), { doc, mutationCb: this.mutationCb, mirror: this.mirror, shadowDomManager: this }), shadowRoot);
+        const observer = initMutationObserver({
+            ...this.bypassOptions,
+            doc,
+            mutationCb: this.mutationCb,
+            mirror: this.mirror,
+            shadowDomManager: this,
+        }, shadowRoot);
         this.restoreHandlers.push(() => observer.disconnect());
-        this.restoreHandlers.push(initScrollObserver(Object.assign(Object.assign({}, this.bypassOptions), { scrollCb: this.scrollCb, doc: shadowRoot, mirror: this.mirror })));
+        this.restoreHandlers.push(initScrollObserver({
+            ...this.bypassOptions,
+            scrollCb: this.scrollCb,
+            doc: shadowRoot,
+            mirror: this.mirror,
+        }));
         setTimeout(() => {
             if (shadowRoot.adoptedStyleSheets &&
                 shadowRoot.adoptedStyleSheets.length > 0)
@@ -3372,6 +3387,8 @@ class CanvasManagerNoop {
     }
     unlock() {
     }
+    snapshot() {
+    }
 }
 
 class StylesheetManager {
@@ -3446,7 +3463,7 @@ class ProcessedNodeManager {
         this.periodicallyClear();
     }
     periodicallyClear() {
-        requestAnimationFrame(() => {
+        onRequestAnimationFrame(() => {
             this.clear();
             if (this.loop)
                 this.periodicallyClear();
@@ -3472,7 +3489,6 @@ function wrapEvent(e) {
     eWithTime.timestamp = nowTimestamp();
     return eWithTime;
 }
-let _wrappedEmit;
 let _takeFullSnapshot;
 const mirror = createMirror();
 function record(options = {}) {
@@ -3556,15 +3572,14 @@ function record(options = {}) {
         return e;
     };
     const wrappedEmit = (e, isCheckout) => {
-        var _a;
-        if (((_a = mutationBuffers[0]) === null || _a === void 0 ? void 0 : _a.isFrozen()) &&
+        if (_optionalChain([mutationBuffers, 'access', _ => _[0], 'optionalAccess', _2 => _2.isFrozen, 'call', _3 => _3()]) &&
             e.type !== EventType.FullSnapshot &&
             !(e.type === EventType.IncrementalSnapshot &&
                 e.data.source === IncrementalSource.Mutation)) {
             mutationBuffers.forEach((buf) => buf.unfreeze());
         }
         if (inEmittingFrame) {
-            emit === null || emit === void 0 ? void 0 : emit(eventProcessor(e), isCheckout);
+            _optionalChain([emit, 'optionalCall', _4 => _4(eventProcessor(e), isCheckout)]);
         }
         else if (passEmitsToParent) {
             const message = {
@@ -3593,24 +3608,35 @@ function record(options = {}) {
             }
         }
     };
-    _wrappedEmit = wrappedEmit;
     const wrappedMutationEmit = (m) => {
         wrappedEmit(wrapEvent({
             type: EventType.IncrementalSnapshot,
-            data: Object.assign({ source: IncrementalSource.Mutation }, m),
+            data: {
+                source: IncrementalSource.Mutation,
+                ...m,
+            },
         }));
     };
     const wrappedScrollEmit = (p) => wrappedEmit(wrapEvent({
         type: EventType.IncrementalSnapshot,
-        data: Object.assign({ source: IncrementalSource.Scroll }, p),
+        data: {
+            source: IncrementalSource.Scroll,
+            ...p,
+        },
     }));
     const wrappedCanvasMutationEmit = (p) => wrappedEmit(wrapEvent({
         type: EventType.IncrementalSnapshot,
-        data: Object.assign({ source: IncrementalSource.CanvasMutation }, p),
+        data: {
+            source: IncrementalSource.CanvasMutation,
+            ...p,
+        },
     }));
     const wrappedAdoptedStyleSheetEmit = (a) => wrappedEmit(wrapEvent({
         type: EventType.IncrementalSnapshot,
-        data: Object.assign({ source: IncrementalSource.AdoptedStyleSheet }, a),
+        data: {
+            source: IncrementalSource.AdoptedStyleSheet,
+            ...a,
+        },
     }));
     const stylesheetManager = new StylesheetManager({
         mutationCb: wrappedMutationEmit,
@@ -3635,6 +3661,15 @@ function record(options = {}) {
     }
     const processedNodeManager = new ProcessedNodeManager();
     const canvasManager = _getCanvasManager(getCanvasManager, {
+        mirror,
+        win: window,
+        mutationCb: (p) => wrappedEmit(wrapEvent({
+            type: EventType.IncrementalSnapshot,
+            data: {
+                source: IncrementalSource.CanvasMutation,
+                ...p,
+            },
+        })),
         recordCanvas,
         blockClass,
         blockSelector,
@@ -3745,7 +3780,6 @@ function record(options = {}) {
     try {
         const handlers = [];
         const observe = (doc) => {
-            var _a;
             return callbackWrapper(initObservers)({
                 onMutation,
                 mutationCb: wrappedMutationEmit,
@@ -3758,44 +3792,71 @@ function record(options = {}) {
                 })),
                 mouseInteractionCb: (d) => wrappedEmit(wrapEvent({
                     type: EventType.IncrementalSnapshot,
-                    data: Object.assign({ source: IncrementalSource.MouseInteraction }, d),
+                    data: {
+                        source: IncrementalSource.MouseInteraction,
+                        ...d,
+                    },
                 })),
                 scrollCb: wrappedScrollEmit,
                 viewportResizeCb: (d) => wrappedEmit(wrapEvent({
                     type: EventType.IncrementalSnapshot,
-                    data: Object.assign({ source: IncrementalSource.ViewportResize }, d),
+                    data: {
+                        source: IncrementalSource.ViewportResize,
+                        ...d,
+                    },
                 })),
                 inputCb: (v) => wrappedEmit(wrapEvent({
                     type: EventType.IncrementalSnapshot,
-                    data: Object.assign({ source: IncrementalSource.Input }, v),
+                    data: {
+                        source: IncrementalSource.Input,
+                        ...v,
+                    },
                 })),
                 mediaInteractionCb: (p) => wrappedEmit(wrapEvent({
                     type: EventType.IncrementalSnapshot,
-                    data: Object.assign({ source: IncrementalSource.MediaInteraction }, p),
+                    data: {
+                        source: IncrementalSource.MediaInteraction,
+                        ...p,
+                    },
                 })),
                 styleSheetRuleCb: (r) => wrappedEmit(wrapEvent({
                     type: EventType.IncrementalSnapshot,
-                    data: Object.assign({ source: IncrementalSource.StyleSheetRule }, r),
+                    data: {
+                        source: IncrementalSource.StyleSheetRule,
+                        ...r,
+                    },
                 })),
                 styleDeclarationCb: (r) => wrappedEmit(wrapEvent({
                     type: EventType.IncrementalSnapshot,
-                    data: Object.assign({ source: IncrementalSource.StyleDeclaration }, r),
+                    data: {
+                        source: IncrementalSource.StyleDeclaration,
+                        ...r,
+                    },
                 })),
                 canvasMutationCb: wrappedCanvasMutationEmit,
                 fontCb: (p) => wrappedEmit(wrapEvent({
                     type: EventType.IncrementalSnapshot,
-                    data: Object.assign({ source: IncrementalSource.Font }, p),
+                    data: {
+                        source: IncrementalSource.Font,
+                        ...p,
+                    },
                 })),
                 selectionCb: (p) => {
                     wrappedEmit(wrapEvent({
                         type: EventType.IncrementalSnapshot,
-                        data: Object.assign({ source: IncrementalSource.Selection }, p),
+                        data: {
+                            source: IncrementalSource.Selection,
+                            ...p,
+                        },
                     }));
                 },
                 customElementCb: (c) => {
                     wrappedEmit(wrapEvent({
                         type: EventType.IncrementalSnapshot,
-                        data: Object.assign({ source: IncrementalSource.CustomElement }, c),
+                        data: {
+                            source: IncrementalSource.CustomElement,
+                            ...c,
+                        },
                     }));
                 },
                 blockClass,
@@ -3829,7 +3890,9 @@ function record(options = {}) {
                 processedNodeManager,
                 canvasManager,
                 ignoreCSSAttributes,
-                plugins: ((_a = plugins === null || plugins === void 0 ? void 0 : plugins.filter((p) => p.observer)) === null || _a === void 0 ? void 0 : _a.map((p) => ({
+                plugins: _optionalChain([plugins
+, 'optionalAccess', _5 => _5.filter, 'call', _6 => _6((p) => p.observer)
+, 'optionalAccess', _7 => _7.map, 'call', _8 => _8((p) => ({
                     observer: p.observer,
                     options: p.options,
                     callback: (payload) => wrappedEmit(wrapEvent({
@@ -3839,7 +3902,7 @@ function record(options = {}) {
                             payload,
                         },
                     })),
-                }))) || [],
+                }))]) || [],
             }, {});
         };
         iframeManager.addLoadListener((iframeEl) => {
@@ -3893,21 +3956,18 @@ function takeFullSnapshot(isCheckout) {
     }
     _takeFullSnapshot(isCheckout);
 }
-function wrappedEmit(e) {
-    if (!_wrappedEmit) {
-        return;
-    }
-    _wrappedEmit(e);
-}
 record.mirror = mirror;
 record.takeFullSnapshot = takeFullSnapshot;
 function _getCanvasManager(getCanvasManagerFn, options) {
-    return getCanvasManagerFn
-        ? getCanvasManagerFn(Object.assign(Object.assign({}, options), { mirror, win: window, mutationCb: (p) => wrappedEmit(wrapEvent({
-                type: EventType.IncrementalSnapshot,
-                data: Object.assign({ source: IncrementalSource.CanvasMutation }, p),
-            })) }))
-        : new CanvasManagerNoop();
+    try {
+        return getCanvasManagerFn
+            ? getCanvasManagerFn(options)
+            : new CanvasManagerNoop();
+    }
+    catch (e2) {
+        console.warn('Unable to initialize CanvasManager');
+        return new CanvasManagerNoop();
+    }
 }
 
 const ReplayEventTypeIncrementalSnapshot = 3;
@@ -7345,6 +7405,7 @@ function createOptionsEvent(replay) {
     data: {
       tag: 'options',
       payload: {
+        shouldRecordCanvas: replay.isRecordingCanvas(),
         sessionSampleRate: options.sessionSampleRate,
         errorSampleRate: options.errorSampleRate,
         useCompressionOption: options.useCompression,
@@ -7808,6 +7869,10 @@ class ReplayContainer  {
    * Function to stop recording
    */
 
+  /**
+   * Internal use for canvas recording options
+   */
+
    constructor({
     options,
     recordingOptions,
@@ -7880,6 +7945,13 @@ class ReplayContainer  {
     return this._isPaused;
   }
 
+  /**
+   * Determine if canvas recording is enabled
+   */
+   isRecordingCanvas() {
+    return Boolean(this._canvas);
+  }
+
   /** Get the replay integration options. */
    getOptions() {
     return this._options;
@@ -8000,7 +8072,8 @@ class ReplayContainer  {
    */
    startRecording() {
     try {
-      const canvas = this._options._experiments.canvas;
+      const canvasOptions = this._canvas;
+
       this._stopRecording = record({
         ...this._recordingOptions,
         // When running in error sampling mode, we need to overwrite `checkoutEveryNms`
@@ -8009,12 +8082,14 @@ class ReplayContainer  {
         ...(this.recordingMode === 'buffer' && { checkoutEveryNms: BUFFER_CHECKOUT_TIME }),
         emit: getHandleRecordingEmit(this),
         onMutation: this._onMutationHandler,
-        ...(canvas &&
-          canvas.manager && {
-            recordCanvas: true,
-            getCanvasManager: canvas.manager,
-            ...(CANVAS_QUALITY[canvas.quality || 'medium'] || CANVAS_QUALITY.medium),
-          }),
+        ...(canvasOptions
+          ? {
+              recordCanvas: canvasOptions.recordCanvas,
+              getCanvasManager: canvasOptions.getCanvasManager,
+              sampling: canvasOptions.sampling,
+              dataURLOptions: canvasOptions.dataURLOptions,
+            }
+          : {}),
       });
     } catch (err) {
       this._handleException(err);
@@ -8367,12 +8442,16 @@ class ReplayContainer  {
    * This is only available if performance is enabled, and if an instrumented router is used.
    */
    getCurrentRoute() {
+    // eslint-disable-next-line deprecation/deprecation
     const lastTransaction = this.lastTransaction || getCurrentScope().getTransaction();
-    if (!lastTransaction || !['route', 'custom'].includes(lastTransaction.metadata.source)) {
+
+    const attributes = (lastTransaction && spanToJSON(lastTransaction).data) || {};
+    const source = attributes[SEMANTIC_ATTRIBUTE_SENTRY_SOURCE];
+    if (!lastTransaction || !source || !['route', 'custom'].includes(source)) {
       return undefined;
     }
 
-    return lastTransaction.name;
+    return spanToJSON(lastTransaction).description;
   }
 
   /**
@@ -9336,6 +9415,7 @@ Sentry.init({ replaysOnErrorSampleRate: ${errorSampleRate} })`,
 
     return this._replay.getSessionId();
   }
+
   /**
    * Initializes replay.
    */
@@ -9344,6 +9424,12 @@ Sentry.init({ replaysOnErrorSampleRate: ${errorSampleRate} })`,
       return;
     }
 
+    // We have to run this in _initialize, because this runs in setTimeout
+    // So when this runs all integrations have been added
+    // Before this, we cannot access integrations on the client,
+    // so we need to mutate the options here
+    this._maybeLoadFromReplayCanvasIntegration();
+
     this._replay.initializeSampling();
   }
 
@@ -9357,7 +9443,28 @@ Sentry.init({ replaysOnErrorSampleRate: ${errorSampleRate} })`,
       recordingOptions: this._recordingOptions,
     });
   }
-} Replay.__initStatic();
+
+  /** Get canvas options from ReplayCanvas integration, if it is also added. */
+   _maybeLoadFromReplayCanvasIntegration() {
+    // To save bundle size, we skip checking for stuff here
+    // and instead just try-catch everything - as generally this should all be defined
+    /* eslint-disable @typescript-eslint/no-non-null-assertion */
+    try {
+      const client = getClient();
+      const canvasIntegration = client.getIntegrationByName('ReplayCanvas')
+
+;
+      if (!canvasIntegration) {
+        return;
+      }
+
+      this._replay['_canvas'] = canvasIntegration.getOptions();
+    } catch (e) {
+      // ignore errors here
+    }
+    /* eslint-enable @typescript-eslint/no-non-null-assertion */
+  }
+}Replay.__initStatic();
 
 /** Parse Replay-related options from SDK options */
 function loadReplayOptionsFromClient(initialOptions) {