@marimo-team/frontend 0.23.10-dev1 → 0.23.10-dev2

package/dist/index.html

@@ -66,7 +66,7 @@
     <marimo-server-token data-token="{{ server_token }}" hidden></marimo-server-token>
     <!-- /TODO -->
     <title>{{ title }}</title>
-    <script type="module" crossorigin src="./assets/index-CE1XkZU_.js"></script>
+    <script type="module" crossorigin src="./assets/index-CgI7_ZFC.js"></script>
     <link rel="modulepreload" crossorigin href="./assets/preload-helper-BPPi7vOr.js">
     <link rel="modulepreload" crossorigin href="./assets/chunk-LvLJmgfZ.js">
     <link rel="modulepreload" crossorigin href="./assets/react-Bj1aDYRI.js">
@@ -133,7 +133,7 @@
     <link rel="modulepreload" crossorigin href="./assets/debounce-DhnxH9Rh.js">
     <link rel="modulepreload" crossorigin href="./assets/database-zap-kIkTfzTX.js">
     <link rel="modulepreload" crossorigin href="./assets/main-B0OX4z33.js">
-    <link rel="modulepreload" crossorigin href="./assets/cells-BsaJrRWi.js">
+    <link rel="modulepreload" crossorigin href="./assets/cells-DZTFtAVj.js">
     <link rel="modulepreload" crossorigin href="./assets/ErrorBoundary-DyYDV0HI.js">
     <link rel="modulepreload" crossorigin href="./assets/kbd-CTUAEnEx.js">
     <link rel="modulepreload" crossorigin href="./assets/useInstallPackage-DUF4IRRI.js">
@@ -147,35 +147,35 @@
     <link rel="modulepreload" crossorigin href="./assets/usePress-DQ_tAz5W.js">
     <link rel="modulepreload" crossorigin href="./assets/input-C3Hrdlqq.js">
     <link rel="modulepreload" crossorigin href="./assets/ImperativeModal-B3Th7k4R.js">
-    <link rel="modulepreload" crossorigin href="./assets/cell-link-B1pHtGWp.js">
+    <link rel="modulepreload" crossorigin href="./assets/cell-link-D26yaUlf.js">
     <link rel="modulepreload" crossorigin href="./assets/multi-map-CUuNtzHt.js">
     <link rel="modulepreload" crossorigin href="./assets/alert-yTS3WpF4.js">
     <link rel="modulepreload" crossorigin href="./assets/chevron-right-CG5QYXYk.js">
     <link rel="modulepreload" crossorigin href="./assets/dropdown-menu-CR7cnzLX.js">
     <link rel="modulepreload" crossorigin href="./assets/links-D1JoyKTt.js">
-    <link rel="modulepreload" crossorigin href="./assets/useRunCells-BiCBGyeW.js">
+    <link rel="modulepreload" crossorigin href="./assets/useRunCells-Dt6DS29E.js">
     <link rel="modulepreload" crossorigin href="./assets/copy-LK56fFow.js">
     <link rel="modulepreload" crossorigin href="./assets/copy-BwrPA9zQ.js">
     <link rel="modulepreload" crossorigin href="./assets/copy-icon-OjtDb4gO.js">
-    <link rel="modulepreload" crossorigin href="./assets/RenderHTML-ChwPJgPd.js">
-    <link rel="modulepreload" crossorigin href="./assets/datasource-DjDpJnbt.js">
-    <link rel="modulepreload" crossorigin href="./assets/state-D-2KaAHK.js">
+    <link rel="modulepreload" crossorigin href="./assets/RenderHTML-BpmpkBqm.js">
+    <link rel="modulepreload" crossorigin href="./assets/datasource-B7h8qmJZ.js">
+    <link rel="modulepreload" crossorigin href="./assets/state-D2ocm4JL.js">
     <link rel="modulepreload" crossorigin href="./assets/package-Tv6ztuzw.js">
     <link rel="modulepreload" crossorigin href="./assets/sparkles-lWUAsPhp.js">
-    <link rel="modulepreload" crossorigin href="./assets/MarimoErrorOutput-B0h5OVW9.js">
+    <link rel="modulepreload" crossorigin href="./assets/MarimoErrorOutput-IoNFtcZT.js">
     <link rel="modulepreload" crossorigin href="./assets/spinner-Bhir8k53.js">
-    <link rel="modulepreload" crossorigin href="./assets/html-to-image-BWL3Ct4n.js">
-    <link rel="modulepreload" crossorigin href="./assets/focus-q38vUCl-.js">
+    <link rel="modulepreload" crossorigin href="./assets/html-to-image-BoIWRm-U.js">
+    <link rel="modulepreload" crossorigin href="./assets/focus-D3CLyF2k.js">
     <link rel="modulepreload" crossorigin href="./assets/useAsyncData-bgszE9F0.js">
     <link rel="modulepreload" crossorigin href="./assets/LazyAnyLanguageCodeMirror-BEvXb3VX.js">
     <link rel="modulepreload" crossorigin href="./assets/micromark-factory-space-BygYYKhs.js">
     <link rel="modulepreload" crossorigin href="./assets/chunk-5FQGJX7Z-D9iBG0F7.js">
-    <link rel="modulepreload" crossorigin href="./assets/markdown-renderer-CU5Lbyax.js">
+    <link rel="modulepreload" crossorigin href="./assets/markdown-renderer-BGO5zfUp.js">
     <link rel="modulepreload" crossorigin href="./assets/command-KARR7KMq.js">
     <link rel="modulepreload" crossorigin href="./assets/field-zLmMOSA4.js">
     <link rel="modulepreload" crossorigin href="./assets/popover-Bz_0Vkyf.js">
     <link rel="modulepreload" crossorigin href="./assets/errors-vr57w7Ul.js">
-    <link rel="modulepreload" crossorigin href="./assets/download-DT8gf0PL.js">
+    <link rel="modulepreload" crossorigin href="./assets/download-HxGLUdmz.js">
     <link rel="modulepreload" crossorigin href="./assets/table-BGPSHfig.js">
     <link rel="modulepreload" crossorigin href="./assets/useIframeCapabilities-CcI1zSdn.js">
     <link rel="modulepreload" crossorigin href="./assets/error-banner-LdWZDbqd.js">
@@ -196,25 +196,25 @@
     <link rel="modulepreload" crossorigin href="./assets/plus-BgB18UzY.js">
     <link rel="modulepreload" crossorigin href="./assets/trash-2-rVklqqFF.js">
     <link rel="modulepreload" crossorigin href="./assets/react-resizable-panels.browser.esm-CV8-hvjx.js">
-    <link rel="modulepreload" crossorigin href="./assets/JsonOutput-BJaeXQim.js">
+    <link rel="modulepreload" crossorigin href="./assets/JsonOutput-sim6s58u.js">
     <link rel="modulepreload" crossorigin href="./assets/chart-no-axes-column-nqk474t8.js">
     <link rel="modulepreload" crossorigin href="./assets/square-function-uY_yJr5g.js">
     <link rel="modulepreload" crossorigin href="./assets/spec-CPQR_o92.js">
     <link rel="modulepreload" crossorigin href="./assets/ellipsis-vertical-CkwWkOQL.js">
     <link rel="modulepreload" crossorigin href="./assets/refresh-cw-DHwG4Mac.js">
     <link rel="modulepreload" crossorigin href="./assets/tree-actions-BM_EJr3E.js">
-    <link rel="modulepreload" crossorigin href="./assets/components-BzBUxUz0.js">
-    <link rel="modulepreload" crossorigin href="./assets/column-preview-BPismotx.js">
+    <link rel="modulepreload" crossorigin href="./assets/components-DYnN18mE.js">
+    <link rel="modulepreload" crossorigin href="./assets/column-preview-DEY7H3Nv.js">
     <link rel="modulepreload" crossorigin href="./assets/icons-Ol38nIbL.js">
-    <link rel="modulepreload" crossorigin href="./assets/radio-group-DlVSuZ_1.js">
-    <link rel="modulepreload" crossorigin href="./assets/floating-outline-BN9sAcQ0.js">
+    <link rel="modulepreload" crossorigin href="./assets/radio-group-9x2A1Fsc.js">
+    <link rel="modulepreload" crossorigin href="./assets/floating-outline-BnioYLEY.js">
     <link rel="modulepreload" crossorigin href="./assets/objectWithoutPropertiesLoose-DfWeGRFv.js">
     <link rel="modulepreload" crossorigin href="./assets/esm-CqWdmSnV.js">
-    <link rel="modulepreload" crossorigin href="./assets/readonly-python-code-D3_kHsDx.js">
+    <link rel="modulepreload" crossorigin href="./assets/readonly-python-code-CEfd-Ppu.js">
     <link rel="modulepreload" crossorigin href="./assets/file-headphone-BrQspHac.js">
     <link rel="modulepreload" crossorigin href="./assets/file-BrdxGLRX.js">
     <link rel="modulepreload" crossorigin href="./assets/image-DQHXdEQn.js">
-    <link rel="modulepreload" crossorigin href="./assets/file-icons-BiMOJy0r.js">
+    <link rel="modulepreload" crossorigin href="./assets/file-icons-BrqycRag.js">
     <link rel="modulepreload" crossorigin href="./assets/switch-BiU_sAcn.js">
     <link rel="modulepreload" crossorigin href="./assets/events-CPoJAfgx.js">
     <link rel="modulepreload" crossorigin href="./assets/globals-7JnRMGd4.js">
@@ -223,11 +223,11 @@
     <link rel="modulepreload" crossorigin href="./assets/memoize-Tp7rARFe.js">
     <link rel="modulepreload" crossorigin href="./assets/get-C-qh_et5.js">
     <link rel="modulepreload" crossorigin href="./assets/_baseSet-CxV9N1bc.js">
-    <link rel="modulepreload" crossorigin href="./assets/state-BTTshiKq.js">
+    <link rel="modulepreload" crossorigin href="./assets/state-C6hNg_X-.js">
     <link rel="modulepreload" crossorigin href="./assets/label-xHqFtfdz.js">
-    <link rel="modulepreload" crossorigin href="./assets/textarea-DwltG8V6.js">
+    <link rel="modulepreload" crossorigin href="./assets/textarea-C3qk0qJ7.js">
     <link rel="modulepreload" crossorigin href="./assets/refresh-ccw-C-n2VFP5.js">
-    <link rel="modulepreload" crossorigin href="./assets/form-BtBTvVVd.js">
+    <link rel="modulepreload" crossorigin href="./assets/form-DdqAF_p5.js">
     <link rel="modulepreload" crossorigin href="./assets/renderShortcut-CcFk3m01.js">
     <link rel="modulepreload" crossorigin href="./assets/useBoolean-Bp18o6XG.js">
     <link rel="modulepreload" crossorigin href="./assets/useDeepCompareMemoize-zUHU--0D.js">

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@marimo-team/frontend",
-  "version": "0.23.10-dev1",
+  "version": "0.23.10-dev2",
   "main": "dist/main.js",
   "types": "dist/index.d.ts",
   "type": "module",

package/src/core/cells/__tests__/document-changes.test.ts

@@ -16,14 +16,32 @@
 import { python } from "@codemirror/lang-python";
 import { EditorState } from "@codemirror/state";
 import { EditorView } from "@codemirror/view";
-import { afterAll, beforeAll, beforeEach, describe, expect, it } from "vitest";
+import {
+  afterAll,
+  afterEach,
+  beforeAll,
+  beforeEach,
+  describe,
+  expect,
+  it,
+  vi,
+} from "vitest";
 import { cellId } from "@/__tests__/branded";
 import type { CellHandle } from "@/components/editor/notebook-cell";
 import { adaptiveLanguageConfiguration } from "@/core/codemirror/language/extension";
 import { OverridingHotkeyProvider } from "@/core/hotkeys/hotkeys";
+import { requestClientAtom } from "@/core/network/requests";
+import type { EditRequests, RunRequests } from "@/core/network/types";
+import { store } from "@/core/state/jotai";
 import { MultiColumn } from "@/utils/id-tree";
 import { exportedForTesting, type NotebookState } from "../cells";
-import { type CellAction, toDocumentChanges } from "../document-changes";
+import {
+  type CellAction,
+  coalesceChanges,
+  type DocumentChange,
+  exportedForTesting as middlewareExports,
+  toDocumentChanges,
+} from "../document-changes";
 import { CellId } from "../ids";
 
 const { initialNotebookState, reducer } = exportedForTesting;
@@ -584,3 +602,184 @@ describe("toDocumentChanges", () => {
     });
   });
 });
+
+describe("coalesceChanges", () => {
+  const X = cellId("X");
+  const Y = cellId("Y");
+  const A = cellId("A");
+  const config = { column: null, disabled: false, hide_code: false };
+
+  it("drops set-code that precedes a delete of the same cell", () => {
+    const changes: DocumentChange[] = [
+      { type: "set-code", cellId: X, code: "x = 2" },
+      { type: "delete-cell", cellId: X },
+    ];
+    expect(coalesceChanges(changes)).toEqual([
+      { type: "delete-cell", cellId: X },
+    ]);
+  });
+
+  it("keeps create+delete for a created-then-deleted cell, dropping the edit", () => {
+    const changes: DocumentChange[] = [
+      { type: "create-cell", cellId: X, code: "", name: "_", config },
+      { type: "set-code", cellId: X, code: "x = 1" },
+      { type: "delete-cell", cellId: X },
+    ];
+    expect(coalesceChanges(changes)).toEqual([
+      { type: "create-cell", cellId: X, code: "", name: "_", config },
+      { type: "delete-cell", cellId: X },
+    ]);
+  });
+
+  it("drops set-code, set-name, set-config, and move-cell for a deleted cell", () => {
+    const changes: DocumentChange[] = [
+      { type: "create-cell", cellId: X, code: "", name: "_", config },
+      { type: "set-code", cellId: X, code: "x = 1" },
+      { type: "set-name", cellId: X, name: "foo" },
+      {
+        type: "set-config",
+        cellId: X,
+        column: null,
+        disabled: true,
+        hideCode: false,
+      },
+      { type: "move-cell", cellId: X, after: A },
+      { type: "delete-cell", cellId: X },
+    ];
+    expect(coalesceChanges(changes)).toEqual([
+      { type: "create-cell", cellId: X, code: "", name: "_", config },
+      { type: "delete-cell", cellId: X },
+    ]);
+  });
+
+  it("leaves a plain delete of an unedited cell unchanged", () => {
+    const changes: DocumentChange[] = [{ type: "delete-cell", cellId: X }];
+    expect(coalesceChanges(changes)).toEqual([
+      { type: "delete-cell", cellId: X },
+    ]);
+  });
+
+  it("does not touch set-* for cells that are not deleted, preserving order", () => {
+    const changes: DocumentChange[] = [
+      { type: "set-code", cellId: A, code: "a = 1" },
+      { type: "set-code", cellId: Y, code: "y = 1" },
+      { type: "delete-cell", cellId: X },
+    ];
+    expect(coalesceChanges(changes)).toEqual([
+      { type: "set-code", cellId: A, code: "a = 1" },
+      { type: "set-code", cellId: Y, code: "y = 1" },
+      { type: "delete-cell", cellId: X },
+    ]);
+  });
+
+  it("collapses repeated set-code for a surviving cell to the last value", () => {
+    const changes: DocumentChange[] = [
+      { type: "set-code", cellId: X, code: "x = 1" },
+      { type: "set-name", cellId: X, name: "foo" },
+      { type: "set-code", cellId: X, code: "x = 2" },
+    ];
+    expect(coalesceChanges(changes)).toEqual([
+      { type: "set-name", cellId: X, name: "foo" },
+      { type: "set-code", cellId: X, code: "x = 2" },
+    ]);
+  });
+
+  it("keeps both creates so a downstream anchor stays resolvable", () => {
+    const changes: DocumentChange[] = [
+      { type: "create-cell", cellId: X, code: "", name: "_", config, after: A },
+      { type: "create-cell", cellId: Y, code: "", name: "_", config, after: X },
+      { type: "delete-cell", cellId: X },
+    ];
+    expect(coalesceChanges(changes)).toEqual([
+      { type: "create-cell", cellId: X, code: "", name: "_", config, after: A },
+      { type: "create-cell", cellId: Y, code: "", name: "_", config, after: X },
+      { type: "delete-cell", cellId: X },
+    ]);
+  });
+});
+
+/**
+ * End-to-end of the debounced flush path: dispatch through the real middleware
+ * reducer, let the debounce fire, and inspect the batch that reaches
+ * sendDocumentTransaction. Coalescing only matters once edits actually share a
+ * debounce window, which drainChanges-based tests can't observe.
+ */
+describe("flush path coalescing", () => {
+  let sent: DocumentChange[][];
+
+  beforeEach(() => {
+    vi.useFakeTimers();
+    sent = [];
+    middlewareExports.cancelPendingChanges();
+    const captureClient: Pick<
+      EditRequests & RunRequests,
+      "sendDocumentTransaction"
+    > = {
+      sendDocumentTransaction: async ({ changes }) => {
+        sent.push(changes);
+        return null;
+      },
+    };
+    store.set(
+      requestClientAtom,
+      captureClient as unknown as EditRequests & RunRequests,
+    );
+  });
+
+  afterEach(() => {
+    middlewareExports.cancelPendingChanges();
+    store.set(requestClientAtom, null);
+    vi.useRealTimers();
+  });
+
+  it("coalesces edit + delete of the same cell within one debounce window", () => {
+    setup("x = 1");
+    const [x] = state.cellIds.inOrderIds;
+    // Discard the create-cell from setup; it would flush as its own batch.
+    middlewareExports.cancelPendingChanges();
+
+    // Same window: edit the cell, then delete it, with no timer advance.
+    state = dispatch(state, {
+      type: "updateCellCode",
+      payload: { cellId: x, code: "x = 2", formattingChange: false },
+    });
+    state = dispatch(state, {
+      type: "deleteCell",
+      payload: { cellId: x },
+    });
+
+    // Debounced: nothing on the wire yet.
+    expect(sent).toEqual([]);
+
+    vi.advanceTimersByTime(400);
+
+    // One transaction, and it is just the delete — the conflicting set-code
+    // has been dropped, so the server never sees edit+delete of one cell.
+    expect(sent).toHaveLength(1);
+    expect(sent[0]).toEqual([{ type: "delete-cell", cellId: x }]);
+  });
+
+  it("sends edit and delete as separate clean transactions across windows", () => {
+    setup("x = 1");
+    const [x] = state.cellIds.inOrderIds;
+    middlewareExports.cancelPendingChanges();
+
+    state = dispatch(state, {
+      type: "updateCellCode",
+      payload: { cellId: x, code: "x = 2", formattingChange: false },
+    });
+    vi.advanceTimersByTime(400);
+
+    state = dispatch(state, {
+      type: "deleteCell",
+      payload: { cellId: x },
+    });
+    vi.advanceTimersByTime(400);
+
+    // Two separate, individually-valid transactions: neither conflicts, which
+    // is why the bug only ever surfaced when both landed in the same window.
+    expect(sent).toHaveLength(2);
+    expect(sent[0]).toEqual([{ type: "set-code", cellId: x, code: "x = 2" }]);
+    expect(sent[1]).toEqual([{ type: "delete-cell", cellId: x }]);
+  });
+});

package/src/core/cells/document-changes.ts

@@ -568,6 +568,64 @@ export function fromDocumentChanges(
   return actions;
 }
 
+// ---------------------------------------------------------------------------
+// Coalescing: reduce a buffered change sequence to its net effect
+// ---------------------------------------------------------------------------
+
+const COLLAPSIBLE_TYPES = new Set(["set-code", "set-name", "set-config"]);
+const DROPPABLE_ON_DELETE = new Set([
+  "set-code",
+  "set-name",
+  "set-config",
+  "move-cell",
+]);
+
+/**
+ * Reduce a buffered sequence of changes to an equivalent batch that reflects
+ * net effect rather than edit history. The server applies a transaction
+ * atomically and rejects internally contradictory batches (e.g. updating a
+ * cell that is also deleted in the same transaction), so a debounced sequence
+ * of edits must be reconciled before it is sent.
+ *
+ * Two reductions, both order-preserving:
+ * - For any cell deleted in the batch, drop its property/move changes. The
+ *   `create-cell` and `delete-cell` are kept so anchors referencing the cell
+ *   stay resolvable on the server; create+delete applies to a net no-op.
+ * - Collapse repeated `set-code`/`set-name`/`set-config` for a surviving cell
+ *   to the last occurrence.
+ */
+export function coalesceChanges(changes: DocumentChange[]): DocumentChange[] {
+  const deletedIds = new Set<CellId>();
+  for (const change of changes) {
+    if (change.type === "delete-cell") {
+      deletedIds.add(change.cellId);
+    }
+  }
+
+  const withoutEditsToDeletedCells = changes.filter(
+    (change) =>
+      !(
+        DROPPABLE_ON_DELETE.has(change.type) &&
+        "cellId" in change &&
+        deletedIds.has(change.cellId)
+      ),
+  );
+
+  const lastIndexByKey = new Map<string, number>();
+  withoutEditsToDeletedCells.forEach((change, index) => {
+    if (COLLAPSIBLE_TYPES.has(change.type) && "cellId" in change) {
+      lastIndexByKey.set(`${change.type}:${change.cellId}`, index);
+    }
+  });
+
+  return withoutEditsToDeletedCells.filter((change, index) => {
+    if (COLLAPSIBLE_TYPES.has(change.type) && "cellId" in change) {
+      return lastIndexByKey.get(`${change.type}:${change.cellId}`) === index;
+    }
+    return true;
+  });
+}
+
 // ---------------------------------------------------------------------------
 // Middleware: debounced change dispatch to the server
 // ---------------------------------------------------------------------------
@@ -575,11 +633,11 @@ export function fromDocumentChanges(
 let pendingChanges: DocumentChange[] = [];
 
 const flushChanges = debounce(() => {
-  if (pendingChanges.length === 0) {
+  const changes = coalesceChanges(pendingChanges);
+  pendingChanges = [];
+  if (changes.length === 0) {
     return;
   }
-  const changes = pendingChanges;
-  pendingChanges = [];
   void getRequestClient().sendDocumentTransaction({ changes });
 }, 400);