mirror/php-web-maker
1
0
Fork 0
mirror of https://github.com/chinchang/web-maker.git synced 2025-07-28 17:20:13 +02:00
Code Issues Releases Wiki Activity

change preview method to postmessage

Browse Source
This commit is contained in:
Kushagra Gour
2024-03-22 02:57:23 +05:30
parent 4ee7a2a2c0
commit c7e523c374
3 changed files with 59 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
src/components/ContentWrap.jsx
View File

@@ -21,6 +21,10 @@ const minCodeWrapSize = 33;
/* global htmlCodeEl
*/
const PREVIEW_FRAME_HOST = window.DEBUG
? 'http://localhost:7888'
: `https://preview.${location.host}`;
export default class ContentWrap extends Component {
constructor(props) {
super(props);
@@ -161,9 +165,11 @@ export default class ContentWrap extends Component {
this.detachedWindow.postMessage({ contents }, '*');
} else {
const writeInsideIframe = () => {
this.frame.contentDocument.open();
this.frame.contentDocument.write(contents);
this.frame.contentDocument.close();
// this.frame.contentDocument.open();
console.log('sending postmessage');
this.frame.contentWindow.postMessage({ contents }, '*');
// this.frame.contentDocument.write(contents);
// this.frame.contentDocument.close();
};
Promise.race([
// Just in case onload promise doesn't resolves
@@ -175,7 +181,7 @@ export default class ContentWrap extends Component {
})
]).then(writeInsideIframe);
// Setting to blank string cause frame to reload
this.frame.src = '';
// this.frame.src = '';
}
} else {
// we need to store user script in external JS file to prevent inline-script
@@ -242,7 +248,8 @@ export default class ContentWrap extends Component {
if (
!isForced &&
currentCode.html === this.codeInPreview.html &&
currentCode.js === this.codeInPreview.js
currentCode.js === this.codeInPreview.js &&
false
) {
computeCss(
cssMode === CssModes.ACSS ? currentCode.html : currentCode.css,
@@ -901,10 +908,14 @@ export default class ContentWrap extends Component {
</SplitPane>
<div class="demo-side" id="js-demo-side" style="">
<iframe
src={`${PREVIEW_FRAME_HOST}/preview.html`}
ref={el => (this.frame = el)}
frameborder="0"
id="demo-frame"
allowfullscreen
sandbox="allow-downloads allow-forms allow-modals allow-pointer-lock allow-popups allow-presentation allow-same-origin 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)} />