Stabilize invoice-period responsive layout assertion (#254)
Wait for WebKit to settle responsive layout boxes before asserting tablet and mobile positioning.
This commit is contained in:
@@ -1334,10 +1334,16 @@ async function expandTreeNode(page, key) {
|
||||
|
||||
async function getBoundingBox(locator, label) {
|
||||
await expect(locator).toBeVisible();
|
||||
const box = await locator.boundingBox();
|
||||
if (!box) {
|
||||
throw new Error(`${label} did not produce a bounding box`);
|
||||
}
|
||||
let box = null;
|
||||
await expect
|
||||
.poll(
|
||||
async () => {
|
||||
box = await locator.boundingBox();
|
||||
return box !== null;
|
||||
},
|
||||
{ message: `${label} did not produce a bounding box` }
|
||||
)
|
||||
.toBe(true);
|
||||
return box;
|
||||
}
|
||||
|
||||
@@ -1490,20 +1496,19 @@ test.describe("Invoicing period tab", () => {
|
||||
await expect(page.getByTestId("invoicing-period-customer-4002")).toBeVisible();
|
||||
|
||||
await page.setViewportSize({ width: 820, height: 1180 });
|
||||
const tabletDetailBox = await page.getByTestId("invoicing-period-review-detail").boundingBox();
|
||||
const tabletQueueBox = await page.locator(".period-review-queue").boundingBox();
|
||||
expect(tabletDetailBox).not.toBeNull();
|
||||
expect(tabletQueueBox).not.toBeNull();
|
||||
const tabletDetailBox = await getBoundingBox(
|
||||
page.getByTestId("invoicing-period-review-detail"),
|
||||
"tablet review detail"
|
||||
);
|
||||
const tabletQueueBox = await getBoundingBox(page.locator(".period-review-queue"), "tablet review queue");
|
||||
expect(tabletDetailBox.y).toBeLessThan(tabletQueueBox.y);
|
||||
await expect
|
||||
.poll(() => page.evaluate(() => document.documentElement.scrollWidth <= document.documentElement.clientWidth))
|
||||
.toBe(true);
|
||||
|
||||
await page.setViewportSize({ width: 390, height: 844 });
|
||||
const detailBox = await page.getByTestId("invoicing-period-review-detail").boundingBox();
|
||||
const queueBox = await page.locator(".period-review-queue").boundingBox();
|
||||
expect(detailBox).not.toBeNull();
|
||||
expect(queueBox).not.toBeNull();
|
||||
const detailBox = await getBoundingBox(page.getByTestId("invoicing-period-review-detail"), "mobile review detail");
|
||||
const queueBox = await getBoundingBox(page.locator(".period-review-queue"), "mobile review queue");
|
||||
expect(detailBox.y).toBeLessThan(queueBox.y);
|
||||
await expect
|
||||
.poll(() => page.evaluate(() => document.documentElement.scrollWidth <= document.documentElement.clientWidth))
|
||||
|
||||
Reference in New Issue
Block a user