Pref Editor: Improve update on scroll (#15005)

eclipse-theia · Feb 28, 2025 · b950571 · b950571
1 parent 3b6c068
commit b950571
Showing 1 changed file with 13 additions and 2 deletions.
diff --git a/packages/preferences/src/browser/views/preference-editor-widget.ts b/packages/preferences/src/browser/views/preference-editor-widget.ts
@@ -275,9 +275,12 @@ export class PreferencesEditorWidget extends BaseWidget implements StatefulWidge
         }
     }
 
+    protected shouldUpdateModelSelection = true;
+
     protected setFirstVisibleChildID(id?: string): void {
         if (id && id !== this.firstVisibleChildID) {
             this.firstVisibleChildID = id;
+            if (!this.shouldUpdateModelSelection) { return; }
             let currentNode = this.model.getNode(id);
             let expansionAncestor;
             let selectionAncestor;
@@ -314,18 +317,26 @@ export class PreferencesEditorWidget extends BaseWidget implements StatefulWidge
                     if (renderer?.visible) {
                         // When filtered, treat the first visible child as the selected node, since it will be the one scrolled to.
                         this.lastUserSelection = renderer.nodeId;
-                        renderer.node.scrollIntoView();
+                        this.scrollWithoutModelUpdate(renderer.node);
                         return;
                     }
                 }
             } else {
                 const { id, collection } = this.analyzeIDAndGetRendererGroup(node.id);
                 const renderer = collection.get(id);
-                renderer?.node.scrollIntoView();
+                this.scrollWithoutModelUpdate(renderer?.node);
             }
         }
     }
 
+    /** Ensures that we don't set the model's selection while attempting to scroll in reaction to a model selection change. */
+    protected scrollWithoutModelUpdate(node?: HTMLElement): void {
+        if (!node) { return; }
+        this.shouldUpdateModelSelection = false;
+        node.scrollIntoView();
+        requestAnimationFrame(() => this.shouldUpdateModelSelection = true);
+    }
+
     protected analyzeIDAndGetRendererGroup(nodeID: string): { id: string, group: string, collection: Map<string, GeneralPreferenceNodeRenderer> } {
         const { id, group } = Preference.TreeNode.getGroupAndIdFromNodeId(nodeID);
         const collection = group === COMMONLY_USED_SECTION_PREFIX ? this.commonlyUsedRenderers : this.renderers;