Preserve the scroll position when refreshing CodeMirror

See https://www.woltlab.com/community/thread/303004-stileditor-vergisst-die-aktive-code-zeile-beim-tab-wechsel/

diff --git a/ts/WoltLabSuite/Core/Acp/Ui/Style/Editor.ts b/ts/WoltLabSuite/Core/Acp/Ui/Style/Editor.ts
index c14f51c597a198624f4f775a96d8e862697f57db..38cb823811c49f983f070b03357202786aaa2c46 100644 (file)
--- a/ts/WoltLabSuite/Core/Acp/Ui/Style/Editor.ts
+++ b/ts/WoltLabSuite/Core/Acp/Ui/Style/Editor.ts
@@ -59,19 +59,24 @@ function handleScss(isTainted: boolean): void {
   const individualScss = document.getElementById("individualScss")!;
   const overrideScss = document.getElementById("overrideScss")!;
 
+  const refreshCodeMirror = (element: any): void => {
+    element.codemirror.refresh();
+    element.codemirror.setCursor(element.codemirror.getCursor());
+  };
+
   if (isTainted) {
     EventHandler.add("com.woltlab.wcf.simpleTabMenu_styleTabMenuContainer", "select", () => {
-      (individualScss as any).codemirror.refresh();
-      (overrideScss as any).codemirror.refresh();
+      refreshCodeMirror(individualScss);
+      refreshCodeMirror(overrideScss);
     });
   } else {
     EventHandler.add("com.woltlab.wcf.simpleTabMenu_advanced", "select", (data: { activeName: string }) => {
       if (data.activeName === "advanced-custom") {
-        (document.getElementById("individualScssCustom") as any).codemirror.refresh();
-        (document.getElementById("overrideScssCustom") as any).codemirror.refresh();
+        refreshCodeMirror(document.getElementById("individualScssCustom"));
+        refreshCodeMirror(document.getElementById("overrideScssCustom"));
       } else if (data.activeName === "advanced-original") {
-        (individualScss as any).codemirror.refresh();
-        (overrideScss as any).codemirror.refresh();
+        refreshCodeMirror(individualScss);
+        refreshCodeMirror(overrideScss);
       }
     });
   }

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Style/Editor.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Style/Editor.js
index ea5db78513d02d26058243d0883609a3695727d2..3d91138b4d370b3543c2ec058f992205219f55a6 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Style/Editor.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Style/Editor.js
@@ -49,21 +49,25 @@ define(["require", "exports", "tslib", "../../../Ajax", "../../../Core", "../../
     function handleScss(isTainted) {
         const individualScss = document.getElementById("individualScss");
         const overrideScss = document.getElementById("overrideScss");
+        const refreshCodeMirror = (element) => {
+            element.codemirror.refresh();
+            element.codemirror.setCursor(element.codemirror.getCursor());
+        };
         if (isTainted) {
             EventHandler.add("com.woltlab.wcf.simpleTabMenu_styleTabMenuContainer", "select", () => {
-                individualScss.codemirror.refresh();
-                overrideScss.codemirror.refresh();
+                refreshCodeMirror(individualScss);
+                refreshCodeMirror(overrideScss);
             });
         }
         else {
             EventHandler.add("com.woltlab.wcf.simpleTabMenu_advanced", "select", (data) => {
                 if (data.activeName === "advanced-custom") {
-                    document.getElementById("individualScssCustom").codemirror.refresh();
-                    document.getElementById("overrideScssCustom").codemirror.refresh();
+                    refreshCodeMirror(document.getElementById("individualScssCustom"));
+                    refreshCodeMirror(document.getElementById("overrideScssCustom"));
                 }
                 else if (data.activeName === "advanced-original") {
-                    individualScss.codemirror.refresh();
-                    overrideScss.codemirror.refresh();
+                    refreshCodeMirror(individualScss);
+                    refreshCodeMirror(overrideScss);
                 }
             });
         }