@highlight-run/rrweb 2.0.5 → 2.0.8

package/es/rrweb/packages/rrweb/src/record/mutation.js

@@ -166,6 +166,7 @@ class MutationBuffer {
                     onStylesheetLoad: (link, childSn) => {
                         this.stylesheetManager.attachStylesheet(link, childSn, this.mirror);
                     },
+                    newlyAddedElement: true,
                 });
                 if (sn) {
                     adds.push({
@@ -274,7 +275,8 @@ class MutationBuffer {
             switch (m.type) {
                 case 'characterData': {
                     const value = m.target.textContent;
-                    if (!isBlocked(m.target, this.blockClass) && value !== m.oldValue) {
+                    if (!isBlocked(m.target, this.blockClass, false) &&
+                        value !== m.oldValue) {
                         this.texts.push({
                             value: needMaskingText(m.target, this.maskTextClass, this.maskTextSelector) && value
                                 ? this.maskTextFn
@@ -298,7 +300,8 @@ class MutationBuffer {
                             maskInputFn: this.maskInputFn,
                         });
                     }
-                    if (isBlocked(m.target, this.blockClass) || value === m.oldValue) {
+                    if (isBlocked(m.target, this.blockClass, false) ||
+                        value === m.oldValue) {
                         return;
                     }
                     let item = this.attributes.find((a) => a.node === m.target);
@@ -352,13 +355,15 @@ class MutationBuffer {
                     break;
                 }
                 case 'childList': {
+                    if (isBlocked(m.target, this.blockClass, true))
+                        return;
                     m.addedNodes.forEach((n) => this.genAdds(n, m.target));
                     m.removedNodes.forEach((n) => {
                         const nodeId = this.mirror.getId(n);
                         const parentId = isShadowRoot(m.target)
                             ? this.mirror.getId(m.target.host)
                             : this.mirror.getId(m.target);
-                        if (isBlocked(m.target, this.blockClass) ||
+                        if (isBlocked(m.target, this.blockClass, false) ||
                             isIgnored(n, this.mirror) ||
                             !isSerialized(n, this.mirror)) {
                             return;
@@ -387,16 +392,13 @@ class MutationBuffer {
             }
         };
         this.genAdds = (n, target) => {
-            if (target && isBlocked(target, this.blockClass)) {
-                return;
-            }
-            if (this.mirror.getMeta(n)) {
+            if (this.mirror.hasNode(n)) {
                 if (isIgnored(n, this.mirror)) {
                     return;
                 }
                 this.movedSet.add(n);
                 let targetId = null;
-                if (target && this.mirror.getMeta(target)) {
+                if (target && this.mirror.hasNode(target)) {
                     targetId = this.mirror.getId(target);
                 }
                 if (targetId && targetId !== -1) {
@@ -407,7 +409,7 @@ class MutationBuffer {
                 this.addedSet.add(n);
                 this.droppedSet.delete(n);
             }
-            if (!isBlocked(n, this.blockClass))
+            if (!isBlocked(n, this.blockClass, false))
                 n.childNodes.forEach((childN) => this.genAdds(childN));
         };
     }
@@ -467,6 +469,11 @@ function deepDelete(addsSet, n) {
     n.childNodes.forEach((childN) => deepDelete(addsSet, childN));
 }
 function isParentRemoved(removes, n, mirror) {
+    if (removes.length === 0)
+        return false;
+    return _isParentRemoved(removes, n, mirror);
+}
+function _isParentRemoved(removes, n, mirror) {
     const { parentNode } = n;
     if (!parentNode) {
         return false;
@@ -475,9 +482,14 @@ function isParentRemoved(removes, n, mirror) {
     if (removes.some((r) => r.id === parentId)) {
         return true;
     }
-    return isParentRemoved(removes, parentNode, mirror);
+    return _isParentRemoved(removes, parentNode, mirror);
 }
 function isAncestorInSet(set, n) {
+    if (set.size === 0)
+        return false;
+    return _isAncestorInSet(set, n);
+}
+function _isAncestorInSet(set, n) {
     const { parentNode } = n;
     if (!parentNode) {
         return false;
@@ -485,7 +497,7 @@ function isAncestorInSet(set, n) {
     if (set.has(parentNode)) {
         return true;
     }
-    return isAncestorInSet(set, parentNode);
+    return _isAncestorInSet(set, parentNode);
 }
 
 export { MutationBuffer as default };

package/es/rrweb/packages/rrweb/src/record/observer.js

@@ -110,7 +110,7 @@ function initMouseInteractionObserver({ mouseInteractionCb, doc, mirror, blockCl
     const getHandler = (eventKey) => {
         return (event) => {
             const target = getEventTarget(event);
-            if (isBlocked(target, blockClass) ||
+            if (isBlocked(target, blockClass, true) ||
                 isCanvasNode(target)) {
                 return;
             }
@@ -144,7 +144,7 @@ function initMouseInteractionObserver({ mouseInteractionCb, doc, mirror, blockCl
 function initScrollObserver({ scrollCb, doc, mirror, blockClass, sampling, }) {
     const updatePosition = throttle((evt) => {
         const target = getEventTarget(evt);
-        if (!target || isBlocked(target, blockClass)) {
+        if (!target || isBlocked(target, blockClass, true)) {
             return;
         }
         const id = mirror.getId(target);
@@ -200,7 +200,7 @@ function initInputObserver({ inputCb, doc, mirror, blockClass, ignoreClass, mask
         if (!target ||
             !target.tagName ||
             INPUT_TAGS.indexOf(target.tagName) < 0 ||
-            isBlocked(target, blockClass)) {
+            isBlocked(target, blockClass, true)) {
             return;
         }
         const type = target.type;
@@ -335,8 +335,8 @@ function initStyleSheetObserver({ styleSheetRuleCb, mirror }, { win }) {
     const unmodifiedFunctions = {};
     Object.entries(supportedNestedCSSRuleTypes).forEach(([typeKey, type]) => {
         unmodifiedFunctions[typeKey] = {
-            insertRule: (type).prototype.insertRule,
-            deleteRule: (type).prototype.deleteRule,
+            insertRule: type.prototype.insertRule,
+            deleteRule: type.prototype.deleteRule,
         };
         type.prototype.insertRule = function (rule, index) {
             const id = mirror.getId(this.parentStyleSheet.ownerNode);
@@ -417,7 +417,7 @@ function initStyleDeclarationObserver({ styleDeclarationCb, mirror }, { win }) {
 function initMediaInteractionObserver({ mediaInteractionCb, blockClass, mirror, sampling, }) {
     const handler = (type) => throttle((event) => {
         const target = getEventTarget(event);
-        if (!target || isBlocked(target, blockClass)) {
+        if (!target || isBlocked(target, blockClass, true)) {
             return;
         }
         const { currentTime, volume, muted } = target;

package/es/rrweb/packages/rrweb/src/record/observers/canvas/2d.js

@@ -12,7 +12,7 @@ function initCanvas2DMutationObserver(cb, win, blockClass, mirror) {
             }
             const restoreHandler = patch(win.CanvasRenderingContext2D.prototype, prop, function (original) {
                 return function (...args) {
-                    if (!isBlocked(this.canvas, blockClass)) {
+                    if (!isBlocked(this.canvas, blockClass, true)) {
                         setTimeout(() => {
                             const recordArgs = serializeArgs([...args], win, this);
                             cb(this.canvas, {

package/es/rrweb/packages/rrweb/src/record/observers/canvas/canvas.js

@@ -5,9 +5,9 @@ function initCanvasContextObserver(win, blockClass) {
     try {
         const restoreHandler = patch(win.HTMLCanvasElement.prototype, 'getContext', function (original) {
             return function (contextType, ...args) {
-                if (!isBlocked(this, blockClass)) {
+                if (!isBlocked(this, blockClass, true)) {
                     if (!('__context' in this))
-                        (this).__context = contextType;
+                        this.__context = contextType;
                 }
                 return original.apply(this, [contextType, ...args]);
             };

package/es/rrweb/packages/rrweb/src/record/observers/canvas/webgl.js

@@ -14,8 +14,7 @@ function patchGLPrototype(prototype, type, cb, blockClass, mirror, win) {
                 return function (...args) {
                     const result = original.apply(this, args);
                     saveWebGLVar(result, win, prototype);
-                    if (!isBlocked(this.canvas, blockClass)) {
-                        const id = mirror.getId(this.canvas);
+                    if (!isBlocked(this.canvas, blockClass, true)) {
                         const recordArgs = serializeArgs([...args], win, prototype);
                         const mutation = {
                             type,

package/es/rrweb/packages/rrweb/src/utils.js

@@ -1,4 +1,4 @@
-import { IGNORED_NODE, isShadowRoot } from '../../rrweb-snapshot/es/rrweb-snapshot.js';
+import { classMatchesRegex, IGNORED_NODE, isShadowRoot } from '../../rrweb-snapshot/es/rrweb-snapshot.js';
 
 function on(type, fn, target = document) {
     const options = { capture: true, passive: true };
@@ -131,33 +131,26 @@ const isCanvasNode = (node) => {
     }
     return false;
 };
-function isBlocked(node, blockClass) {
+function isBlocked(node, blockClass, checkAncestors) {
     if (!node) {
         return false;
     }
-    if (node.nodeType === node.ELEMENT_NODE) {
-        let needBlock = false;
-        if (typeof blockClass === 'string') {
-            if (node.closest !== undefined) {
-                return node.closest('.' + blockClass) !== null;
-            }
-            else {
-                needBlock = node.classList.contains(blockClass);
-            }
-        }
-        else {
-            node.classList.forEach((className) => {
-                if (blockClass.test(className)) {
-                    needBlock = true;
-                }
-            });
-        }
-        return needBlock || isBlocked(node.parentNode, blockClass);
+    const el = node.nodeType === node.ELEMENT_NODE
+        ? node
+        : node.parentElement;
+    if (!el)
+        return false;
+    if (typeof blockClass === 'string') {
+        if (el.classList.contains(blockClass))
+            return true;
+        if (checkAncestors && el.closest('.' + blockClass) !== null)
+            return true;
     }
-    if (node.nodeType === node.TEXT_NODE) {
-        return isBlocked(node.parentNode, blockClass);
+    else {
+        if (classMatchesRegex(el, blockClass, checkAncestors))
+            return true;
     }
-    return isBlocked(node.parentNode, blockClass);
+    return false;
 }
 function isSerialized(n, mirror) {
     return mirror.getId(n) !== -1;