peter
e795d191c5
Deep-review round 1 over main..improvement/watch-background-audio. BootGate - The tab's account pin is corrected to the account the server answered as. The server honours the pin only for an account still signed in to this browser and otherwise answers as the default, so a tab pinned to an account signed out in another tab ran as the default on the server while reading and writing the gone account's local state. - A mounted tab whose identity changes (its session ended, or the case above) reloads instead of rebuilding the tree in place, like every account switch; that also drops the previous account's query cache. The account key on the tree goes: the readyFor gate already unmounted it on every change. - An unanswered setup probe shows the error with Retry, like an unanswered account probe, instead of the signed-out landing to a signed-in user. - Comments: /api/me never 401s; the ended-session path is identity → nobody. Loading states - LoadingState's reveal delay is one clock across loading states that hand over to each other (boot screen → page-chunk fallback → the page's own fetching state), instead of a CSS delay restarted by each, which blanked a visible spinner for another 300 ms at every hand-off. BootScreen is now the shared loading visual, full screen, counting from navigation start. Plex shared link - Persists only the dimensions the link carries again. Writing the default filters for an omitted `pf` created the stored-filters key, which is what tells SavedViewsProvider the account picked filters, so the account's default Plex saved view was never applied again. Watch page - The Repeat toggle uses the shared pressed-pill paint (a solid fill when on) instead of Button variants that differ only in colour, and its flag goes through storage.ts readJSON/writeJSON. - The actions wrap under the title when the row is too narrow, instead of squeezing the title into a column a word wide on a phone; the title breaks long words. Comments that still justified code by the removed adopt effects (usePref, PrefsProvider, FeedViewProvider) are rewritten against the seed-once model. Tests: BootGate error/retry for both probes, setup mode, a failed background refetch keeping the app, the pin correction and the reload on an identity change; the shared reveal clock; the Plex link persist; the audio signature actually moved off version 4; a video download (av and v) still remuxed to an mp4. Each mutation-checked RED for its own reason.
65 lines
2.4 KiB
TypeScript
65 lines
2.4 KiB
TypeScript
// @vitest-environment jsdom
|
|
//
|
|
// A loading state fades in only after a delay, and loading states that hand over to each other share
|
|
// ONE clock. The bug it replaced: every LoadingState restarted its own 300 ms CSS delay, so a slow
|
|
// first load went spinner → blank → spinner when the page chunk's Suspense fallback handed over to
|
|
// the page's own "fetching" state. The clock is module state, so each test runs at its own time.
|
|
import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
|
|
import { render, cleanup } from "@testing-library/react";
|
|
import { LoadingState } from "./QueryState";
|
|
|
|
let now = 0;
|
|
beforeEach(() => {
|
|
vi.spyOn(performance, "now").mockImplementation(() => now);
|
|
});
|
|
afterEach(() => {
|
|
cleanup();
|
|
vi.restoreAllMocks();
|
|
});
|
|
|
|
/** The reveal delay the rendered loading state waits, in ms (0 = shown at once). */
|
|
function revealDelay(container: HTMLElement): number {
|
|
const el = container.querySelector<HTMLElement>("[role=status]")!;
|
|
const m = /ease (\d+)ms/.exec(el.style.animation);
|
|
return m ? Number(m[1]) : 0;
|
|
}
|
|
|
|
describe("LoadingState reveal", () => {
|
|
it("a loading state on its own waits the full delay", () => {
|
|
now = 10_000;
|
|
const { container } = render(<LoadingState />);
|
|
expect(revealDelay(container)).toBe(300);
|
|
});
|
|
|
|
it("one that takes over from a loading state on screen keeps that one's clock", () => {
|
|
now = 20_000;
|
|
const { container, rerender } = render(<LoadingState key="fallback" />);
|
|
now = 20_200;
|
|
rerender(<LoadingState key="page" />); // a new element: the fallback leaves as it mounts
|
|
expect(revealDelay(container)).toBe(100);
|
|
});
|
|
|
|
it("once the shared clock has run out, the next one in the hand-off shows at once", () => {
|
|
now = 30_000;
|
|
const { container, rerender } = render(<LoadingState key="fallback" />);
|
|
now = 30_400;
|
|
rerender(<LoadingState key="page" />);
|
|
expect(revealDelay(container)).toBe(0);
|
|
});
|
|
|
|
it("a loading state after a pause starts a new clock", () => {
|
|
now = 40_000;
|
|
const first = render(<LoadingState />);
|
|
first.unmount();
|
|
now = 40_500;
|
|
const { container } = render(<LoadingState />);
|
|
expect(revealDelay(container)).toBe(300);
|
|
});
|
|
|
|
it("`since` counts the wait from an earlier start (the boot screen: navigation start)", () => {
|
|
now = 50_250;
|
|
const { container } = render(<LoadingState since={50_000} delayMs={400} />);
|
|
expect(revealDelay(container)).toBe(150);
|
|
});
|
|
});
|