cents/tests/e2e/08-兼容性/01-iOS视口.spec.ts

42 lines
1.6 KiB
TypeScript

import { test, expect, devices } from "@playwright/test";
import { makeEntry, mockApi, } from "../测试夹具";
async function expectNoHorizontalOverflow(page: import("@playwright/test").Page) {
await expect.poll(async () => page.evaluate(() =>
Math.max(document.documentElement.scrollWidth, document.body.scrollWidth) - window.innerWidth,
)).toBeLessThanOrEqual(0);
}
test.describe("iOS 视口兼容性", () => {
test("01-双击不会触发浏览器默认缩放行为", async ({ page }) => {
await mockApi(page);
await (page);
await expect.poll(async () => page.evaluate(() => {
const event = new MouseEvent("dblclick", { bubbles: true, cancelable: true });
return window.dispatchEvent(event);
})).toBe(false);
});
test("02-iPhone 窄视口的主要页面不产生横向滚动", async ({ browser }) => {
const context = await browser.newContext({ ...devices["iPhone SE"] });
const page = await context.newPage();
await mockApi(page, { initialEntries: [makeEntry()] });
await (page);
for (const path of ["/", "/stats", "/ledgers", "/entries/entry-lunch"]) {
await page.goto(path);
await expect(page.locator(".app-shell")).toBeVisible();
await expectNoHorizontalOverflow(page);
}
await page.goto("/");
await page.getByRole("button", { name: "记一笔" }).click();
await expect(page.getByRole("region", { name: "快速记账" })).toBeVisible();
await page.getByLabel("备注").click();
await expect(page.getByLabel("备注")).toHaveCSS("font-size", "16px");
await expectNoHorizontalOverflow(page);
await context.close();
});
});