Ensure the iframe id survives the onceIframeLoaded process; for som…

…e reason I'm seeing the `__sn` attribute on the iframe DOM element disappearing with the callback
eoghanmurray · Apr 5, 2024 · 8f887fa · 8f887fa
1 parent 3d1877c
commit 8f887fa
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 5 deletions.
diff --git a/packages/rrweb-snapshot/src/snapshot.ts b/packages/rrweb-snapshot/src/snapshot.ts
@@ -944,6 +944,7 @@ export function serializeNodeWithId(
     onSerialize?: (n: Node) => unknown;
     onIframeLoad?: (
       iframeNode: HTMLIFrameElement,
+      iframeId: number,
       node: serializedElementNodeWithId,
     ) => unknown;
     iframeLoadTimeout?: number;
@@ -1131,6 +1132,7 @@ export function serializeNodeWithId(
     serializedNode.type === NodeType.Element &&
     serializedNode.tagName === 'iframe'
   ) {
+    const iframeId = serializedNode.id;
     onceIframeLoaded(
       n as HTMLIFrameElement,
       () => {
@@ -1163,8 +1165,10 @@ export function serializeNodeWithId(
           });
 
           if (serializedIframeNode) {
+            // n may have lost it's __sn attribute by the time we get to this callback
             onIframeLoad(
               n as HTMLIFrameElement,
+              iframeId,
               serializedIframeNode as serializedElementNodeWithId,
             );
           }
@@ -1249,6 +1253,7 @@ function snapshot(
     onSerialize?: (n: Node) => unknown;
     onIframeLoad?: (
       iframeNode: HTMLIFrameElement,
+      iframeId: number,
       node: serializedElementNodeWithId,
     ) => unknown;
     iframeLoadTimeout?: number;

diff --git a/packages/rrweb/src/record/iframe-manager.ts b/packages/rrweb/src/record/iframe-manager.ts
@@ -55,12 +55,13 @@ export class IframeManager {
 
   public attachIframe(
     iframeEl: HTMLIFrameElement,
+    parentId: number,
     childSn: serializedNodeWithId,
   ) {
     this.mutationCb({
       adds: [
         {
-          parentId: this.mirror.getId(iframeEl),
+          parentId: parentId,
           nextId: null,
           node: childSn,
         },

diff --git a/packages/rrweb/src/record/index.ts b/packages/rrweb/src/record/index.ts
@@ -391,8 +391,8 @@ function record<T = eventWithTime>(
           shadowDomManager.addShadowRoot(n.shadowRoot, document);
         }
       },
-      onIframeLoad: (iframe, childSn) => {
-        iframeManager.attachIframe(iframe, childSn);
+      onIframeLoad: (iframe, iframeid, childSn) => {
+        iframeManager.attachIframe(iframe, iframeid, childSn);
         shadowDomManager.observeAttachShadow(iframe);
       },
       onStylesheetLoad: (linkEl, childSn) => {

diff --git a/packages/rrweb/src/record/mutation.ts b/packages/rrweb/src/record/mutation.ts
@@ -329,8 +329,8 @@ export default class MutationBuffer {
             this.shadowDomManager.addShadowRoot(n.shadowRoot, this.doc);
           }
         },
-        onIframeLoad: (iframe, childSn) => {
-          this.iframeManager.attachIframe(iframe, childSn);
+        onIframeLoad: (iframe, iframeId, childSn) => {
+          this.iframeManager.attachIframe(iframe, iframeId, childSn);
           this.shadowDomManager.observeAttachShadow(iframe);
         },
         onStylesheetLoad: (link, childSn) => {