peter
c3d88d9b20
The 43 react-refresh/only-export-components warnings the gate let through meant an edit to a provider (or AnchoredPopover, Toaster, plexDetailUi, …) could not be hot-swapped: Fast Refresh reloads a module that also exports hooks or helpers. - Each provider's contexts, the types its hooks return and the hooks themselves live in a sibling context module (navigationContext.ts, channelsContext.ts, …); the provider file keeps the component. loadAccountFilters moved next to the feed filters' defaults (feedFiltersInit.ts), following navigationInit/playlistsInit. - Helpers that sat in component files have their own modules: welcomeMode, downloadTitle, plexPlayable, channelSync, ui/anchoredPopoverHooks, ui/pageToolbarSlot, ui/pagerContent, ui/toastLevels, ui/overlayOrder, ui/tableAlign, lib/plexDetail; the cells of the channel columns and the registry's page wrappers are components files of their own (channelCells, modulePages). - usePersistedTab, an alias of useAccountPersistedState, is gone; its callers use the original. npm run lint is now eslint --max-warnings 0, so a warning fails the gate like an error does.
52 lines
2.1 KiB
TypeScript
52 lines
2.1 KiB
TypeScript
// @vitest-environment jsdom
|
|
//
|
|
// "Manage views…" opens a dialog from a menu row, so it must close the menu FIRST and open the dialog
|
|
// on a fresh task (`closeThenAct`): the menu's focus return, queued as it unmounts, otherwise takes the
|
|
// dialog's focus back to the trigger behind its scrim — measured in Chrome on ActionMenu (E11 S2), and
|
|
// this row was the sibling that fix missed (deep-review E11 round 1). jsdom does not run that focus
|
|
// race, so the ORDER is what is pinned: the menu is gone before the dialog is asked to open.
|
|
import { beforeAll, describe, expect, it, vi } from "vitest";
|
|
import { fireEvent, render, screen } from "@testing-library/react";
|
|
import { FloatingTree } from "@floating-ui/react";
|
|
|
|
const openModal = vi.fn();
|
|
vi.mock("react-i18next", async (importOriginal) => {
|
|
const actual = await importOriginal<typeof import("react-i18next")>();
|
|
return { ...actual, useTranslation: () => ({ t: (key: string) => key }) };
|
|
});
|
|
vi.mock("./savedViewsContext", () => ({
|
|
useSavedViews: () => ({ views: [], activeViewId: null, apply: vi.fn(), openModal }),
|
|
}));
|
|
|
|
import SavedViewsPopover from "./SavedViewsPopover";
|
|
|
|
beforeAll(() => {
|
|
class Stub {
|
|
observe() {}
|
|
unobserve() {}
|
|
disconnect() {}
|
|
takeRecords() {
|
|
return [];
|
|
}
|
|
}
|
|
globalThis.ResizeObserver ??= Stub as unknown as typeof ResizeObserver;
|
|
globalThis.IntersectionObserver ??= Stub as unknown as typeof IntersectionObserver;
|
|
});
|
|
|
|
describe("SavedViewsPopover · Manage views…", () => {
|
|
it("closes the menu first, then opens the dialog once", async () => {
|
|
render(
|
|
<FloatingTree>
|
|
<SavedViewsPopover trigger="views" ariaLabel="Saved views" />
|
|
</FloatingTree>,
|
|
);
|
|
fireEvent.click(screen.getByRole("button", { name: "Saved views" }));
|
|
// floating-ui never positions in jsdom, so the surface stays visibility:hidden and the row has no
|
|
// accessible name to query by: find it by its text.
|
|
fireEvent.click(screen.getByText("views.manage"));
|
|
expect(screen.queryByRole("menuitem", { hidden: true })).toBeNull();
|
|
expect(openModal).not.toHaveBeenCalled();
|
|
await vi.waitFor(() => expect(openModal).toHaveBeenCalledTimes(1));
|
|
});
|
|
});
|