From 3389dee860a1f7d3f469d92a34194bbf5045bfdb Mon Sep 17 00:00:00 2001
From: Daniel Pokorny <danielp@kontent.ai>
Date: Mon, 11 Nov 2024 11:10:11 +0100
Subject: [PATCH] open iframe links in new window

---
 src/components/sync/SyncEntities.tsx | 4 ++--
 src/utils/sync.ts                    | 9 +++++++--
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/components/sync/SyncEntities.tsx b/src/components/sync/SyncEntities.tsx
index b5d7875..586e55c 100644
--- a/src/components/sync/SyncEntities.tsx
+++ b/src/components/sync/SyncEntities.tsx
@@ -1,7 +1,7 @@
 import React, { useContext, useState } from "react";
 import { useNavigate } from "react-router-dom";
 
-import { DiffResponse, injectResizeScript, removeElementFromHtml } from "../../utils/sync";
+import { DiffResponse, injectScripts, removeElementFromHtml } from "../../utils/sync";
 import { SyncEntityName, WizardContext } from "../../WizardContext";
 import { Loader } from "../Loader";
 import { StepNavigation } from "../menu/StepNavigation";
@@ -72,7 +72,7 @@ export const SyncEntities: React.FC = () => {
       }
 
       const data: DiffResponse = await response.json();
-      const modifiedDiffHtml = injectResizeScript(
+      const modifiedDiffHtml = injectScripts(
         removeElementFromHtml(data.html, ".title"),
       );
 
diff --git a/src/utils/sync.ts b/src/utils/sync.ts
index 5648ee6..4f0545f 100644
--- a/src/utils/sync.ts
+++ b/src/utils/sync.ts
@@ -13,12 +13,16 @@ export const removeElementFromHtml = (
 };
 
 /**
- * appends a script to an HTML, sending height information to parent window via message layer for dynamic resizing
+ * Adds <base> element to open iframe links in new window by default. 
+ * Appends <script>, sending height information to parent window via message layer for dynamic resizing.
  */
-export const injectResizeScript = (htmlString: string): string => {
+export const injectScripts = (htmlString: string): string => {
   const parser = new DOMParser();
   const doc = parser.parseFromString(htmlString, "text/html");
 
+  const base = doc.createElement("base");
+  base.target = "_blank";
+
   const script = doc.createElement("script");
   script.type = "text/javascript";
   // adding 5 to the final height fixed an issue wherein scrollbars sometimes appeared following recalculation
@@ -46,5 +50,6 @@ export const injectResizeScript = (htmlString: string): string => {
       })();
     `;
   doc.body.appendChild(script);
+  doc.head.appendChild(base);
   return doc.documentElement.outerHTML;
 };