fix: custom style rules don't get inserted into some iframe elements (#…

…823) * fix: custom style rules don't get inserted into some iframe elements * code style tweak
rrweb-io · Feb 3, 2022 · 5ec7d9e · 5ec7d9e
1 parent c1111ed
commit 5ec7d9e
Show file tree

Hide file tree

Showing 4 changed files with 709 additions and 12 deletions.
diff --git a/packages/rrweb/src/replay/index.ts b/packages/rrweb/src/replay/index.ts
@@ -660,10 +660,6 @@ export class Replayer {
       this.newDocumentQueue = this.newDocumentQueue.filter(
         (m) => m !== mutationInQueue,
       );
-      if (builtNode.contentDocument) {
-        const { documentElement, head } = builtNode.contentDocument;
-        this.insertStyleRules(documentElement, head);
-      }
     }
     const { documentElement, head } = this.iframe.contentDocument;
     this.insertStyleRules(documentElement, head);
@@ -726,6 +722,13 @@ export class Replayer {
       skipChild: false,
       afterAppend: (builtNode) => {
         this.collectIframeAndAttachDocument(collected, builtNode);
+        if (
+          builtNode.__sn.type === NodeType.Element &&
+          builtNode.__sn.tagName.toUpperCase() === 'HTML'
+        ) {
+          const { documentElement, head } = iframeEl.contentDocument!;
+          this.insertStyleRules(documentElement, head);
+        }
       },
       cache: this.cache,
     });
@@ -734,10 +737,6 @@ export class Replayer {
       this.newDocumentQueue = this.newDocumentQueue.filter(
         (m) => m !== mutationInQueue,
       );
-      if (builtNode.contentDocument) {
-        const { documentElement, head } = builtNode.contentDocument;
-        this.insertStyleRules(documentElement, head);
-      }
     }
   }
 
@@ -1482,10 +1481,6 @@ export class Replayer {
             (m) => m !== mutationInQueue,
           );
         }
-        if (target.contentDocument) {
-          const { documentElement, head } = target.contentDocument;
-          this.insertStyleRules(documentElement, head);
-        }
       }
 
       if (mutation.previousId || mutation.nextId) {