From f7550c8c4790c96c011d48c15588ab0d3fabdd75 Mon Sep 17 00:00:00 2001
From: Martin McKeaveney <martin@shogunsystems.co.uk>
Date: Tue, 9 Nov 2021 12:15:29 +0100
Subject: [PATCH] adding flags for messagePassing

---
 .../src/builderStore/store/frontend.js        |  1 +
 .../AppPreview/CurrentItemPreview.svelte      | 29 ++++++++++++++++---
 packages/client/manifest.json                 |  3 +-
 3 files changed, 28 insertions(+), 5 deletions(-)

diff --git a/packages/builder/src/builderStore/store/frontend.js b/packages/builder/src/builderStore/store/frontend.js
index 9110aa1430..97c4f58604 100644
--- a/packages/builder/src/builderStore/store/frontend.js
+++ b/packages/builder/src/builderStore/store/frontend.js
@@ -44,6 +44,7 @@ const INITIAL_FRONTEND_STATE = {
     state: false,
     customThemes: false,
     devicePreview: false,
+    messagePassing: false,
   },
   currentFrontEndType: "none",
   selectedScreenId: "",
diff --git a/packages/builder/src/components/design/AppPreview/CurrentItemPreview.svelte b/packages/builder/src/components/design/AppPreview/CurrentItemPreview.svelte
index 99de9f7942..d5c8230558 100644
--- a/packages/builder/src/components/design/AppPreview/CurrentItemPreview.svelte
+++ b/packages/builder/src/components/design/AppPreview/CurrentItemPreview.svelte
@@ -96,7 +96,9 @@
         // Initialise the app when mounted
         // Display preview immediately if the intelligent loading feature
         // is not supported
-        if (!loading) return
+        if ($store.clientFeatures.messagePassing) {
+          if (!loading) return
+        }
 
         if (!$store.clientFeatures.intelligentLoading) {
           loading = false
@@ -116,18 +118,37 @@
   }
 
   onMount(() => {
-    window.addEventListener("message", receiveMessage)
+    if ($store.clientFeatures.messagePassing) {
+      window.addEventListener("message", receiveMessage)
+    } else {
+      // Legacy - remove in later versions of BB
+       iframe.contentWindow.addEventListener("ready", () => {
+        receiveMessage({ data: { type: MessageTypes.READY }})
+      }, { once: true })
+       iframe.contentWindow.addEventListener("error", event => {
+        receiveMessage({ data: { type: MessageTypes.ERROR, error: event.detail }})
+      }, { once: true })
+      // Add listener for events sent by client library in preview
+      iframe.contentWindow.addEventListener("bb-event", handleBudibaseEvent)
+      iframe.contentWindow.addEventListener("keydown", handleKeydownEvent)
+    }
   })
 
   // Remove all iframe event listeners on component destroy
   onDestroy(() => {
     if (iframe.contentWindow) {
+      if ($store.clientFeatures.messagePassing) {
       window.removeEventListener("message", receiveMessage) //
+      } else {
+        // Legacy - remove in later versions of BB
+        iframe.contentWindow.removeEventListener("bb-event", handleBudibaseEvent)
+        iframe.contentWindow.removeEventListener("keydown", handleKeydownEvent)
+      }
     }
   })
 
   const handleBudibaseEvent = event => {
-    const { type, data } = event.data
+    const { type, data } = event.data || event.detail
     if (type === "select-component" && data.id) {
       store.actions.components.select({ _id: data.id })
     } else if (type === "update-prop") {
@@ -164,7 +185,7 @@
   }
 
   const handleKeydownEvent = event => {
-    const { key } = event.data
+    const { key } = event.data || event
     if (
       (key === "Delete" || key === "Backspace") &&
       selectedComponentId &&
diff --git a/packages/client/manifest.json b/packages/client/manifest.json
index 2adfd96626..53d2d09638 100644
--- a/packages/client/manifest.json
+++ b/packages/client/manifest.json
@@ -5,7 +5,8 @@
     "deviceAwareness": true,
     "state": true,
     "customThemes": true,
-    "devicePreview": true
+    "devicePreview": true,
+    "messagePassing": true
   },
   "layout": {
     "name": "Layout",