fix code editor sometimes not rendering

libraries/codemirror/mode/meta.js

@@ -70,8 +70,8 @@
     {name: "Pug", mime: "text/x-pug", mode: "pug", ext: ["jade", "pug"], alias: ["jade"]},
     {name: "Java", mime: "text/x-java", mode: "clike", ext: ["java"]},
     {name: "Java Server Pages", mime: "application/x-jsp", mode: "htmlembedded", ext: ["jsp"], alias: ["jsp"]},
-    {name: "JavaScript", mimes: ["text/javascript", "text/ecmascript", "application/javascript", "application/x-javascript", "application/ecmascript"],
-     mode: "javascript", ext: ["js"], alias: ["ecmascript", "js", "node"]},
+    {name: "JavaScript", mimes: ["text/javascript", "text/ecmascript", "application/javascript", "application/x-javascript", "application/ecmascript", "application/javascript;env=frontend", "application/javascript;env=backend"],
+      mode: "javascript", ext: ["js"], alias: ["ecmascript", "js", "node"]},
     {name: "JSON", mimes: ["application/json", "application/x-json"], mode: "javascript", ext: ["json", "map"], alias: ["json5"]},
     {name: "JSON-LD", mime: "application/ld+json", mode: "javascript", ext: ["jsonld"], alias: ["jsonld"]},
     {name: "JSX", mime: "text/jsx", mode: "jsx", ext: ["jsx"]},

src/public/javascripts/services/note_detail_code.js

@@ -54,9 +54,6 @@ class NoteDetailCode {
             this.onNoteChange(() => this.ctx.noteChanged());
         }
 
-        this.$component.show();
-
-        // this needs to happen after the element is shown, otherwise the editor won't be refreshed
         // CodeMirror breaks pretty badly on null so even though it shouldn't happen (guarded by consistency check)
         // we provide fallback
         this.codeEditor.setValue(this.ctx.note.content || "");
@@ -68,6 +65,11 @@ class NoteDetailCode {
             CodeMirror.autoLoadMode(this.codeEditor, info.mode);
         }
 
+        this.show();
+    }
+
+    show() {
+        this.$component.show();
         this.codeEditor.refresh();
     }
 

src/public/javascripts/services/note_detail_empty.js

@@ -28,6 +28,8 @@ class NoteDetailEmpty {
         this.$autoComplete.focus();
     }
 
+    show() {}
+
     getContent() {}
 
     focus() {}

src/public/javascripts/services/note_detail_file.js

@@ -59,6 +59,8 @@ class NoteDetailFile {
         return utils.getHost() + "/api/notes/" + this.ctx.note.noteId + "/download";
     }
 
+    show() {}
+
     getContent() {}
 
     focus() {}

src/public/javascripts/services/note_detail_image.js

@@ -67,6 +67,8 @@ class NoteDetailImage {
         return utils.getHost() + `/api/notes/${this.ctx.note.noteId}/download`;
     }
 
+    show() {}
+
     getContent() {}
 
     focus() {}

src/public/javascripts/services/note_detail_protected_session.js

@@ -24,6 +24,8 @@ class NoteDetailProtectedSession {
         this.$component.show();
     }
 
+    show() {}
+
     getContent() {}
 
     focus() {}

src/public/javascripts/services/note_detail_relation_map.js

@@ -616,6 +616,8 @@ class NoteDetailRelationMap {
         return JSON.stringify(this.mapData);
     }
 
+    show() {}
+
     focus() {}
 
     onNoteChange() {}

src/public/javascripts/services/note_detail_render.js

@@ -43,6 +43,8 @@ class NoteDetailRender {
 
     getContent() {}
 
+    show() {}
+
     focus() {}
 
     onNoteChange() {}

src/public/javascripts/services/note_detail_search.js

@@ -45,6 +45,8 @@ class NoteDetailSearch {
 
     focus() {}
 
+    show() {}
+
     onNoteChange() {}
 
     cleanup() {}

src/public/javascripts/services/note_detail_text.js

@@ -77,6 +77,8 @@ class NoteDetailText {
         this.$editorEl.focus();
     }
 
+    show() {}
+
     getEditor() {
         return this.textEditor;
     }

src/public/javascripts/services/tab_context.js

@@ -158,6 +158,7 @@ class TabContext {
         this.$tabContent.show();
         this.setCurrentNotePathToHash();
         this.setTitleBar();
+        this.getComponent().show();
     }
 
     setTitleBar() {