fix(NOJIRA-123): Prevent loading live embed multiple times

Typeform · Nov 20, 2024 · 846944a · 846944a
1 parent be89ed2
commit 846944a
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 4 deletions.
diff --git a/packages/demo-html/public/live-embed.html b/packages/demo-html/public/live-embed.html
@@ -27,7 +27,7 @@
   </head>
   <body>
     <div class="element">I have z-index 10k</div>
-    <div id="wrapper" data-tf-live="embed-id" data-tf-hidden="[email protected]"></div>
+    <div id="wrapper" data-tf-live="01J5X1H8WM5CSXVDN89WXNX5EB" data-tf-hidden="[email protected]"></div>
     <script src="./lib/embed.js"></script>
   </body>
 </html>
diff --git a/packages/embed/src/initializers/initialize-live-embeds.ts b/packages/embed/src/initializers/initialize-live-embeds.ts
@@ -12,17 +12,19 @@ export const initializeLiveEmbeds = ({
 
   for (let index = 0; index < embedTypeElements.length; index += 1) {
     const element = embedTypeElements.item(index)
-    if (forceReload || element.dataset.tfLoaded !== 'true') {
+    const canBeLoaded = element.dataset.tfLoading !== 'true' && element.dataset.tfLoaded !== 'true'
+    if (canBeLoaded || forceReload) {
       const embedId = element.getAttribute(LIVE_EMBED_ATTRIBUTE)
       if (!embedId) {
         throw new Error(`Invalid ${LIVE_EMBED_ATTRIBUTE}=${embedId} for embed #${index}`)
       }
+      element.dataset.tfLoading = 'true'
 
       fetchLiveEmbed(embedId).then(({ html }) => {
         element.innerHTML = html
-        element.dataset.tfLoaded = 'true'
-
         onLiveEmbedLoad(element)
+        delete element.dataset.tfLoading
+        element.dataset.tfLoaded = 'true'
       })
     }
   }