fix(editor): prevent scroll-to-top when clicking toolbar buttons (SD-1780)

Toolbar buttons had tabindex="0" but no mousedown prevention, so
clicking them caused the browser to transfer focus away from the
hidden ProseMirror editor. The subsequent refocus triggered
ProseMirror's selectionToDOM, and the browser asynchronously scrolled
to make the DOM selection visible inside the hidden editor at
position:fixed top:0. This only manifested when the window was the
scroll container (not a div with overflow:auto).

Two fixes applied:

1. Toolbar mousedown preventDefault for non-input elements. This is
   the standard pattern used by ProseMirror's example editor, Tiptap,
   and most WYSIWYG editors. It keeps the PM editor focused throughout
   toolbar interactions.

2. requestAnimationFrame safety net in wrapHiddenEditorFocus. After
   the synchronous scroll restoration, a RAF callback catches any
   async browser scroll caused by layout reflow post-focus.

Author: tupizz

packages/super-editor/src/components/toolbar/Toolbar.vue

@@ -78,10 +78,32 @@ const handleCommand = ({ item, argument, option }) => {
 const restoreSelection = () => {
   proxy.$toolbar.activeEditor?.commands?.restoreSelection();
 };
+
+/**
+ * Prevents the browser's default focus-transfer behavior when clicking toolbar buttons.
+ *
+ * Without this, clicking a toolbar button moves focus from the hidden ProseMirror editor
+ * to the toolbar button element. The subsequent refocus of the PM editor can trigger
+ * browser-native scroll adjustments that jump the page to the top — especially when
+ * the window (not a div) is the scroll container.
+ *
+ * Input elements are excluded so they still receive native focus and cursor placement.
+ */
+const handleToolbarMousedown = (e) => {
+  if (e.target.closest('input, textarea, [contenteditable="true"]')) return;
+  e.preventDefault();
+};
 </script>
 
 <template>
-  <div class="superdoc-toolbar" :key="toolbarKey" role="toolbar" aria-label="Toolbar" data-editor-ui-surface>
+  <div
+    class="superdoc-toolbar"
+    :key="toolbarKey"
+    role="toolbar"
+    aria-label="Toolbar"
+    data-editor-ui-surface
+    @mousedown="handleToolbarMousedown"
+  >
     <n-config-provider abstract preflight-style-disabled>
       <ButtonGroup
         tabindex="0"

packages/super-editor/src/core/presentation-editor/PresentationEditor.ts

@@ -743,6 +743,15 @@ export class PresentationEditor extends EventEmitter {
       if (win.scrollX !== beforeX || win.scrollY !== beforeY) {
         win.scrollTo(beforeX, beforeY);
       }
+
+      // Safety net: the browser may asynchronously scroll after ProseMirror's
+      // selectionToDOM() modifies the DOM selection inside the hidden editor.
+      // A single requestAnimationFrame catches this post-layout scroll.
+      win.requestAnimationFrame(() => {
+        if (win.scrollX !== beforeX || win.scrollY !== beforeY) {
+          win.scrollTo(beforeX, beforeY);
+        }
+      });
     };
   }
 

packages/super-editor/src/core/presentation-editor/tests/PresentationEditor.focusWrapping.test.ts

@@ -355,6 +355,22 @@ describe('PresentationEditor - Focus Wrapping (#wrapHiddenEditorFocus)', () => {
         editor.editor.view.focus();
       }).not.toThrow();
     });
+
+    it('schedules requestAnimationFrame as async scroll safety net', () => {
+      editor = new PresentationEditor({
+        element: container,
+        documentId: 'test-doc',
+        pageSize: { w: 612, h: 792 },
+      });
+
+      const rafSpy = vi.spyOn(window, 'requestAnimationFrame');
+
+      editor.editor.view.focus();
+
+      // RAF should be scheduled to catch async browser scroll after focus
+      expect(rafSpy).toHaveBeenCalledTimes(1);
+      expect(rafSpy).toHaveBeenCalledWith(expect.any(Function));
+    });
   });
 
   describe('mock detection', () => {