Fix workspace tab timeline flicker

2026-06-04 19:10:33 +07:00
parent 74d42cb3d0
commit 3d8ef237e3
2 changed files with 92 additions and 35 deletions
@@ -0,0 +1,52 @@
+// @vitest-environment jsdom
+
+import { renderHook } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import { useMountedTabSet } from "./use-mounted-tab-set";
+
+function mountedIds(result: { current: ReturnType<typeof useMountedTabSet> }): string[] {
+  return Array.from(result.current.mountedTabIds);
+}
+
+describe("useMountedTabSet", () => {
+  it("includes a newly active tab in the same render", () => {
+    let renderCount = 0;
+    const { result, rerender } = renderHook(
+      ({ activeTabId }) => {
+        renderCount += 1;
+        return useMountedTabSet({
+          activeTabId,
+          allTabIds: ["first", "second"],
+          cap: 3,
+        });
+      },
+      { initialProps: { activeTabId: "first" } },
+    );
+
+    expect(mountedIds(result)).toEqual(["first"]);
+    expect(renderCount).toBe(1);
+
+    rerender({ activeTabId: "second" });
+
+    expect(mountedIds(result)).toEqual(["second", "first"]);
+    expect(renderCount).toBe(2);
+  });
+
+  it("preserves the cap while synchronously adding the active tab", () => {
+    const { result, rerender } = renderHook(
+      ({ activeTabId }) =>
+        useMountedTabSet({
+          activeTabId,
+          allTabIds: ["first", "second", "third"],
+          cap: 2,
+        }),
+      { initialProps: { activeTabId: "first" } },
+    );
+
+    rerender({ activeTabId: "second" });
+    expect(mountedIds(result)).toEqual(["second", "first"]);
+
+    rerender({ activeTabId: "third" });
+    expect(mountedIds(result)).toEqual(["third", "second"]);
+  });
+});