- Nav rail page rows are real links (/?page=<id>): a middle-click or Ctrl-click opens the page in a new tab; a plain click stays in-app. - A fresh channel page shows the unwatched videos; a picked watch state is a remembered preference (channelShow). - Users: the role, suspend and delete move into the row's one menu (the "…", right-click, Shift+F10); locked ones keep their reason. - Audit log: back-to-back successful runs of one job fold into one row that opens to the earlier ones; a failed run reads in the danger colour. - DESIGN.md decision log: the E31 picks.
110 lines
3.7 KiB
TypeScript
110 lines
3.7 KiB
TypeScript
// @vitest-environment jsdom
|
|
//
|
|
// E31 (the owner): a freshly opened channel page shows what is still unwatched, and a watch state the
|
|
// viewer picks there sticks — a reload (a fresh mount, seeded from the stored preference) keeps it.
|
|
import type { ReactNode } from "react";
|
|
import { describe, it, expect, vi, beforeAll, afterEach } from "vitest";
|
|
import { render, cleanup, act } from "@testing-library/react";
|
|
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
|
|
import type { FeedFilters } from "../lib/api";
|
|
|
|
vi.mock("react-i18next", async (importOriginal) => ({
|
|
...(await importOriginal<typeof import("react-i18next")>()),
|
|
useTranslation: () => ({ t: (key: string) => key, i18n: { language: "en" } }),
|
|
}));
|
|
vi.mock("./navigationContext", () => ({
|
|
useNavigationActions: () => ({ closeChannel: vi.fn(), openChannel: vi.fn() }),
|
|
}));
|
|
vi.mock("./confirmContext", () => ({ useConfirm: () => async () => true }));
|
|
vi.mock("./feedFiltersContext", () => ({
|
|
useFeedFilters: () => ({ includeNormal: true, includeShorts: false, includeLive: false }),
|
|
}));
|
|
const feed = vi.hoisted(() => ({
|
|
last: null as null | { filters: FeedFilters; setFilters: (f: FeedFilters) => void },
|
|
}));
|
|
vi.mock("./Feed", () => ({
|
|
default: (p: { filters: FeedFilters; setFilters: (f: FeedFilters) => void }) => {
|
|
feed.last = p;
|
|
return null;
|
|
},
|
|
}));
|
|
vi.mock("./ChannelAbout", () => ({ default: () => null }));
|
|
vi.mock("./ui/PageShell", async (importOriginal) => ({
|
|
...(await importOriginal<typeof import("./ui/PageShell")>()),
|
|
PageToolbar: ({ children }: { children?: ReactNode }) => <>{children}</>,
|
|
}));
|
|
|
|
import ChannelPage from "./ChannelPage";
|
|
import { api, type ChannelDetail, type Me } from "../lib/api";
|
|
import { qk } from "../lib/queryKeys";
|
|
|
|
beforeAll(() => {
|
|
class Stub {
|
|
observe() {}
|
|
unobserve() {}
|
|
disconnect() {}
|
|
takeRecords() {
|
|
return [];
|
|
}
|
|
}
|
|
globalThis.ResizeObserver ??= Stub as unknown as typeof ResizeObserver;
|
|
globalThis.IntersectionObserver ??= Stub as unknown as typeof IntersectionObserver;
|
|
});
|
|
afterEach(() => {
|
|
cleanup();
|
|
vi.restoreAllMocks();
|
|
feed.last = null;
|
|
});
|
|
|
|
const CH = "UCqoAEDirJPjEUFcF2FklnBA";
|
|
|
|
function mount(preferences: Record<string, unknown> = {}) {
|
|
vi.spyOn(api, "channelDetail").mockResolvedValue({
|
|
id: CH,
|
|
title: "StarTalk",
|
|
subscribed: true,
|
|
stored_videos: 10,
|
|
} as unknown as ChannelDetail);
|
|
vi.spyOn(api, "tags").mockResolvedValue([] as never);
|
|
const save = vi.spyOn(api, "savePrefs").mockResolvedValue({} as never);
|
|
const qc = new QueryClient({ defaultOptions: { queries: { retry: false } } });
|
|
qc.setQueryData(qk.me(), { id: 1, preferences } as unknown as Me);
|
|
render(
|
|
<QueryClientProvider client={qc}>
|
|
<ChannelPage
|
|
channelId={CH}
|
|
initialName="StarTalk"
|
|
me={{ id: 1, can_write: true, can_read: true } as unknown as Me}
|
|
view="cards"
|
|
setView={() => {}}
|
|
onShowInFeed={() => {}}
|
|
/>
|
|
</QueryClientProvider>,
|
|
);
|
|
return save;
|
|
}
|
|
|
|
describe("ChannelPage — the watch state", () => {
|
|
it("shows only the unwatched videos on a freshly opened page", () => {
|
|
mount();
|
|
expect(feed.last?.filters.show).toBe("unwatched");
|
|
});
|
|
|
|
it("stores a picked watch state", () => {
|
|
const save = mount();
|
|
act(() => feed.last!.setFilters({ ...feed.last!.filters, show: "all" }));
|
|
expect(feed.last?.filters.show).toBe("all");
|
|
expect(save).toHaveBeenCalledWith({ channelShow: "all" });
|
|
});
|
|
|
|
it("keeps the stored watch state after a reload", () => {
|
|
mount({ channelShow: "watched" });
|
|
expect(feed.last?.filters.show).toBe("watched");
|
|
});
|
|
|
|
it("falls back to unwatched for a stored value it does not know", () => {
|
|
mount({ channelShow: "bogus" });
|
|
expect(feed.last?.filters.show).toBe("unwatched");
|
|
});
|
|
});
|