74 lines
2.8 KiB
TypeScript
74 lines
2.8 KiB
TypeScript
import { expect, test } from "@playwright/test";
|
|
import { captureScreenshot } from "./helpers";
|
|
|
|
test("renders the sign-in screen in Traditional Chinese with Huninn", async ({
|
|
page,
|
|
}, testInfo) => {
|
|
await page.addInitScript(() => {
|
|
localStorage.setItem("rakazo.uiLocale", "zh-TW");
|
|
});
|
|
await page.route("**/api/auth/get-session", (route) =>
|
|
route.fulfill({ status: 200, contentType: "application/json", body: "null" }),
|
|
);
|
|
|
|
await page.goto("/sign-in");
|
|
|
|
await expect(page.getByRole("heading", { name: "登入 BangSo Bot" })).toBeVisible();
|
|
await expect(page.getByPlaceholder("你的電子郵件地址")).toBeVisible();
|
|
await expect(page.getByRole("button", { name: "繼續使用電子郵件" })).toBeVisible();
|
|
await expect(page.locator("html")).toHaveAttribute("lang", "zh-TW");
|
|
await expect
|
|
.poll(() => page.locator("body").evaluate((element) => getComputedStyle(element).fontFamily))
|
|
.toContain("Huninn");
|
|
|
|
await captureScreenshot(page, testInfo, "traditional-chinese-sign-in");
|
|
});
|
|
|
|
test("keeps the Traditional Chinese welcome brand aligned on narrow screens", async ({
|
|
page,
|
|
}, testInfo) => {
|
|
await page.setViewportSize({ width: 320, height: 640 });
|
|
await page.addInitScript(() => {
|
|
localStorage.setItem("rakazo.uiLocale", "zh-TW");
|
|
});
|
|
await page.route("**/api/auth/get-session", (route) =>
|
|
route.fulfill({ status: 200, contentType: "application/json", body: "null" }),
|
|
);
|
|
|
|
await page.goto("/");
|
|
|
|
const mark = page.getByTestId("welcome-mark");
|
|
const title = page.getByTestId("welcome-title");
|
|
await expect(mark).toBeVisible();
|
|
await expect(title).toHaveText("BangSo Bot");
|
|
await expect(title).toHaveCSS("font-family", /Huninn/);
|
|
await expect(page.getByText("好幫手機器人", { exact: true })).toBeVisible();
|
|
await expect
|
|
.poll(() =>
|
|
page.evaluate(() => ({
|
|
clientWidth: document.documentElement.clientWidth,
|
|
scrollWidth: document.documentElement.scrollWidth,
|
|
})),
|
|
)
|
|
.toEqual({ clientWidth: 320, scrollWidth: 320 });
|
|
|
|
const markBox = await mark.boundingBox();
|
|
expect(markBox?.width).toBe(markBox?.height);
|
|
await captureScreenshot(page, testInfo, "traditional-chinese-welcome-narrow");
|
|
});
|
|
|
|
test("keeps the welcome wordmark shorter than its mark", async ({ page }) => {
|
|
await page.setViewportSize({ width: 1280, height: 720 });
|
|
await page.route("**/api/auth/get-session", (route) =>
|
|
route.fulfill({ status: 200, contentType: "application/json", body: "null" }),
|
|
);
|
|
|
|
await page.goto("/");
|
|
|
|
const markBox = await page.getByTestId("welcome-mark").boundingBox();
|
|
const wordmarkBox = await page.getByTestId("welcome-wordmark").boundingBox();
|
|
expect(markBox).not.toBeNull();
|
|
expect(wordmarkBox).not.toBeNull();
|
|
expect(wordmarkBox?.height).toBeLessThanOrEqual(markBox?.height ?? 0);
|
|
});
|