Improved WYSIWYG code block behaviour via range of fixes

[bookstack] / resources / js / components / code-editor.js

diff --git a/resources/js/components/code-editor.js b/resources/js/components/code-editor.js
index 2e3506ec7a428d7dc0c146e8ec1d4e446ce8979f..f44de813de18bf93290e30a484a9ca3e921b26ac 100644 (file)
--- a/resources/js/components/code-editor.js
+++ b/resources/js/components/code-editor.js
@@ -1,4 +1,3 @@
-import Code from "../services/code";
 import {onChildEvent, onEnterPress, onSelect} from "../services/dom";
 
 /**
@@ -60,16 +59,18 @@ class CodeEditor {
         this.languageInput.value = language;
         this.callback = callback;
 
-        this.show();
-        this.updateEditorMode(language);
-
-        Code.setContent(this.editor, code);
+        this.show()
+            .then(() => this.updateEditorMode(language))
+            .then(() => window.importVersioned('code'))
+            .then(Code => Code.setContent(this.editor, code));
     }
 
-    show() {
+    async show() {
+        const Code = await window.importVersioned('code');
         if (!this.editor) {
             this.editor = Code.popupEditor(this.editorInput, this.languageInput.value);
         }
+
         this.loadHistory();
         this.popup.components.popup.show(() => {
             Code.updateLayout(this.editor);
@@ -84,7 +85,8 @@ class CodeEditor {
         this.addHistory();
     }
 
-    updateEditorMode(language) {
+    async updateEditorMode(language) {
+        const Code = await window.importVersioned('code');
         Code.setMode(this.editor, language, this.editor.getValue());
     }