GovOPlaN/govoplan-core
2
0
Fork 0
Code Issues 4 Pull Requests Actions Packages Projects Releases Wiki Activity

fix(ui): unify heading help, table sizing and navigation contracts

Browse Source 
Verified with the coordinated workspace changes by devkit full run
2026-09-08T225814-186389-0000-3e3ed7cd (all seven phases passed).
This shared UI pass does not mark the individual module reviews complete.
This commit is contained in:
zemion
2026-09-09 02:03:16 +02:00
parent 6591aaa3fd
commit 6d37aa527f
54 changed files with 1728 additions and 117 deletions
Download Patch File Download Diff File Expand all files Collapse all files
webui/conformance/tests/data-grid-layout.spec.ts
+68
View File
@@ -117,6 +117,74 @@ test("constrained resizing redistributes tracks without introducing overflow", a
await expectActionsUnclipped(page);
});
for (const mode of ["cover", "free", "constrained"] as const) {
test(`${mode} resizing crosses a fixed intermediate column without changing that column`, async ({ page }) => {
await page.goto(`/?data-grid-layout&mixed-columns&mode=${mode}`);
const handle = header(page, "name").getByRole("separator");
await expect.poll(() => width(page, "actions")).toBeGreaterThanOrEqual(mode === "free" ? 180 : 181);
if (mode !== "free") await expectActionsUnclipped(page);
const initialName = await width(page, "name");
const initialDetail = await width(page, "detail");
const initialFixed = await width(page, "fixed");
const initialGrid = await page.locator(".data-grid").evaluate((element) => element.getBoundingClientRect().width);
const box = (await handle.boundingBox())!;
await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2);
await page.mouse.down();
await page.mouse.move(box.x + box.width / 2 + 80, box.y + box.height / 2, { steps: 6 });
await expect.poll(() => width(page, "name")).toBeCloseTo(initialName + 80, 0);
await expect.poll(() => width(page, "fixed")).toBeCloseTo(initialFixed, 0);
await expect.poll(() => width(page, "detail")).toBeCloseTo(initialDetail - (mode === "constrained" ? 80 : 0), 0);
await page.mouse.up();
await expect.poll(() => width(page, "name")).toBeCloseTo(initialName + 80, 0);
await expect.poll(() => page.locator(".data-grid").evaluate((element) => element.getBoundingClientRect().width))
.toBeCloseTo(initialGrid + (mode === "constrained" ? 0 : 80), 0);
await page.getByRole("button", { name: "Toggle grid mount", exact: true }).click();
await page.getByRole("button", { name: "Toggle grid mount", exact: true }).click();
await expect.poll(() => width(page, "name")).toBeCloseTo(initialName + 80, 0);
await handle.press("Shift+ArrowLeft");
await expect.poll(() => width(page, "name")).toBeCloseTo(initialName + 40, 0);
await expect.poll(() => width(page, "fixed")).toBeCloseTo(initialFixed, 0);
await handle.press("Shift+ArrowRight");
await expect.poll(() => width(page, "name")).toBeCloseTo(initialName + 80, 0);
await expect.poll(() => width(page, "fixed")).toBeCloseTo(initialFixed, 0);
});
}
test("preferred caps permit two-way resizing across fixed peers at the right scroll boundary", async ({ page }) => {
await page.goto("/?data-grid-layout&mixed-columns&preferred-limits");
await expectActionsUnclipped(page);
const initialName = await width(page, "name");
const initialFixed = await width(page, "fixed");
const nameHandle = header(page, "name").getByRole("separator");
for (let step = 0; step < 10; step += 1) await nameHandle.press("Shift+ArrowRight");
await expect.poll(() => width(page, "name")).toBeCloseTo(initialName + 400, 0);
const scroller = page.locator(".data-grid-scroll-region");
await scroller.evaluate((element) => { element.scrollLeft = element.scrollWidth; });
const detailBeforeShrink = await width(page, "detail");
const scrollBeforeShrink = await scroller.evaluate((element) => element.scrollLeft);
const handleBeforeShrink = (await nameHandle.boundingBox())!;
await page.mouse.move(handleBeforeShrink.x + handleBeforeShrink.width / 2, handleBeforeShrink.y + handleBeforeShrink.height / 2);
await page.mouse.down();
await page.mouse.move(handleBeforeShrink.x + handleBeforeShrink.width / 2 - 80, handleBeforeShrink.y + handleBeforeShrink.height / 2, { steps: 6 });
await expect.poll(() => width(page, "name")).toBeCloseTo(initialName + 320, 0);
await expect.poll(() => width(page, "detail")).toBeCloseTo(detailBeforeShrink + 80, 0);
await expect.poll(() => scroller.evaluate((element) => element.scrollLeft)).toBeCloseTo(scrollBeforeShrink, 0);
expect((await nameHandle.boundingBox())!.x).toBeCloseTo(handleBeforeShrink.x - 80, 0);
await page.mouse.up();
await expect.poll(() => width(page, "name")).toBeCloseTo(initialName + 320, 0);
const detailHandle = header(page, "detail").getByRole("separator");
await detailHandle.press("Shift+ArrowRight");
await expect.poll(() => width(page, "detail")).toBeCloseTo(detailBeforeShrink + 120, 0);
await detailHandle.press("Shift+ArrowLeft");
await expect.poll(() => width(page, "detail")).toBeCloseTo(detailBeforeShrink + 80, 0);
await expect.poll(() => width(page, "fixed")).toBeCloseTo(initialFixed, 0);
await page.getByRole("button", { name: "Toggle grid mount", exact: true }).click();
await page.getByRole("button", { name: "Toggle grid mount", exact: true }).click();
await expect.poll(() => width(page, "name")).toBeCloseTo(initialName + 320, 0);
await expect.poll(() => width(page, "detail")).toBeCloseTo(detailBeforeShrink + 80, 0);
await expect.poll(() => width(page, "fixed")).toBeCloseTo(initialFixed, 0);
});
test("explicit composite action groups include outer controls in their measured minimum", async ({ page }) => {
await page.goto("/?data-grid-layout&mode=composite");
await expect.poll(() => width(page, "actions")).toBeGreaterThanOrEqual(221);