37 lines
1.2 KiB
TypeScript
37 lines
1.2 KiB
TypeScript
import { expect, test } from "../support/browser/strict-browser-test.ts";
|
|
|
|
test("reflows the UI gallery at the 320px minimum without horizontal overflow", async ({
|
|
page,
|
|
}) => {
|
|
await page.setViewportSize({ width: 320, height: 720 });
|
|
await page.goto("/examples/ui");
|
|
await expect(
|
|
page.getByRole("heading", { level: 1, name: "UI 구성요소" }),
|
|
).toBeVisible();
|
|
await expect(
|
|
page.getByRole("button", { name: "메뉴", exact: true }),
|
|
).toBeVisible();
|
|
|
|
const viewport = await page.evaluate(() => ({
|
|
clientWidth: document.documentElement.clientWidth,
|
|
scrollWidth: document.documentElement.scrollWidth,
|
|
}));
|
|
expect(viewport.scrollWidth).toBeLessThanOrEqual(viewport.clientWidth);
|
|
});
|
|
|
|
test("keeps desktop navigation and two-column examples at wide viewports", async ({
|
|
page,
|
|
}) => {
|
|
await page.setViewportSize({ width: 1440, height: 900 });
|
|
await page.goto("/examples/ui");
|
|
|
|
await expect(page.getByRole("navigation", { name: "주요 탐색" })).toBeVisible();
|
|
await expect(
|
|
page.getByRole("button", { name: "메뉴", exact: true }),
|
|
).toBeHidden();
|
|
await expect(page.locator(".component-grid--two").first()).toHaveCSS(
|
|
"grid-template-columns",
|
|
/.+px .+px/,
|
|
);
|
|
});
|