fix: defer event bind until contentWindow exists

Author: chrisvxd

src/view/event-bindings/bind-events.ts

@@ -17,23 +17,40 @@ function getOptions(
   };
 }
 
-let loaded = false;
+const getWin = (el: HTMLElement | Window) => {
+  let win = el as Window | null;
 
-function bindEvent(win: Window, binding: EventBinding, options: EventOptions) {
+  if ((el as HTMLElement).nodeName === 'IFRAME') {
+    win = (el as HTMLIFrameElement).contentWindow;
+  }
+
+  return win;
+};
+
+function bindEvent(
+  el: HTMLElement | Window,
+  binding: EventBinding,
+  options: EventOptions,
+) {
   let timer: number | undefined;
 
-  if (!loaded) {
-    // Some browsers require us to defer binding events, i.e. Safari
+  if ((el as HTMLElement).nodeName === 'IFRAME') {
     timer = setInterval(() => {
-      if ((win as Window).document.readyState === 'complete') {
-        win.addEventListener(binding.eventName, binding.fn, options);
-        loaded = true;
+      const currentWin = getWin(el);
+
+      if (currentWin?.document.readyState === 'complete') {
+        currentWin.addEventListener(binding.eventName, binding.fn, options);
+        clearInterval(timer);
       }
     }, 100);
-  } else {
-    win.addEventListener(binding.eventName, binding.fn, options);
+
+    return timer;
   }
 
+  const win = getWin(el);
+
+  win?.addEventListener(binding.eventName, binding.fn, options);
+
   return timer;
 }
 
@@ -49,18 +66,19 @@ export default function bindEvents(
         '[data-rfd-iframe]',
       ) as HTMLIFrameElement[];
 
-      const windows = [el, ...iframes.map((iframe) => iframe.contentWindow)];
+      const els = [el, ...iframes];
 
-      return windows.map((win) => {
-        if (!win) return function unbind() {};
+      return els.map((currentEl) => {
+        if (!currentEl) return function unbind() {};
 
         const options = getOptions(sharedOptions, binding.options);
 
-        const timer = bindEvent(win as Window, binding, options);
+        const timer = bindEvent(currentEl, binding, options);
 
         return function unbind() {
           clearInterval(timer);
-          win.removeEventListener(binding.eventName, binding.fn, options);
+          const win = getWin(currentEl);
+          win?.removeEventListener(binding.eventName, binding.fn, options);
         };
       });
     },