// @vitest-environment jsdom // // E31 (the owner): a page's sub-tab was remembered forever in localStorage, so every fresh browser tab // opened Configuration on "Plex" as if that were its home. The position is now kept per browser tab // (sessionStorage): it survives a reload and a trip to another page, and a new tab starts on the first. import { afterEach, beforeEach, describe, expect, it } from "vitest"; import { act, renderHook } from "@testing-library/react"; import { ACTIVE_ACCOUNT_KEY } from "./activeAccount"; import { setTabRaw, useTabPersistedState } from "./storage"; beforeEach(() => { sessionStorage.setItem(ACTIVE_ACCOUNT_KEY, "1"); }); afterEach(() => { sessionStorage.clear(); localStorage.clear(); }); describe("a page's sub-tab, per browser tab", () => { it("starts on the fallback, then keeps the picked tab for this browser tab only", () => { const first = renderHook(() => useTabPersistedState("siftlode.configTab", "access")); expect(first.result.current[0]).toBe("access"); act(() => first.result.current[1]("plex")); expect(sessionStorage.getItem("siftlode.configTab.1")).toBe("plex"); expect(localStorage.getItem("siftlode.configTab.1")).toBeNull(); // The page mounts again in this tab (a reload, or back from another page): it is where it was. first.unmount(); expect( renderHook(() => useTabPersistedState("siftlode.configTab", "access")).result.current[0], ).toBe("plex"); }); it("ignores a position left in localStorage by an older build, and clears it", () => { localStorage.setItem("siftlode.configTab.1", "plex"); const { result } = renderHook(() => useTabPersistedState("siftlode.configTab", "access")); expect(result.current[0]).toBe("access"); expect(localStorage.getItem("siftlode.configTab.1")).toBeNull(); }); it("a pre-selected tab is the one the page opens on", () => { setTabRaw("siftlode.adminUsersTab", "access"); const { result } = renderHook(() => useTabPersistedState("siftlode.adminUsersTab", "roles")); expect(result.current[0]).toBe("access"); }); });