copenhagentruckwash/pleno-vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Stabilize invoice-period responsive layout assertion (#254)

Browse Source 
Wait for WebKit to settle responsive layout boxes before asserting tablet and mobile positioning.
This commit is contained in:
Jeppe B
2026-08-03 12:54:45 +02:00
committed by GitHub
parent f4816124c2
commit 3639527b0e
1 changed files with 17 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tests/e2e/invoicing-period.smoke.spec.js
+17 -12
View File
@@ -1334,10 +1334,16 @@ async function expandTreeNode(page, key) {
async function getBoundingBox(locator, label) { async function getBoundingBox(locator, label) {
await expect(locator).toBeVisible(); await expect(locator).toBeVisible();
const box = await locator.boundingBox(); let box = null;
if (!box) { await expect
throw new Error(`${label} did not produce a bounding box`); .poll(
} async () => {
box = await locator.boundingBox();
return box !== null;
},
{ message: `${label} did not produce a bounding box` }
)
.toBe(true);
return box; return box;
} }
@@ -1490,20 +1496,19 @@ test.describe("Invoicing period tab", () => {
await expect(page.getByTestId("invoicing-period-customer-4002")).toBeVisible(); await expect(page.getByTestId("invoicing-period-customer-4002")).toBeVisible();
await page.setViewportSize({ width: 820, height: 1180 }); await page.setViewportSize({ width: 820, height: 1180 });
const tabletDetailBox = await page.getByTestId("invoicing-period-review-detail").boundingBox(); const tabletDetailBox = await getBoundingBox(
const tabletQueueBox = await page.locator(".period-review-queue").boundingBox(); page.getByTestId("invoicing-period-review-detail"),
expect(tabletDetailBox).not.toBeNull(); "tablet review detail"
expect(tabletQueueBox).not.toBeNull(); );
const tabletQueueBox = await getBoundingBox(page.locator(".period-review-queue"), "tablet review queue");
expect(tabletDetailBox.y).toBeLessThan(tabletQueueBox.y); expect(tabletDetailBox.y).toBeLessThan(tabletQueueBox.y);
await expect await expect
.poll(() => page.evaluate(() => document.documentElement.scrollWidth <= document.documentElement.clientWidth)) .poll(() => page.evaluate(() => document.documentElement.scrollWidth <= document.documentElement.clientWidth))
.toBe(true); .toBe(true);
await page.setViewportSize({ width: 390, height: 844 }); await page.setViewportSize({ width: 390, height: 844 });
const detailBox = await page.getByTestId("invoicing-period-review-detail").boundingBox(); const detailBox = await getBoundingBox(page.getByTestId("invoicing-period-review-detail"), "mobile review detail");
const queueBox = await page.locator(".period-review-queue").boundingBox(); const queueBox = await getBoundingBox(page.locator(".period-review-queue"), "mobile review queue");
expect(detailBox).not.toBeNull();
expect(queueBox).not.toBeNull();
expect(detailBox.y).toBeLessThan(queueBox.y); expect(detailBox.y).toBeLessThan(queueBox.y);
await expect await expect
.poll(() => page.evaluate(() => document.documentElement.scrollWidth <= document.documentElement.clientWidth)) .poll(() => page.evaluate(() => document.documentElement.scrollWidth <= document.documentElement.clientWidth))