@marimo-team/frontend 0.23.16-dev4 → 0.23.16-dev40

package/src/core/codemirror/find-replace/__tests__/navigate.test.ts

@@ -20,6 +20,26 @@ vi.mock("@/core/cells/cells", () => ({
   getAllEditorViews: () => mockGetAllEditorViews(),
 }));
 
+/**
+ * A view stub that only carries what navigate needs
+ */
+function createMockView(state: EditorState): EditorView {
+  const cell = document.createElement("div");
+  cell.className = "marimo-cell";
+  // jsdom doesn't implement scrollIntoView.
+  cell.scrollIntoView = vi.fn();
+  const dom = document.createElement("div");
+  cell.append(dom);
+
+  return {
+    state,
+    dom,
+    // Don't actually apply changes; it's complex to mock properly and the
+    // assertions only care that dispatch was called.
+    dispatch: vi.fn(),
+  } as unknown as EditorView;
+}
+
 describe("navigate", () => {
   let view1: EditorView;
   let view2: EditorView;
@@ -36,20 +56,8 @@ describe("navigate", () => {
     });
 
     // Create mock views that track dispatch calls
-    view1 = {
-      state: state1,
-      dispatch: vi.fn(() => {
-        // Mock dispatch - in real tests we just need to verify it was called
-        // Don't actually apply changes as it's complex to mock properly
-      }),
-    } as unknown as EditorView;
-
-    view2 = {
-      state: state2,
-      dispatch: vi.fn(() => {
-        // Mock dispatch - in real tests we just need to verify it was called
-      }),
-    } as unknown as EditorView;
+    view1 = createMockView(state1);
+    view2 = createMockView(state2);
 
     mockViews = [view1, view2];
     mockGetAllEditorViews.mockReturnValue(mockViews);
@@ -234,6 +242,22 @@ describe("navigate", () => {
 
       expect(result).toBe(false);
     });
+
+    it("should scroll the cell owning the match into view", async () => {
+      const cell = view1.dom.closest(".marimo-cell");
+      invariant(cell, "mock view should be inside a cell");
+
+      expect(findNext()).toBeTruthy();
+
+      // The scroll is deferred a frame.
+      await new Promise((resolve) => requestAnimationFrame(resolve));
+
+      expect(cell.scrollIntoView).toHaveBeenCalledWith({
+        behavior: "instant",
+        block: "nearest",
+        inline: "nearest",
+      });
+    });
   });
 
   describe("findPrev", () => {
@@ -319,10 +343,7 @@ describe("navigate", () => {
         extensions: [EditorState.readOnly.of(true)],
       });
 
-      const readOnlyView = {
-        state: readOnlyState,
-        dispatch: vi.fn(),
-      } as unknown as EditorView;
+      const readOnlyView = createMockView(readOnlyState);
 
       // Replace view1 with read-only view temporarily
       mockGetAllEditorViews.mockReturnValueOnce([readOnlyView, view2]);
@@ -568,10 +589,7 @@ describe("navigate", () => {
         doc: Text.of(["hello world hello there hello"]),
       });
 
-      const testView = {
-        state: testDoc,
-        dispatch: vi.fn(),
-      } as unknown as EditorView;
+      const testView = createMockView(testDoc);
 
       mockGetAllEditorViews.mockReturnValue([testView]);
 
@@ -613,10 +631,7 @@ describe("navigate", () => {
         doc: Text.of([""]),
       });
 
-      const emptyView = {
-        state: emptyState,
-        dispatch: vi.fn(),
-      } as unknown as EditorView;
+      const emptyView = createMockView(emptyState);
 
       mockGetAllEditorViews.mockReturnValue([emptyView]);
 
@@ -629,10 +644,7 @@ describe("navigate", () => {
         doc: Text.of(["orphan content"]),
       });
 
-      const orphanView = {
-        state: orphanState,
-        dispatch: vi.fn(),
-      } as unknown as EditorView;
+      const orphanView = createMockView(orphanState);
 
       store.set(findReplaceAtom, {
         type: "setCurrentView",

package/src/core/codemirror/find-replace/navigate.ts

@@ -6,6 +6,7 @@ import { EditorView } from "@codemirror/view";
 import { getAllEditorViews } from "@/core/cells/cells";
 import { replaceEditorContent } from "@/core/codemirror/replace-editor-content";
 import { store } from "@/core/state/jotai";
+import { scrollOwnerCell } from "../utils";
 import { asQueryCreator, type QueryType } from "./query";
 import { findReplaceAtom } from "./state";
 
@@ -85,6 +86,7 @@ const findInDirection = (direction: "next" | "prev") =>
         effects: [EditorView.scrollIntoView(selection.main, { y: "center" })],
         userEvent: "select.search",
       });
+      scrollOwnerCell(view);
       store.set(findReplaceAtom, {
         type: "setCurrentView",
         view,

package/src/core/codemirror/go-to-definition/__tests__/commands.test.ts

@@ -3,14 +3,14 @@
 import { python } from "@codemirror/lang-python";
 import { EditorState } from "@codemirror/state";
 import { EditorView } from "@codemirror/view";
-import { afterEach, describe, expect, test } from "vitest";
+import { afterEach, describe, expect, test, vi } from "vitest";
 import { goToVariableDefinition } from "../commands";
 
 async function tick(): Promise<void> {
   await new Promise((resolve) => requestAnimationFrame(resolve));
 }
 
-function createEditor(content: string) {
+function createEditor(content: string, parent: HTMLElement = document.body) {
   const state = EditorState.create({
     doc: content,
     extensions: [python()],
@@ -18,7 +18,7 @@ function createEditor(content: string) {
 
   const view = new EditorView({
     state,
-    parent: document.body,
+    parent,
   });
 
   return view;
@@ -383,6 +383,27 @@ print('myVar')`);
       "
     `);
   });
+
+  test("scrolls the cell owning the definition into view", async () => {
+    const cell = document.createElement("div");
+    cell.className = "marimo-cell";
+    // jsdom doesn't implement scrollIntoView.
+    cell.scrollIntoView = vi.fn();
+    document.body.append(cell);
+
+    view = createEditor("myVar = 10\nprint(myVar)", cell);
+    expect(goToVariableDefinition(view, "myVar")).toBe(true);
+    // The jump and the scroll are both deferred to the next frame.
+    await tick();
+
+    expect(cell.scrollIntoView).toHaveBeenCalledWith({
+      behavior: "instant",
+      block: "nearest",
+      inline: "nearest",
+    });
+
+    cell.remove();
+  });
 });
 
 /**

package/src/core/codemirror/go-to-definition/commands.ts

@@ -4,6 +4,7 @@ import { syntaxTree } from "@codemirror/language";
 import type { EditorState } from "@codemirror/state";
 import { EditorView } from "@codemirror/view";
 import type { SyntaxNode, Tree, TreeCursor } from "@lezer/common";
+import { scrollOwnerCell } from "../utils";
 
 const SCOPE_CREATING_NODES = new Set([
   "FunctionDefinition",
@@ -45,6 +46,8 @@ function goToPosition(view: EditorView, from: number): void {
       }),
     });
   });
+
+  scrollOwnerCell(view);
 }
 
 function findFirstMatchingVariable(

package/src/core/codemirror/keymaps/__tests__/keymaps.test.ts

@@ -1,8 +1,15 @@
 /* Copyright 2026 Marimo. All rights reserved. */
 
-import { defaultKeymap as originalDefaultKeymap } from "@codemirror/commands";
+import {
+  copyLineDown,
+  copyLineUp,
+  defaultKeymap as originalDefaultKeymap,
+} from "@codemirror/commands";
 import { describe, expect, it } from "vitest";
-import { HotkeyProvider } from "@/core/hotkeys/hotkeys";
+import {
+  HotkeyProvider,
+  OverridingHotkeyProvider,
+} from "@/core/hotkeys/hotkeys";
 import { visibleForTesting } from "../keymaps";
 
 const { defaultKeymap, defaultVimKeymap, overrideKeymap, OVERRIDDEN_COMMANDS } =
@@ -40,4 +47,26 @@ describe("keymaps", () => {
       expect(keys.some((k) => k.run === command)).toBe(true);
     }
   });
+
+  it.each([
+    ["cell.copyLineUp", copyLineUp, "Alt-Shift-ArrowUp"],
+    ["cell.copyLineDown", copyLineDown, "Alt-Shift-ArrowDown"],
+  ] as const)(
+    "%s is bound to the configured hotkey, not CodeMirror's default",
+    (action, command, defaultKey) => {
+      // Without an override, the binding matches CodeMirror's default key.
+      expect(
+        overrideKeymap(HotkeyProvider.create()).find((k) => k.run === command)
+          ?.key,
+      ).toBe(defaultKey);
+
+      // With an override, the binding follows the user's configured key.
+      // This is what `editable: true` on these hotkeys promises.
+      expect(
+        overrideKeymap(
+          new OverridingHotkeyProvider({ [action]: "Ctrl-d" }),
+        ).find((k) => k.run === command)?.key,
+      ).toBe("Ctrl-d");
+    },
+  );
 });

package/src/core/codemirror/keymaps/keymaps.ts

@@ -1,6 +1,8 @@
 /* Copyright 2026 Marimo. All rights reserved. */
 
 import {
+  copyLineDown,
+  copyLineUp,
   cursorCharLeft,
   cursorCharRight,
   cursorLineDown,
@@ -94,6 +96,8 @@ export function keymapBundle(
 const OVERRIDDEN_COMMANDS = new Set<Command | undefined>([
   toggleComment,
   toggleBlockComment,
+  copyLineUp,
+  copyLineDown,
 ]);
 
 const defaultKeymap = once(() => {
@@ -111,6 +115,14 @@ const overrideKeymap = (keymap: HotkeyProvider): readonly KeyBinding[] => {
       key: keymap.getHotkey("cell.toggleBlockComment").key,
       run: toggleBlockComment,
     },
+    {
+      key: keymap.getHotkey("cell.copyLineUp").key,
+      run: copyLineUp,
+    },
+    {
+      key: keymap.getHotkey("cell.copyLineDown").key,
+      run: copyLineDown,
+    },
   ];
 };