peter
df7c3db085
The pxBox contract test held the literal w-[150px] it probes, which the new lint rule refuses, and stickyTop's test used Array.at, outside the tsconfig lib. Both landed because a local lane check piped its exit code into tail.
65 lines
2.0 KiB
TypeScript
65 lines
2.0 KiB
TypeScript
// @vitest-environment jsdom
|
|
//
|
|
// The page scroller's top fade sits ON a sticky table header, so a page with one used to opt out by
|
|
// hand (`fadeTop: false` in the module registry, plus an App special case for the Channels card
|
|
// layout) — and the next table page would have re-acquired the defect with every lane green. The
|
|
// header now says so itself: while a `ColumnHead` is mounted the scroller asks for no top fade.
|
|
import { afterEach, describe, expect, it, vi } from "vitest";
|
|
import { cleanup, render } from "@testing-library/react";
|
|
|
|
const fadeTopArgs: boolean[] = [];
|
|
vi.mock("../../lib/useScrollFade", () => ({
|
|
useScrollFade: (_px: number, fadeTop: boolean) => {
|
|
fadeTopArgs.push(fadeTop);
|
|
return { ref: () => {}, style: {} };
|
|
},
|
|
}));
|
|
vi.mock("react-i18next", async (importOriginal) => {
|
|
const actual = await importOriginal<typeof import("react-i18next")>();
|
|
return { ...actual, useTranslation: () => ({ t: (key: string) => key }) };
|
|
});
|
|
|
|
import PageScroller from "./PageScroller";
|
|
import { ColumnHead } from "./tableHeader";
|
|
|
|
const last = () => fadeTopArgs[fadeTopArgs.length - 1];
|
|
|
|
afterEach(() => {
|
|
cleanup();
|
|
fadeTopArgs.length = 0;
|
|
});
|
|
|
|
function page(withTable: boolean) {
|
|
return (
|
|
<PageScroller scrollKey="k">
|
|
{withTable ? (
|
|
<table>
|
|
<ColumnHead
|
|
columns={[]}
|
|
sort={null}
|
|
onToggleSort={() => {}}
|
|
filters={{}}
|
|
onFilter={() => {}}
|
|
/>
|
|
</table>
|
|
) : (
|
|
<div>cards</div>
|
|
)}
|
|
</PageScroller>
|
|
);
|
|
}
|
|
|
|
describe("the page scroller's top fade and a sticky table header", () => {
|
|
it("is off while the header is mounted, and back on the moment it is gone", () => {
|
|
const view = render(page(true));
|
|
expect(last()).toBe(false);
|
|
view.rerender(page(false)); // e.g. the Channels card layout, or a narrow DataTable
|
|
expect(last()).toBe(true);
|
|
});
|
|
|
|
it("is on for a page with no sticky header at all", () => {
|
|
render(page(false));
|
|
expect(last()).toBe(true);
|
|
});
|
|
});
|