From 03ec2d382c8f1ae2e726e13ccf421a131a7f8dc7 Mon Sep 17 00:00:00 2001
From: Kushagra Gour <chinchang457@gmail.com>
Date: Fri, 3 May 2024 16:14:08 +0530
Subject: [PATCH] get preview running for extension

---
 src/components/ContentWrap.jsx | 66 +++++++++++++++++++++++-----------
 1 file changed, 46 insertions(+), 20 deletions(-)

diff --git a/src/components/ContentWrap.jsx b/src/components/ContentWrap.jsx
index a957e91..1e3529a 100644
--- a/src/components/ContentWrap.jsx
+++ b/src/components/ContentWrap.jsx
@@ -181,7 +181,11 @@ export default class ContentWrap extends Component {
 						})
 					]).then(fn);
 					// Setting to blank string cause frame to reload
-					this.frame.src = this.frame.src;
+					if (window.IS_EXTENSION) {
+						this.frame.src = '';
+					} else {
+						this.frame.src = this.frame.src;
+					}
 				};
 				const writeInsideIframe = () => {
 					if (!cachedSandboxAttribute && window.DEBUG) {
@@ -191,10 +195,13 @@ export default class ContentWrap extends Component {
 					// this.frame.setAttribute('sandbox', cachedSandboxAttribute);
 					// this.frame.removeAttribute('sweet');
 					// console.log('sending postmessage');
-					this.frame.contentWindow.postMessage({ contents }, '*');
-					// this.frame.contentDocument.open();
-					// this.frame.contentDocument.write(contents);
-					// this.frame.contentDocument.close();
+					if (window.IS_EXTENSION) {
+						this.frame.contentDocument.open();
+						this.frame.contentDocument.write(contents);
+						this.frame.contentDocument.close();
+					} else {
+						this.frame.contentWindow.postMessage({ contents }, '*');
+					}
 				};
 				refreshAndDo(() => {
 					cachedSandboxAttribute = this.frame.getAttribute('sandbox');
@@ -561,11 +568,20 @@ export default class ContentWrap extends Component {
 		const iframeHeight = iframeBounds.height;
 		document.body.classList.add('is-detached-mode');
 
-		this.detachedWindow = window.open(
-			`${PREVIEW_FRAME_HOST}/preview.html`,
-			'Web Maker',
-			`width=${iframeWidth},height=${iframeHeight},resizable,scrollbars=yes,status=1`
-		);
+		if (window.IS_EXTENSION) {
+			this.detachedWindow = window.open(
+				'./preview.html',
+				'Web Maker',
+				`width=${iframeWidth},height=${iframeHeight},resizable,scrollbars=yes,status=1`
+			);
+		} else {
+			this.detachedWindow = window.open(
+				`${PREVIEW_FRAME_HOST}/preview.html`,
+				'Web Maker',
+				`width=${iframeWidth},height=${iframeHeight},resizable,scrollbars=yes,status=1`
+			);
+		}
+
 		// Trigger initial render in detached window
 		setTimeout(() => {
 			this.setPreviewContent(true);
@@ -929,16 +945,26 @@ export default class ContentWrap extends Component {
 					</div>
 				</SplitPane>
 				<div class="demo-side" id="js-demo-side" style="">
-					<iframe
-						src={`./indexpm.html`}
-						ref={el => (this.frame = el)}
-						frameborder="0"
-						id="demo-frame"
-						sandbox="allow-downloads allow-forms allow-modals allow-pointer-lock allow-popups allow-presentation allow-scripts allow-top-navigation-by-user-activation"
-						allow="accelerometer; camera; encrypted-media; display-capture; geolocation; gyroscope; microphone; midi; clipboard-read; clipboard-write; web-share"
-						allowpaymentrequest="true"
-						allowfullscreen="true"
-					/>
+					{window.IS_EXTENSION ? (
+						<iframe
+							ref={el => (this.frame = el)}
+							frameborder="0"
+							id="demo-frame"
+							allowpaymentrequest="true"
+							allowfullscreen="true"
+						/>
+					) : (
+						<iframe
+							src={`./indexpm.html`}
+							ref={el => (this.frame = el)}
+							frameborder="0"
+							id="demo-frame"
+							sandbox="allow-downloads allow-forms allow-modals allow-pointer-lock allow-popups allow-presentation allow-scripts allow-top-navigation-by-user-activation"
+							allow="accelerometer; camera; encrypted-media; display-capture; geolocation; gyroscope; microphone; midi; clipboard-read; clipboard-write; web-share"
+							allowpaymentrequest="true"
+							allowfullscreen="true"
+						/>
+					)}
 
 					<PreviewDimension ref={comp => (this.previewDimension = comp)} />