fix(sdk,client): initialize crossframe observers after window load event

pkg/sdk/client/dist/client.js

@@ -4095,9 +4095,9 @@ var Edge = (() => {
     constructor() {
       super();
       this.debug = false;
-      this._initResizeObserver();
-      this._initTitleMutationObserver();
       this._handleWindowMessage = this._handleWindowMessage.bind(this);
+      this._initObservers = this._initObservers.bind(this);
+      window.addEventListener("load", this._initObservers);
       window.addEventListener("message", this._handleWindowMessage);
     }
     post(message, target = window.parent) {
@@ -4119,6 +4119,10 @@ var Edge = (() => {
       });
       this.dispatchEvent(event);
     }
+    _initObservers() {
+      this._initResizeObserver();
+      this._initTitleMutationObserver();
+    }
     _initTitleMutationObserver() {
       const titleObserver = new MutationObserver((mutations) => {
         const title2 = mutations[0].target.textContent;
@@ -4132,24 +4136,27 @@ var Edge = (() => {
     }
     _initResizeObserver() {
       const resizeObserver = new ResizeObserver(() => {
-        const body = document.body, html = document.documentElement;
+        const body2 = document.body, html = document.documentElement;
         const height = Math.max(
-          body.scrollHeight,
+          body2.scrollHeight,
-          body.offsetHeight,
+          body2.offsetHeight,
           html.clientHeight,
           html.scrollHeight,
           html.offsetHeight
         );
         const width = Math.max(
-          body.scrollWidth,
+          body2.scrollWidth,
-          body.offsetWidth,
+          body2.offsetWidth,
           html.clientWidth,
           html.scrollWidth,
           html.offsetWidth
         );
         this.post({ type: "size_changed" /* SIZE_CHANGED */, data: { height, width } });
       });
-      resizeObserver.observe(document.body);
+      const body = document.body;
+      if (!body)
+        return;
+      resizeObserver.observe(body);
     }
   };
 

pkg/sdk/client/src/crossframe-messenger.ts

@@ -17,11 +17,10 @@ export class CrossFrameMessenger extends EventTarget {
         super()
         this.debug = false;
 
-        this._initResizeObserver();
-        this._initTitleMutationObserver();
-
         this._handleWindowMessage = this._handleWindowMessage.bind(this);
+        this._initObservers = this._initObservers.bind(this);
 
+        window.addEventListener('load', this._initObservers);
         window.addEventListener('message', this._handleWindowMessage)
     }
 
@@ -46,6 +45,11 @@ export class CrossFrameMessenger extends EventTarget {
         this.dispatchEvent(event);
     }
 
+    _initObservers() {
+        this._initResizeObserver();
+        this._initTitleMutationObserver();
+    }
+
     _initTitleMutationObserver() {
         const titleObserver = new MutationObserver((mutations) => {
             const title = mutations[0].target.textContent;
@@ -75,6 +79,10 @@ export class CrossFrameMessenger extends EventTarget {
             this.post({ type: CrossFrameMessageType.SIZE_CHANGED, data: { height, width }});
         });
 
-        resizeObserver.observe(document.body);
+        const body = document.body;
+
+        if (!body) return;
+
+        resizeObserver.observe(body);
     }
 }