@marimo-team/frontend 0.25.2-dev99 → 0.25.3-dev10

package/src/__tests__/mount.test.ts

@@ -8,8 +8,8 @@ import { connectionAtom } from "@/core/network/connection";
 import { store } from "@/core/state/jotai";
 import { isStaticNotebook } from "@/core/static/static-state";
 import { ConnectionState } from "@/core/websocket/types";
-import { pairPreviewAtom } from "@/core/config/pair";
-import { PAIR_PREVIEW } from "./fixtures/pair-preview";
+import { pairConfigAtom } from "@/core/config/pair";
+import { PAIR_CONFIG } from "./fixtures/pair-config";
 import { mount, visibleForTesting } from "../mount";
 
 // Mock React DOM
@@ -84,20 +84,20 @@ describe("mount", () => {
       mockElement,
     );
 
-  it("hydrates the server's Pair preview configuration", () => {
-    const error = mountRead({ pairPreview: PAIR_PREVIEW });
+  it("hydrates the server's Pair configuration", () => {
+    const error = mountRead({ pairConfig: PAIR_CONFIG });
 
     expect(error).toBeUndefined();
-    expect(store.get(pairPreviewAtom)).toEqual(PAIR_PREVIEW);
+    expect(store.get(pairConfigAtom)).toEqual(PAIR_CONFIG);
   });
 
-  it("uses legacy Pair behavior when the host omits preview configuration", () => {
-    store.set(pairPreviewAtom, PAIR_PREVIEW);
+  it("clears Pair configuration when the server omits it", () => {
+    store.set(pairConfigAtom, PAIR_CONFIG);
 
     const error = mountRead();
 
     expect(error).toBeUndefined();
-    expect(store.get(pairPreviewAtom)).toBeUndefined();
+    expect(store.get(pairConfigAtom)).toBeUndefined();
   });
 
   describe("connection state initialization", () => {

package/src/components/data-table/__tests__/column_formatting.test.ts

@@ -50,6 +50,36 @@ describe("applyFormat", () => {
         }),
       ).toBe("10/1/23, 12:00:00 PM UTC");
     });
+
+    it("should treat naive datetime strings as UTC", () => {
+      const naive = "2023-10-01 23:30:00";
+      expect(
+        applyFormat(naive, { locale, format: "Date", dataType: "datetime" }),
+      ).toBe("10/1/23");
+      expect(
+        applyFormat(naive, {
+          locale,
+          format: "Datetime",
+          dataType: "datetime",
+        }),
+      ).toBe("10/1/23, 11:30:00 PM UTC");
+      expect(
+        applyFormat(naive, { locale, format: "Time", dataType: "datetime" }),
+      ).toBe("11:30:00 PM UTC");
+      expect(
+        applyFormat("2023-10-01T23:30:00.250", {
+          locale,
+          format: "Time",
+          dataType: "datetime",
+        }),
+      ).toBe("11:30:00 PM UTC");
+    });
+
+    it("should keep the calendar date for date-only strings", () => {
+      expect(
+        applyFormat("2023-10-01", { locale, format: "Date", dataType: "date" }),
+      ).toBe("10/1/23");
+    });
   });
 
   describe("number formatting", () => {

package/src/components/data-table/__tests__/columns.test.tsx

@@ -1268,6 +1268,76 @@ describe("renderCellValue with datetime values", () => {
       }).not.toThrow();
     });
   });
+
+  it("should render the column format for datetime strings", () => {
+    const mockColumn = {
+      ...createMockColumn(),
+      getColumnFormatting: () => "Date",
+      applyColumnFormatting: () => "FORMATTED",
+    } as unknown as Column<unknown>;
+
+    const selectCell = vi.fn();
+    const result = renderCellValue({
+      column: mockColumn,
+      renderValue: () => "2024-06-14 12:34:20",
+      getValue: () => "2024-06-14 12:34:20",
+      selectCell,
+      cellStyles: "cell-styles",
+    });
+    const { container } = render(
+      <I18nProvider locale="en-US">
+        <TooltipProvider>{result}</TooltipProvider>
+      </I18nProvider>,
+    );
+    expect(container.textContent).toContain("FORMATTED");
+    expect(container.textContent).not.toContain("2024-06-14 12:34:20");
+
+    const wrapper = container.querySelector(".cell-styles");
+    expect(wrapper).not.toBeNull();
+    wrapper?.dispatchEvent(new MouseEvent("click", { bubbles: true }));
+    expect(selectCell).toHaveBeenCalledTimes(1);
+  });
+
+  it("should render the column format for Date instances", () => {
+    const mockColumn = {
+      ...createMockColumn(),
+      getColumnFormatting: () => "Date",
+      applyColumnFormatting: () => "FORMATTED",
+    } as unknown as Column<unknown>;
+    const value = new Date("2024-06-14T12:34:20Z");
+
+    const result = renderCellValue({
+      column: mockColumn,
+      renderValue: () => value,
+      getValue: () => value,
+      selectCell: undefined,
+      cellStyles: "",
+    });
+    const { container } = render(
+      <I18nProvider locale="en-US">
+        <TooltipProvider>{result}</TooltipProvider>
+      </I18nProvider>,
+    );
+    expect(container.textContent).toContain("FORMATTED");
+  });
+
+  it("should keep the raw string when no column format is set", () => {
+    const mockColumn = createMockColumn();
+
+    const result = renderCellValue({
+      column: mockColumn,
+      renderValue: () => "2024-06-14",
+      getValue: () => "2024-06-14",
+      selectCell: undefined,
+      cellStyles: "",
+    });
+    const { container } = render(
+      <I18nProvider locale="en-US">
+        <TooltipProvider>{result}</TooltipProvider>
+      </I18nProvider>,
+    );
+    expect(container.textContent).toContain("2024-06-14");
+  });
 });
 
 test("column_widths sets fixed size and meta.width", () => {

package/src/components/data-table/__tests__/context-menu.test.ts

@@ -0,0 +1,176 @@
+/* Copyright 2026 Marimo. All rights reserved. */
+
+import { afterAll, beforeAll, describe, expect, it } from "vitest";
+import { buildCellFilter } from "../context-menu";
+
+describe("buildCellFilter", () => {
+  // Use a non-UTC, non-DST-ambiguous offset so date-only parsing bugs
+  // (UTC vs. local midnight) can't hide behind a host machine that
+  // happens to run in UTC.
+  let originalTimezone: string | undefined;
+  beforeAll(() => {
+    originalTimezone = process.env.TZ;
+    process.env.TZ = "America/New_York";
+  });
+  afterAll(() => {
+    process.env.TZ = originalTimezone;
+  });
+
+  it("builds an equality filter for a normal date value", () => {
+    const filter = buildCellFilter({
+      type: "date",
+      value: "2024-01-15",
+      comparison: "eq",
+      dataType: "date",
+      dtype: "date",
+    });
+    expect(filter).toEqual({
+      type: "date",
+      operator: "==",
+      // Must be local midnight, not `new Date("2024-01-15")` (UTC
+      // midnight), or the filter shifts by a day in UTC- timezones.
+      value: new Date(2024, 0, 15),
+    });
+  });
+
+  it("returns undefined for an empty-string date value in a non-temporal-looking context", () => {
+    const filter = buildCellFilter({
+      type: "date",
+      value: "",
+      comparison: "eq",
+      dataType: "date",
+      dtype: "date",
+    });
+    expect(filter).toBeUndefined();
+  });
+
+  it("returns undefined for an unparsable date value instead of an Invalid Date filter", () => {
+    const filter = buildCellFilter({
+      type: "date",
+      value: "not-a-date",
+      comparison: "eq",
+      dataType: "date",
+      dtype: "date",
+    });
+    expect(filter).toBeUndefined();
+  });
+
+  it("builds an equality filter for a normal datetime value", () => {
+    const filter = buildCellFilter({
+      type: "datetime",
+      value: "2024-01-15 08:30:00",
+      comparison: "eq",
+      dataType: "datetime",
+      dtype: "datetime64[ns]",
+    });
+    expect(filter).toEqual({
+      type: "datetime",
+      operator: "==",
+      value: new Date(2024, 0, 15, 8, 30, 0),
+    });
+  });
+
+  it("returns undefined for an unparsable datetime value", () => {
+    const filter = buildCellFilter({
+      type: "datetime",
+      value: "not-a-datetime",
+      comparison: "eq",
+      dataType: "datetime",
+      dtype: "datetime64[ns]",
+    });
+    expect(filter).toBeUndefined();
+  });
+
+  it("builds an equality filter for a normal time value", () => {
+    const filter = buildCellFilter({
+      type: "time",
+      value: "08:30:00",
+      comparison: "eq",
+      dataType: "time",
+    });
+    expect(filter).toEqual({
+      type: "time",
+      operator: "==",
+      value: new Date(1970, 0, 1, 8, 30, 0),
+    });
+  });
+
+  it("returns undefined instead of an unparsable time value", () => {
+    const filter = buildCellFilter({
+      type: "time",
+      value: "25:00:00",
+      comparison: "eq",
+      dataType: "time",
+    });
+    expect(filter).toBeUndefined();
+  });
+
+  it("maps a NaT date value to is_null instead of an invalid Date filter", () => {
+    const filter = buildCellFilter({
+      type: "date",
+      value: "NaT",
+      comparison: "eq",
+      dataType: "date",
+      dtype: "date",
+    });
+    expect(filter).toEqual({ type: "date", operator: "is_null" });
+  });
+
+  it("maps a NaT datetime value to is_not_null for the neq comparison", () => {
+    const filter = buildCellFilter({
+      type: "datetime",
+      value: "NaT",
+      comparison: "neq",
+      dataType: "datetime",
+      dtype: "datetime64[ns]",
+    });
+    expect(filter).toEqual({ type: "datetime", operator: "is_not_null" });
+  });
+
+  it("does not treat the string 'NaT' in a non-temporal column as a sentinel", () => {
+    const filter = buildCellFilter({
+      type: "text",
+      value: "NaT",
+      comparison: "eq",
+      dataType: "string",
+    });
+    expect(filter).toEqual({ type: "text", operator: "equals", text: "NaT" });
+  });
+
+  it("maps an actual null value to is_null", () => {
+    const filter = buildCellFilter({
+      type: "number",
+      value: null,
+      comparison: "eq",
+      dataType: "number",
+    });
+    expect(filter).toEqual({ type: "number", operator: "is_null" });
+  });
+
+  it("builds a literal (always-false) equality filter for a NaN number value", () => {
+    // NaN is a real float value, not a missing-value marker like null/NaT,
+    // and the backend's is_null() (narwhals/polars semantics) doesn't match
+    // it, so it falls through to a normal (if unsatisfiable) == filter.
+    const filter = buildCellFilter({
+      type: "number",
+      value: Number.NaN,
+      comparison: "eq",
+      dataType: "number",
+    });
+    expect(filter).toEqual({
+      type: "number",
+      operator: "==",
+      value: Number.NaN,
+    });
+  });
+
+  it("builds a literal equality filter for a normal number value", () => {
+    const filter = buildCellFilter({
+      type: "number",
+      value: 42,
+      comparison: "eq",
+      dataType: "number",
+    });
+    expect(filter).toEqual({ type: "number", operator: "==", value: 42 });
+  });
+});

package/src/components/data-table/__tests__/date-filter-inputs.test.tsx

@@ -1,7 +1,30 @@
 /* Copyright 2026 Marimo. All rights reserved. */
 import { describe, expect, it } from "vitest";
 import { dateToLocalISODate } from "@/utils/dates";
-import { parsePastedRange } from "../date-filter-inputs";
+import { parsePastedDate, parsePastedRange } from "../date-filter-inputs";
+
+describe("parsePastedDate", () => {
+  it("parses a time-only string for the time filter type", () => {
+    const result = parsePastedDate("time", "2:30 PM");
+    expect(result).toEqual(new Date(1970, 0, 1, 14, 30));
+  });
+
+  it("parses a local ISO datetime for the datetime filter type", () => {
+    const result = parsePastedDate("datetime", "2026-02-01T08:30:00");
+    expect(result).toEqual(new Date(2026, 1, 1, 8, 30, 0));
+  });
+
+  it("falls back to the Date constructor for other formats", () => {
+    const result = parsePastedDate("datetime", "Feb 1, 2026 08:30:00");
+    expect(result).toBeDefined();
+    expect(result?.getFullYear()).toBe(2026);
+  });
+
+  it("returns undefined for an empty or unparsable string", () => {
+    expect(parsePastedDate("date", "")).toBeUndefined();
+    expect(parsePastedDate("time", "not-a-time")).toBeUndefined();
+  });
+});
 
 describe("parsePastedRange", () => {
   it.each([