diff --git a/src/components/ContentWrap.jsx b/src/components/ContentWrap.jsx index 9eb956e..4e27d9a 100644 --- a/src/components/ContentWrap.jsx +++ b/src/components/ContentWrap.jsx @@ -219,6 +219,11 @@ export default class ContentWrap extends Component { * @param {boolean} isManual Is this a manual preview request from user? */ setPreviewContent(isForced, isManual) { + console.log( + '🔎 setPreviewContent', + this.cmCodes.css, + this.props.currentItem + ); if (!isManual) { let autoPreview = window.forcedSettings.autoPreview !== undefined @@ -309,6 +314,16 @@ export default class ContentWrap extends Component { isValidItem(item) { return !!item.title; } + handleAllModeRequirements() { + if (!this.props.currentItem) { + return Promise.resolve(); + } + return Promise.all([ + handleModeRequirements(this.props.currentItem.htmlMode), + handleModeRequirements(this.props.currentItem.cssMode), + handleModeRequirements(this.props.currentItem.jsMode) + ]); + } refreshEditor() { this.cmCodes.html = this.props.currentItem.html; this.cmCodes.css = this.props.currentItem.css; diff --git a/src/components/app.jsx b/src/components/app.jsx index d4df2cb..45eb184 100644 --- a/src/components/app.jsx +++ b/src/components/app.jsx @@ -281,6 +281,7 @@ export default class App extends Component { code: '' }, result => { + // debugger; this.toggleLayout(result.layoutMode); this.state.prefs.layoutMode = result.layoutMode; if (result.code) { @@ -824,8 +825,9 @@ export default class App extends Component { $('#layoutBtn' + mode).classList.add('selected'); document.body.classList.add('layout-' + mode); - this.setState({ currentLayoutMode: mode }, () => { + this.setState({ currentLayoutMode: mode }, async () => { this.contentWrap.resetSplitting(); + await this.contentWrap.handleAllModeRequirements(); this.contentWrap.setPreviewContent(true); }); } diff --git a/src/utils.js b/src/utils.js index f2c50f5..090b867 100644 --- a/src/utils.js +++ b/src/utils.js @@ -607,6 +607,9 @@ export function prettify({ file, content, type }) { * Loaded the code comiler based on the mode selected */ export function handleModeRequirements(mode) { + if (!mode) { + return Promise.resolve(); + } const baseTranspilerPath = 'lib/transpilers'; // Exit if already loaded var d = deferred();