Merge pull request #560 from magento/render-fix

[1.3-develop] Fix iframe event handling with more than one page builder instance on the page

Author: omiroshnichenko

app/code/Magento/PageBuilder/view/adminhtml/web/js/master-format/render.js

@@ -80,13 +80,13 @@ export default class MasterFormatRenderer {
         this.channel = new MessageChannel();
         const frame = this.getRenderFrame();
         window.addEventListener("message", (event) => {
-            if (!this.ready && event.data === "PB_RENDER_READY") {
+            if (!this.ready && event.data.name === "PB_RENDER_READY" && this.stageId === event.data.stageId) {
                 frame.contentWindow.postMessage("PB_RENDER_PORT", "*", [this.channel.port2]);
                 this.ready = true;
                 this.readyDeferred.resolve();
             }
         });
-        frame.src = Config.getConfig("render_url");
+        frame.src = Config.getConfig("render_url") + "?stageId=" + this.stageId;
     }
 
     /**

app/code/Magento/PageBuilder/view/adminhtml/web/js/master-format/render/frame.js

@@ -41,6 +41,8 @@ const debounceRender = _.debounce((message: {stageId: string, tree: TreeItem}, r
  * Listen for requests from the parent window for a render
  */
 export default function listen(config: ConfigInterface) {
+    const stageId = window.location.href.split("?")[1].split("=")[1];
+
     Config.setConfig(config);
     Config.setMode("Master");
 
@@ -74,7 +76,7 @@ export default function listen(config: ConfigInterface) {
     );
 
     // Inform the parent iframe that we're ready to receive the port
-    window.parent.postMessage("PB_RENDER_READY", "*");
+    window.parent.postMessage({name: "PB_RENDER_READY", stageId}, "*");
 }
 
 /**