48 lines
2.0 KiB
TypeScript
48 lines
2.0 KiB
TypeScript
import { expect, test } from "@playwright/test";
|
|
import { captureScreenshot } from "./helpers";
|
|
|
|
const viewports = [
|
|
{ name: "desktop-1440x900", width: 1440, height: 900 },
|
|
{ name: "mobile-390x844", width: 390, height: 844 },
|
|
];
|
|
const states = [
|
|
{ name: "active", live: true, label: "Working…" },
|
|
{ name: "complete", live: false, label: "Actions" },
|
|
];
|
|
|
|
test("tool activity stays collapsed until disclosed", async ({ page }, testInfo) => {
|
|
for (const viewport of viewports) {
|
|
await page.setViewportSize(viewport);
|
|
for (const state of states) {
|
|
await page.goto(`/e2e/fixtures/tool-activity-disclosure.html?live=${state.live ? 1 : 0}`);
|
|
const details = page.getByTestId("tool-activity");
|
|
const summary = details.locator("summary");
|
|
const rows = page.getByTestId("tool-rows");
|
|
|
|
await expect(summary).toHaveText(state.label);
|
|
await expect(details).not.toHaveAttribute("open", "");
|
|
await expect(rows).not.toBeVisible();
|
|
await expect(page.getByTestId("final-response")).toHaveCount(state.live ? 0 : 1);
|
|
await captureScreenshot(page, testInfo, `${state.name}-collapsed-${viewport.name}`);
|
|
|
|
await summary.click();
|
|
await expect(details).toHaveAttribute("open", "");
|
|
await summary.click();
|
|
await summary.focus();
|
|
await page.keyboard.press("Enter");
|
|
await expect(details).toHaveAttribute("open", "");
|
|
await expect(rows).toBeVisible();
|
|
await expect(summary).toBeFocused();
|
|
await expect(page.locator("body")).toHaveJSProperty("scrollWidth", viewport.width);
|
|
if (!state.live) {
|
|
const rowBox = await rows.boundingBox();
|
|
const responseBox = await page.getByTestId("final-response").boundingBox();
|
|
expect(rowBox).not.toBeNull();
|
|
expect(responseBox).not.toBeNull();
|
|
expect(responseBox?.y).toBeGreaterThan((rowBox?.y ?? 0) + (rowBox?.height ?? 0));
|
|
}
|
|
await captureScreenshot(page, testInfo, `${state.name}-expanded-${viewport.name}`);
|
|
}
|
|
}
|
|
});
|