peter
046dde44a4
The center's rows (title, message, refusal, live button) were never rendered across a language switch, and nothing held the structural compare that coalescing now needs. The channel-link helper swallowed whatever ended its poll into a bare false: a link that goes away mid-look now counts as not hit, and no hittable link fails with the poll's own message.
103 lines
4.8 KiB
TypeScript
103 lines
4.8 KiB
TypeScript
import { readFileSync } from "node:fs";
|
|
import { expect, type Page } from "@playwright/test";
|
|
|
|
/** The plain member's saved session (global.setup.ts signs it in); `member.spec.ts` and
|
|
* `devices.spec.ts` run from it. */
|
|
export const MEMBER_STORAGE = "e2e/.auth/member.json";
|
|
// The seed's own answer (scripts/e2e_seed.py), written by global.setup: the videos it chose.
|
|
export const SEED_FILE = "e2e/.auth/seed.json";
|
|
|
|
/** The videos the seed chose for the main account under `key` in its answer. */
|
|
export function seeded(key: string): string[] {
|
|
const ids = (JSON.parse(readFileSync(SEED_FILE, "utf-8")) as Record<string, unknown>)[key];
|
|
if (!Array.isArray(ids) || !ids.length) throw new Error(`the seed chose no ${key} videos`);
|
|
return ids as string[];
|
|
}
|
|
|
|
/** Open the app and wait for the authenticated shell (the nav rail) to be ready. */
|
|
export async function openApp(page: Page, path = "/"): Promise<void> {
|
|
await page.goto(path);
|
|
await expect(page.getByTestId("nav-feed")).toBeVisible();
|
|
}
|
|
|
|
/** Click a top-level module in the nav rail and confirm it becomes the active page. */
|
|
export async function gotoPage(page: Page, id: string): Promise<void> {
|
|
await page.getByTestId(`nav-${id}`).click();
|
|
await expect(page.getByTestId(`nav-${id}`)).toHaveAttribute("aria-current", "page");
|
|
}
|
|
|
|
/**
|
|
* Click a channel link a real user can actually SEE and hit. Never use `.first()` for this after
|
|
* scrolling: the first rendered card lives in the virtualizer's overscan ABOVE the viewport, so
|
|
* Playwright would scroll it into view to click it, moving the scroll position — fatal to any test
|
|
* that then asserts on where the feed was. Being inside the viewport is not enough either: a card
|
|
* can sit under the page chrome above the scroller (the update banner, the toolbar band), and the
|
|
* covered click makes Playwright scroll and retry — the same move (webkit failed 3 in 24).
|
|
* So the link must be the element hit at its own centre; none within the wait fails the test, with
|
|
* the poll's own message. Looked for again until one is, not once: a fresh load is still settling
|
|
* when the first card shows (the links move down ~55px), and webkit can answer the hit test at a
|
|
* link's new centre with the card under it — every link missed in 1 of 30 runs. A link that goes
|
|
* away mid-look (its evaluate waits for it, or throws) counts as not hit, so the next look runs.
|
|
*/
|
|
export async function clickVisibleChannelLink(page: Page): Promise<void> {
|
|
const links = page.getByTestId("video-card-channel").filter({ visible: true });
|
|
let index = -1;
|
|
const findHittable = async () => {
|
|
const count = await links.count();
|
|
for (let i = 0; i < count; i++) {
|
|
const hittable = await links
|
|
.nth(i)
|
|
.evaluate(
|
|
(el) => {
|
|
const r = el.getBoundingClientRect();
|
|
const hit = document.elementFromPoint(r.left + r.width / 2, r.top + r.height / 2);
|
|
return hit !== null && el.contains(hit);
|
|
},
|
|
undefined,
|
|
{ timeout: 1000 },
|
|
)
|
|
.catch(() => false);
|
|
if (hittable) return i;
|
|
}
|
|
return -1;
|
|
};
|
|
await expect
|
|
.poll(async () => (index = await findHittable()), {
|
|
message: "a channel link hit at its own centre",
|
|
timeout: 5000,
|
|
})
|
|
.toBeGreaterThan(-1);
|
|
await links.nth(index).click();
|
|
}
|
|
|
|
/**
|
|
* Assert a content-type (e.g. "includeLive") is on/off via the Content-types FilterSelect dropdown.
|
|
* The options only exist while the dropdown is open, so this opens it, checks the option's
|
|
* `aria-checked` (the multi FilterSelect renders its rows as menuitemcheckbox), then closes it
|
|
* (Escape) so the floating panel can't block a later click.
|
|
*/
|
|
export async function expectContentType(page: Page, value: string, on: boolean): Promise<void> {
|
|
await page.getByTestId("feed-content").click();
|
|
await expect(page.getByTestId(`feed-content-${value}`)).toHaveAttribute(
|
|
"aria-checked",
|
|
on ? "true" : "false",
|
|
);
|
|
await page.keyboard.press("Escape");
|
|
await expect(page.getByTestId(`feed-content-${value}`)).toHaveCount(0);
|
|
}
|
|
|
|
/** Toggle a content-type via the Content-types FilterSelect dropdown, then close it. */
|
|
export async function toggleContentType(page: Page, value: string): Promise<void> {
|
|
await page.getByTestId("feed-content").click();
|
|
await page.getByTestId(`feed-content-${value}`).click();
|
|
await page.keyboard.press("Escape");
|
|
await expect(page.getByTestId(`feed-content-${value}`)).toHaveCount(0);
|
|
}
|
|
|
|
/** Open the in-app player from the first feed card (clicks its thumbnail link). */
|
|
export async function openFirstVideo(page: Page): Promise<void> {
|
|
await expect(page.getByTestId("video-card").first()).toBeVisible();
|
|
await page.getByTestId("video-card").first().getByRole("link").first().click();
|
|
await expect(page.getByTestId("player-modal")).toBeVisible();
|
|
}
|