Add logging with filters

test/utils/cellStore.test.tsx

@@ -0,0 +1,156 @@
+import {render, screen, act} from "@testing-library/react";
+import "@testing-library/jest-dom";
+import {type Cell, cell, useCell} from "../../src/utils/cellStore.ts";
+
+describe("cell store (unit)", () => {
+  it("returns initial value with get()", () => {
+    const c = cell(123);
+    expect(c.get()).toBe(123);
+  });
+
+  it("updates value with set(next)", () => {
+    const c = cell("a");
+    c.set("b");
+    expect(c.get()).toBe("b");
+  });
+
+  it("gives previous value in set(updater)", () => {
+    const c = cell(1);
+    c.set((prev) => prev + 2);
+    expect(c.get()).toBe(3);
+  });
+
+  it("calls subscribe callback on set", () => {
+    const c = cell(0);
+    const cb = jest.fn();
+    const unsub = c.subscribe(cb);
+
+    c.set(1);
+    c.set(2);
+
+    expect(cb).toHaveBeenCalledTimes(2);
+    unsub();
+  });
+
+  it("stops notifications when unsubscribing", () => {
+    const c = cell(0);
+    const cb = jest.fn();
+    const unsub = c.subscribe(cb);
+
+    c.set(1);
+    unsub();
+    c.set(2);
+
+    expect(cb).toHaveBeenCalledTimes(1);
+  });
+
+  it("updates multiple listeners", () => {
+    const c = cell("x");
+    const a = jest.fn();
+    const b = jest.fn();
+    const ua = c.subscribe(a);
+    const ub = c.subscribe(b);
+
+    c.set("y");
+    expect(a).toHaveBeenCalledTimes(1);
+    expect(b).toHaveBeenCalledTimes(1);
+
+    ua();
+    ub();
+  });
+});
+
+describe("cell store (integration)", () => {
+  function View({c, label}: { c: Cell<any>; label: string }) {
+    const v = useCell(c);
+    // count renders to verify re-render behavior
+    (View as any).__renders = ((View as any).__renders ?? 0) + 1;
+    return <div data-testid={label}>{String(v)}</div>;
+  }
+
+  it("reads initial value and updates on set", () => {
+    const c = cell("hello");
+
+    render(<View c={c} label="value"/>);
+
+    expect(screen.getByTestId("value")).toHaveTextContent("hello");
+
+    act(() => {
+      c.set("world");
+    });
+
+    expect(screen.getByTestId("value")).toHaveTextContent("world");
+  });
+
+  it("triggers one re-render with set", () => {
+    const c = cell(1);
+    (View as any).__renders = 0;
+
+    render(<View c={c} label="num"/>);
+
+    const rendersAfterMount = (View as any).__renders;
+
+    act(() => {
+      c.set((prev: number) => prev + 1);
+    });
+
+    // exactly one extra render from the update
+    expect((View as any).__renders).toBe(rendersAfterMount + 1);
+    expect(screen.getByTestId("num")).toHaveTextContent("2");
+  });
+
+  it("unsubscribes on unmount (no errors on later sets)", () => {
+    const c = cell("a");
+
+    const {unmount} = render(<View c={c} label="value"/>);
+
+    unmount();
+
+    // should not throw even though there was a subscriber
+    expect(() =>
+      act(() => {
+        c.set("b");
+      })
+    ).not.toThrow();
+  });
+
+  it("only re-renders components that use the cell", () => {
+    const a = cell("A");
+    const b = cell("B");
+
+    let rendersA = 0;
+    let rendersB = 0;
+
+    function A() {
+      const v = useCell(a);
+      rendersA++;
+      return <div data-testid="A">{v}</div>;
+    }
+
+    function B() {
+      const v = useCell(b);
+      rendersB++;
+      return <div data-testid="B">{v}</div>;
+    }
+
+    render(
+      <>
+        <A/>
+        <B/>
+      </>
+    );
+
+    const rendersAAfterMount = rendersA;
+    const rendersBAfterMount = rendersB;
+
+    act(() => {
+      a.set("A2"); // only A should update
+    });
+
+    expect(screen.getByTestId("A")).toHaveTextContent("A2");
+    expect(screen.getByTestId("B")).toHaveTextContent("B");
+
+    expect(rendersA).toBe(rendersAAfterMount + 1);
+    expect(rendersB).toBe(rendersBAfterMount); // unchanged
+  });
+});