Merge pull request #605 from magento/MC-35389

MC-35389: Support same site

Author: omiroshnichenko

app/code/Magento/PageBuilder/view/adminhtml/web/js/content-type/observable-updater/attributes.js

@@ -3,6 +3,7 @@
  * See COPYING.txt for license details.
  */
 
+import Config from "../../config";
 import {ContentTypeConfigAppearanceElementInterface} from "../../content-type-config.types";
 import ConverterPool from "../../converter/converter-pool";
 import {DataObject} from "../../data-store";
@@ -29,6 +30,7 @@ export default function generate(
         if ("read" === attributeConfig.persistence_mode) {
             continue;
         }
+        // @ts-ignore
         let value;
         if (!!attributeConfig.static) {
             value = attributeConfig.value;
@@ -39,7 +41,15 @@ export default function generate(
         if (converterPool.get(converter)) {
             value = converterPool.get(converter).toDom(attributeConfig.var, data);
         }
-        attributeData[attributeConfig.name] = value;
+
+        // Replacing src attribute with data-tmp-src to prevent img requests in iframe during master format rendering
+        if (attributeConfig.name === "src" && !value.indexOf("{{media url=") && Config.getMode() !== "Preview") {
+            attributeData["data-tmp-" + attributeConfig.name] = value;
+            // @ts-ignore
+            Object.defineProperty(attributeData, attributeConfig.name, { get() { return value; } });
+        } else {
+            attributeData[attributeConfig.name] = value;
+        }
     }
 
     attributeData["data-element"] = elementName;

app/code/Magento/PageBuilder/view/adminhtml/web/js/content-type/observable-updater/html.js

@@ -3,9 +3,11 @@
  * See COPYING.txt for license details.
  */
 
+import Config from "../../config";
 import {ContentTypeConfigAppearanceElementInterface} from "../../content-type-config.types";
 import ConverterPool from "../../converter/converter-pool";
 import {DataObject} from "../../data-store";
+import { replaceWithDataSrc } from "../../utils/directives";
 import {get} from "../../utils/object";
 
 /**
@@ -33,5 +35,11 @@ export default function generate(
     if (typeof value === "string" && !value.length && config.html.placeholder) {
         value = config.html.placeholder;
     }
+
+    // Replacing src attribute with data-tmp-src to prevent img requests in iframe during master format rendering
+    if (Config.getMode() !== "Preview" && typeof value === "string" && value.indexOf("{{media url=") !== -1) {
+        value = replaceWithDataSrc(value);
+    }
+
     return value;
 }

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

@@ -13,7 +13,7 @@ import ConfigInterface from "../../config.types";
 import ContentTypeCollectionInterface from "../../content-type-collection.types";
 import createContentType from "../../content-type-factory";
 import ContentTypeInterface from "../../content-type.types";
-import decodeAllDataUrlsInString from "../../utils/directives";
+import decodeAllDataUrlsInString, { replaceWithSrc } from "../../utils/directives";
 import filterHtml from "../filter-html";
 import { TreeItem } from "./serialize";
 
@@ -160,7 +160,7 @@ function render(message: {stageId: string, tree: TreeItem}) {
                 observer.disconnect();
                 ko.cleanNode(element);
                 const filtered: JQuery = filterHtml($(element));
-                const output = decodeAllDataUrlsInString(filtered.html());
+                const output = replaceWithSrc(decodeAllDataUrlsInString(filtered.html()));
                 resolve(output);
             });
 

app/code/Magento/PageBuilder/view/adminhtml/web/js/utils/directives.js

@@ -131,3 +131,29 @@ export function convertMediaDirectivesToUrls(html: string): string {
     }
     return html;
 }
+
+/**
+ * Replace data-src attribute with src.
+ *
+ * @param {string} html
+ * @returns {string}
+ */
+export function replaceWithSrc(html: string): string {
+    return html.replace(
+        new RegExp("data-tmp-src=\"\{\{", "g"),
+        "src=\"{{",
+    );
+}
+
+/**
+ * Replace src attribute with data-tmp-src.
+ *
+ * @param {string} html
+ * @returns {string}
+ */
+export function replaceWithDataSrc(html: string): string {
+    return html.replace(
+        new RegExp("src=\"\{\{", "g"),
+        "data-tmp-src=\"{{",
+    );
+}