@marimo-team/islands 0.25.3-dev2 → 0.25.3-dev200

package/src/plugins/impl/__tests__/SliderPlugin.test.tsx

@@ -212,6 +212,28 @@ describe("SliderPlugin", () => {
     expect(setValue).toHaveBeenCalledWith(9);
   });
 
+  it("preserves an uncommitted drag until the controlled value changes", () => {
+    const plugin = new SliderPlugin();
+    const setValue = vi.fn();
+    const props = createProps({
+      debounce: true,
+      includeInput: false,
+      setValue,
+    });
+    const { getByRole, rerender } = render(plugin.render(props));
+
+    fireEvent.click(getByRole("button", { name: "Slider change" }));
+    rerender(
+      plugin.render({ ...props, data: { ...props.data, label: "Updated" } }),
+    );
+    fireEvent.click(getByRole("button", { name: "Slider commit" }));
+    expect(setValue).toHaveBeenLastCalledWith(6);
+
+    rerender(plugin.render({ ...props, value: 2 }));
+    fireEvent.click(getByRole("button", { name: "Slider commit" }));
+    expect(setValue).toHaveBeenLastCalledWith(2);
+  });
+
   describe("editable input with steps (regression for #9850)", () => {
     it("displays the actual step value, not the index", () => {
       const plugin = new SliderPlugin();
@@ -381,9 +403,8 @@ describe("SliderPlugin", () => {
         vi.advanceTimersByTime(0);
       });
 
-      // Shrink `steps` so the held index (4) is now out of range. The index
-      // syncs in an effect after this render, so the render must not throw on
-      // the stale, out-of-range index.
+      // Shrink `steps` so the held index (4) is now out of range. Updating
+      // the controlled index must render the new valid step without throwing.
       const shrunkProps = createStepsProps({
         steps: [10, 20],
         valueIndex: 1,

package/src/plugins/impl/anywidget/__tests__/registry.test.ts

@@ -8,6 +8,8 @@ import {
   type MockInstance,
   vi,
 } from "vitest";
+import { Deferred } from "@/utils/Deferred";
+import { Logger } from "@/utils/Logger";
 import { getMarimoInternal, Model } from "../model";
 import { handleWidgetMessage, WidgetRegistry } from "../registry";
 import type { EsmSpec, ModelState, WidgetModelId } from "../types";
@@ -155,6 +157,155 @@ describe("WidgetRegistry models", () => {
     );
   });
 
+  describe("outgoing messages", () => {
+    async function openModel(id = testId) {
+      await handleWidgetMessage(registry, {
+        model_id: id,
+        message: {
+          method: "open",
+          state: {},
+          buffer_paths: [],
+          buffers: [],
+        },
+      });
+      return registry.getModel(id);
+    }
+
+    afterEach(() => {
+      mockSendModelValue.mockReset().mockResolvedValue(null);
+      vi.restoreAllMocks();
+    });
+
+    it("waits for each acknowledgement before sending the next update", async () => {
+      const model = await openModel();
+      const responses = [new Deferred<null>(), new Deferred<null>()];
+      for (const response of responses) {
+        mockSendModelValue.mockReturnValueOnce(response.promise);
+      }
+      const states = [
+        { card: "A", seq: 5 },
+        { card: "", seq: 6 },
+        { card: "B", seq: 7 },
+      ];
+      for (const state of states) {
+        model.set("selection", state);
+        model.save_changes();
+      }
+
+      await vi.waitFor(() =>
+        expect(mockSendModelValue).toHaveBeenCalledTimes(1),
+      );
+      for (const [index, response] of responses.entries()) {
+        response.resolve(null);
+        await vi.waitFor(() =>
+          expect(mockSendModelValue).toHaveBeenCalledTimes(index + 2),
+        );
+      }
+      expect(mockSendModelValue.mock.calls).toEqual(
+        states.map((selection) => [
+          {
+            modelId: testId,
+            message: {
+              method: "update",
+              state: { selection },
+              bufferPaths: [],
+            },
+            buffers: [],
+          },
+        ]),
+      );
+    });
+
+    it("orders custom messages with updates and waits before calling callbacks", async () => {
+      const model = await openModel();
+      const response = new Deferred<null>();
+      mockSendModelValue.mockReturnValueOnce(response.promise);
+      const callback = vi.fn();
+      const sent = model.send({ action: "first" }, callback);
+      model.set("count", 1);
+      model.save_changes();
+      const last = model.send({ action: "last" });
+
+      await vi.waitFor(() =>
+        expect(mockSendModelValue).toHaveBeenCalledTimes(1),
+      );
+      expect(callback).not.toHaveBeenCalled();
+      response.resolve(null);
+      await Promise.all([sent, last]);
+      expect(callback).toHaveBeenCalledExactlyOnceWith();
+      expect(
+        mockSendModelValue.mock.calls.map(([request]) => request.message),
+      ).toEqual([
+        { method: "custom", content: { action: "first" } },
+        { method: "update", state: { count: 1 }, bufferPaths: [] },
+        { method: "custom", content: { action: "last" } },
+      ]);
+    });
+
+    it("continues sending after a failed update", async () => {
+      const model = await openModel();
+      const response = new Deferred<null>();
+      mockSendModelValue.mockReturnValueOnce(response.promise);
+      const logError = vi
+        .spyOn(Logger, "error")
+        .mockImplementation(() => undefined);
+      model.set("count", 1);
+      model.save_changes();
+      model.set("count", 2);
+      model.save_changes();
+      const last = model.send({ action: "done" });
+
+      await vi.waitFor(() =>
+        expect(mockSendModelValue).toHaveBeenCalledTimes(1),
+      );
+      const error = new Error("Network failure");
+      response.reject(error);
+      await last;
+      expect(mockSendModelValue).toHaveBeenCalledTimes(3);
+      expect(logError).toHaveBeenCalledWith(
+        "[anywidget] Failed to save model changes",
+        error,
+      );
+    });
+
+    it("allows different models to send independently", async () => {
+      const first = await openModel();
+      const secondId = asModelId("second-model");
+      const second = await openModel(secondId);
+      const response = new Deferred<null>();
+      mockSendModelValue.mockReturnValueOnce(response.promise);
+
+      const firstSend = first.send({ value: 1 });
+      await second.send({ value: 2 });
+      expect(
+        mockSendModelValue.mock.calls.map(([request]) => request.modelId),
+      ).toEqual([testId, secondId]);
+      response.resolve(null);
+      await firstSend;
+    });
+
+    it("drops queued messages when the model closes", async () => {
+      const model = await openModel();
+      const response = new Deferred<null>();
+      mockSendModelValue.mockReturnValueOnce(response.promise);
+      const first = model.send({ value: 1 });
+      model.set("count", 2);
+      model.save_changes();
+      const last = model.send({ value: 3 });
+
+      await vi.waitFor(() =>
+        expect(mockSendModelValue).toHaveBeenCalledTimes(1),
+      );
+      await handleWidgetMessage(registry, {
+        model_id: testId,
+        message: { method: "close" },
+      });
+      response.resolve(null);
+      await Promise.all([first, last]);
+      expect(mockSendModelValue).toHaveBeenCalledTimes(1);
+    });
+  });
+
   describe("static mode", () => {
     beforeEach(() => {
       mockIsStatic.mockReturnValue(true);
@@ -238,6 +389,7 @@ describe("WidgetRegistry.getWidget", () => {
       jsUrl: SPEC.url,
       jsHash: SPEC.hash,
       kernelAuthored: true,
+      lifetime: expect.any(AbortSignal),
     });
     expect(widgetDef.initialize).toHaveBeenCalledTimes(1);
     expect(widget.exports).toBe(exports);
@@ -263,6 +415,7 @@ describe("WidgetRegistry.getWidget", () => {
       jsUrl: SPEC.url,
       jsHash: SPEC.hash,
       kernelAuthored: true,
+      lifetime: expect.any(AbortSignal),
     });
   });
 

package/src/plugins/impl/anywidget/__tests__/widget-binding.test.ts

@@ -7,9 +7,12 @@ import { userConfigAtom } from "@/core/config/config";
 import { parseUserConfig } from "@/core/config/config-schema";
 import { initialModeAtom } from "@/core/mode";
 import { store } from "@/core/state/jotai";
+import type { DataURLString } from "@/utils/json/base64";
 import { Model } from "../model";
 import type { Host } from "../host";
-import type { ModelState } from "../types";
+import type { ModelState, WidgetModelId } from "../types";
+import { WidgetRuntime } from "../runtime";
+import { Deferred } from "@/utils/Deferred";
 import { visibleForTesting } from "../widget-binding";
 
 const { WidgetDefRegistry, WidgetBinding } = visibleForTesting;
@@ -30,13 +33,14 @@ const createTestHost = (): Host => ({
 function createBinding<T extends ModelState>(
   widgetDef: AnyWidget<T>,
   model: Model<T>,
-  options: { controller?: AbortController } = {},
+  options: { controller?: AbortController; onDestroy?: () => void } = {},
 ) {
   return WidgetBinding.create({
     widgetDef,
     model,
     createHost: createTestHost,
     controller: options.controller,
+    onDestroy: options.onDestroy,
   });
 }
 
@@ -123,6 +127,25 @@ describe("WidgetDefRegistry", () => {
     promise2.catch(() => undefined);
   });
 
+  it("does not evict a replacement when an invalidated import fails", async () => {
+    const oldImport = getModule(
+      registry,
+      "http://localhost/old.js",
+      "replaced",
+    );
+    registry.invalidate("replaced");
+    const newImport = registry.getModule({
+      jsUrl: "data:text/javascript,export default {}",
+      jsHash: "replaced",
+      kernelAuthored: true,
+    });
+    await expect(oldImport).rejects.toThrow(/untrusted/i);
+    await newImport;
+    expect(getModule(registry, "http://localhost/new.js", "replaced")).toBe(
+      newImport,
+    );
+  });
+
   describe("URL validation", () => {
     it.each([
       // Attack vector: raw <marimo-anywidget data-js-url=...> in markdown
@@ -148,9 +171,225 @@ describe("WidgetDefRegistry", () => {
       ).rejects.not.toThrow(/untrusted/i);
     });
   });
+
+  describe("static module URLs", () => {
+    afterEach(() => {
+      delete window.__MARIMO_STATIC__;
+      vi.restoreAllMocks();
+    });
+
+    it("releases the generated URL when a static module fails to import", async () => {
+      window.__MARIMO_STATIC__ = {
+        files: {
+          "/@file/widget.js":
+            "data:text/javascript;base64,ZXhwb3J0IHt9" as DataURLString,
+        },
+      };
+      const create = vi
+        .spyOn(URL, "createObjectURL")
+        .mockReturnValue("blob:widget-module");
+      const revoke = vi
+        .spyOn(URL, "revokeObjectURL")
+        .mockImplementation(() => undefined);
+
+      await expect(
+        getModule(registry, "./@file/widget.js", "static-module"),
+      ).rejects.toThrow(/blob:/);
+
+      expect(create).toHaveBeenCalledOnce();
+      expect(revoke).toHaveBeenCalledExactlyOnceWith("blob:widget-module");
+    });
+
+    it("does not revoke active modules when their cache entry is invalidated", async () => {
+      window.__MARIMO_STATIC__ = {
+        files: {
+          "/@file/widget.js":
+            "data:text/javascript;base64,ZXhwb3J0IHt9" as DataURLString,
+        },
+      };
+      const oldUrl = "data:text/javascript,export const version = 1";
+      const newUrl = "data:text/javascript,export const version = 2";
+      vi.spyOn(URL, "createObjectURL")
+        .mockReturnValueOnce(oldUrl)
+        .mockReturnValueOnce(newUrl);
+      const revoke = vi
+        .spyOn(URL, "revokeObjectURL")
+        .mockImplementation(() => undefined);
+      const oldLifetime = new AbortController();
+      const newLifetime = new AbortController();
+      const options = { jsUrl: "./@file/widget.js", jsHash: "invalidated" };
+      const oldImport = registry.getModule({
+        ...options,
+        lifetime: oldLifetime.signal,
+      });
+      registry.invalidate(options.jsHash);
+      const newImport = registry.getModule({
+        ...options,
+        lifetime: newLifetime.signal,
+      });
+      await Promise.all([oldImport, newImport]);
+      expect(revoke).not.toHaveBeenCalled();
+      oldLifetime.abort();
+      await vi.waitFor(() =>
+        expect(revoke).toHaveBeenCalledExactlyOnceWith(oldUrl),
+      );
+      const siblingLifetime = new AbortController();
+      expect(
+        registry.getModule({ ...options, lifetime: siblingLifetime.signal }),
+      ).toBe(newImport);
+      newLifetime.abort();
+      siblingLifetime.abort();
+      await vi.waitFor(() => expect(revoke).toHaveBeenLastCalledWith(newUrl));
+    });
+
+    it("waits for a canceled import to settle before revoking its URL", async () => {
+      window.__MARIMO_STATIC__ = {
+        files: {
+          "/@file/widget.js":
+            "data:text/javascript;base64,ZXhwb3J0IHt9" as DataURLString,
+        },
+      };
+      const moduleUrl = "data:text/javascript,export const pending = true";
+      vi.spyOn(URL, "createObjectURL").mockReturnValue(moduleUrl);
+      const revoke = vi
+        .spyOn(URL, "revokeObjectURL")
+        .mockImplementation(() => undefined);
+      const lifetime = new AbortController();
+      const pending = registry.getModule({
+        jsUrl: "./@file/widget.js",
+        jsHash: "pending",
+        lifetime: lifetime.signal,
+      });
+      lifetime.abort();
+      expect(revoke).not.toHaveBeenCalled();
+      await pending;
+      expect(revoke).toHaveBeenCalledExactlyOnceWith(moduleUrl);
+    });
+
+    it("does not revoke an unchanged URL for a missing static file", async () => {
+      window.__MARIMO_STATIC__ = { files: {} };
+      const revoke = vi
+        .spyOn(URL, "revokeObjectURL")
+        .mockImplementation(() => undefined);
+
+      await expect(
+        getModule(registry, "./@file/missing.js", "missing-module"),
+      ).rejects.toThrow(/http:/);
+
+      expect(revoke).not.toHaveBeenCalled();
+    });
+
+    it("keeps a shared module URL until the last widget generation is destroyed", async () => {
+      window.__MARIMO_STATIC__ = {
+        files: {
+          "/@file/widget.js":
+            "data:text/javascript;base64,ZXhwb3J0IHt9" as DataURLString,
+        },
+      };
+      // Node cannot import blob URLs; a data URL exercises successful loading.
+      const moduleUrl = `data:text/javascript,${encodeURIComponent(
+        "export default { initialize: () => ({ moduleUrl: import.meta.url }) }",
+      )}`;
+      vi.spyOn(URL, "createObjectURL").mockReturnValue(moduleUrl);
+      const revoke = vi
+        .spyOn(URL, "revokeObjectURL")
+        .mockImplementation(() => undefined);
+
+      const createRuntime = (id: string) => {
+        const runtime = new WidgetRuntime(id as WidgetModelId, {
+          timeout: 50,
+          isEditMode: () => true,
+          createHost: createTestHost,
+          onModelTimeout: vi.fn(),
+        });
+        runtime.setModel(new Model({}, createMockComm()));
+        runtime.setSpec({ url: "./@file/widget.js", hash: "static-success" });
+        return runtime;
+      };
+      const first = createRuntime("first");
+      const second = createRuntime("second");
+      const widgets = await Promise.all([
+        first.getWidget(),
+        second.getWidget(),
+      ]);
+      expect(widgets.map((widget) => widget.exports)).toEqual([
+        { moduleUrl },
+        { moduleUrl },
+      ]);
+      expect(URL.createObjectURL).toHaveBeenCalledOnce();
+      expect(revoke).not.toHaveBeenCalled();
+
+      first.dispose();
+      await new Promise((resolve) => setTimeout(resolve, 0));
+      expect(revoke).not.toHaveBeenCalled();
+
+      second.dispose();
+      await vi.waitFor(() => {
+        expect(revoke).toHaveBeenCalledExactlyOnceWith(moduleUrl);
+      });
+
+      // A later generation reuses the evaluated module rather than
+      // re-running its top-level side effects, and does not revoke again.
+      const third = createRuntime("third");
+      const widget = await third.getWidget();
+      expect(widget.exports).toEqual({ moduleUrl });
+      expect(URL.createObjectURL).toHaveBeenCalledOnce();
+      third.dispose();
+      await new Promise((resolve) => setTimeout(resolve, 0));
+      expect(revoke).toHaveBeenCalledOnce();
+    });
+  });
 });
 
 describe("WidgetBinding", () => {
+  it("releases module resources after asynchronous generation cleanup", async () => {
+    const cleanup = new Deferred<void>();
+    const onDestroy = vi.fn();
+    const binding = await createBinding(
+      { initialize: () => () => cleanup.promise },
+      new Model({}, createMockComm()),
+      { onDestroy },
+    );
+    const destroying = binding.destroy();
+    expect(onDestroy).not.toHaveBeenCalled();
+    cleanup.resolve();
+    await destroying;
+    await binding.destroy();
+    expect(onDestroy).toHaveBeenCalledOnce();
+  });
+
+  it("retains module resources until canceled initialization and late cleanup settle", async () => {
+    const initialize = new Deferred<() => Promise<void>>();
+    const cleanup = new Deferred<void>();
+    const controller = new AbortController();
+    const onDestroy = vi.fn();
+    const pending = createBinding(
+      { initialize: () => initialize.promise },
+      new Model({}, createMockComm()),
+      { controller, onDestroy },
+    );
+    controller.abort();
+    await expect(pending).rejects.toThrow(/binding destroyed/);
+    expect(onDestroy).not.toHaveBeenCalled();
+    initialize.resolve(() => cleanup.promise);
+    await Promise.resolve();
+    expect(onDestroy).not.toHaveBeenCalled();
+    cleanup.resolve();
+    await vi.waitFor(() => expect(onDestroy).toHaveBeenCalledOnce());
+  });
+
+  it("releases module resources when initialization fails", async () => {
+    const onDestroy = vi.fn();
+    await expect(
+      createBinding(
+        { initialize: () => Promise.reject(new Error("initialize failed")) },
+        new Model({}, createMockComm()),
+        { onDestroy },
+      ),
+    ).rejects.toThrow("initialize failed");
+    await vi.waitFor(() => expect(onDestroy).toHaveBeenCalledOnce());
+  });
+
   it("should run initialize exactly once and expose exports", async () => {
     const model = new Model<ModelState>({ count: 0 }, createMockComm());
     const exports = { setValue: vi.fn() };

package/src/plugins/impl/anywidget/model.ts

@@ -157,7 +157,9 @@ export class Model<T extends ModelState> implements AnyModel<T> {
 
     // Clear the dirty fields to avoid sending again.
     this.#dirtyFields.clear();
-    this.#comm.sendUpdate(partialData);
+    this.#comm.sendUpdate(partialData).catch((error) => {
+      Logger.error("[anywidget] Failed to save model changes", error);
+    });
   }
 
   /**

package/src/plugins/impl/anywidget/registry.ts

@@ -1,6 +1,7 @@
 /* Copyright 2026 Marimo. All rights reserved. */
 import type { NotificationMessageData } from "@/core/kernel/messages";
 import { getRequestClient } from "@/core/network/requests";
+import type { ModelRequest } from "@/core/network/types";
 import { isStaticNotebook } from "@/core/static/static-state";
 import { assertNever } from "@/utils/assertNever";
 import {
@@ -10,6 +11,7 @@ import {
 } from "@/utils/json/base64";
 import { Logger } from "@/utils/Logger";
 import { repl } from "@/utils/repl";
+import { Semaphore } from "@/utils/semaphore";
 import { viewStateAtom } from "@/core/mode";
 import { store } from "@/core/state/jotai";
 import { createHost, type WidgetResolver } from "./host";
@@ -191,6 +193,20 @@ export async function handleWidgetMessage(
       }
 
       registry.createModel(modelId, (signal) => {
+        // Wait for the server to acknowledge queueing each message before
+        // sending the next one, preserving order within this model.
+        const sends = new Semaphore(1);
+        const sendMessage = (request: ModelRequest): Promise<void> =>
+          sends.run(async () => {
+            if (signal.aborted) {
+              Logger.debug(
+                `[Model] ${request.message.method} suppressed for model=${modelId} (signal aborted)`,
+              );
+              return;
+            }
+            await getRequestClient().sendModelValue(request);
+          });
+
         // In static exports there is no kernel, so comm calls are no-ops.
         const comm: MarimoComm<ModelState> = isStaticNotebook()
           ? {
@@ -199,28 +215,16 @@ export async function handleWidgetMessage(
             }
           : {
               async sendUpdate(changeData) {
-                if (signal.aborted) {
-                  Logger.debug(
-                    `[Model] sendUpdate suppressed for model=${modelId} (signal aborted)`,
-                  );
-                  return;
-                }
                 const { state, buffers, bufferPaths } =
                   serializeBuffersToBase64(changeData);
-                await getRequestClient().sendModelValue({
+                await sendMessage({
                   modelId,
                   message: { method: "update", state, bufferPaths },
                   buffers,
                 });
               },
               async sendCustomMessage(content, buffers) {
-                if (signal.aborted) {
-                  Logger.debug(
-                    `[Model] sendCustomMessage suppressed for model=${modelId} (signal aborted)`,
-                  );
-                  return;
-                }
-                await getRequestClient().sendModelValue({
+                await sendMessage({
                   modelId,
                   message: { method: "custom", content },
                   buffers: buffers.map(dataViewToBase64),

package/src/plugins/impl/anywidget/runtime.ts

@@ -206,21 +206,33 @@ export class WidgetRuntime {
     controller: AbortController;
   }): Promise<WidgetBinding<ModelState>> {
     const { spec, model, controller } = options;
-    const mod = await WIDGET_DEF_REGISTRY.getModule({
-      jsUrl: spec.url,
-      jsHash: spec.hash,
-      kernelAuthored: true,
-    });
-    const widget = resolveAnyWidget(mod, spec.url);
-    if (!widget) {
-      WIDGET_DEF_REGISTRY.invalidate(spec.hash);
-      throw getInvalidAnyWidgetModuleError(mod, spec.url);
+    const moduleLifetime = new AbortController();
+    let widget: NonNullable<ReturnType<typeof resolveAnyWidget>>;
+    try {
+      const mod = await WIDGET_DEF_REGISTRY.getModule({
+        jsUrl: spec.url,
+        jsHash: spec.hash,
+        kernelAuthored: true,
+        lifetime: moduleLifetime.signal,
+      });
+      const resolved = resolveAnyWidget(mod, spec.url);
+      if (!resolved) {
+        WIDGET_DEF_REGISTRY.invalidate(spec.hash);
+        throw getInvalidAnyWidgetModuleError(mod, spec.url);
+      }
+      widget = resolved;
+    } catch (error) {
+      moduleLifetime.abort();
+      throw error;
     }
+    // From here WidgetBinding owns release, including late cleanup when the
+    // generation is destroyed during initialize.
     return WidgetBinding.create({
       widgetDef: widget,
       model,
       createHost: this.#createHost,
       controller,
+      onDestroy: () => moduleLifetime.abort(),
     });
   }