fix(dashboard): compact bookmark dividers

This commit is contained in:
vince 2026-06-19 04:11:14 +02:00
parent 769d624799
commit ba904ef4f9
5 changed files with 65 additions and 9 deletions

View file

@ -106,6 +106,49 @@ test.describe("dashboard page QA gate", () => {
expect(metrics.clippedItems).toEqual([]);
});
test("renders bookmark rows as a compact divider list", async ({ page }, testInfo) => {
test.skip(testInfo.project.name !== "chromium-desktop");
await page.goto("/");
const bookmarkDensity = await page.evaluate(() => {
const panelBody = document.querySelector(".service-panel .panel__body");
const rows = Array.from(document.querySelectorAll<HTMLElement>(".service-panel .service-row"));
const first = rows[0];
const second = rows[1];
if (!panelBody || !first || !second) {
throw new Error("expected at least two bookmark rows");
}
const bodyStyle = window.getComputedStyle(panelBody);
const rowStyle = window.getComputedStyle(first);
const firstRect = first.getBoundingClientRect();
const secondRect = second.getBoundingClientRect();
return {
backgroundColor: rowStyle.backgroundColor,
borderBottomWidth: Number.parseFloat(rowStyle.borderBottomWidth),
borderLeftWidth: Number.parseFloat(rowStyle.borderLeftWidth),
borderRightWidth: Number.parseFloat(rowStyle.borderRightWidth),
columnGap: Number.parseFloat(rowStyle.columnGap),
paddingBottom: Number.parseFloat(rowStyle.paddingBottom),
paddingTop: Number.parseFloat(rowStyle.paddingTop),
panelGap: Number.parseFloat(bodyStyle.rowGap),
rowGap: secondRect.top - firstRect.bottom,
};
});
expect(bookmarkDensity.panelGap).toBe(0);
expect(bookmarkDensity.rowGap).toBeLessThanOrEqual(1);
expect(bookmarkDensity.paddingTop).toBeLessThanOrEqual(3);
expect(bookmarkDensity.paddingBottom).toBeLessThanOrEqual(3);
expect(bookmarkDensity.columnGap).toBeLessThanOrEqual(4);
expect(bookmarkDensity.borderBottomWidth).toBeGreaterThanOrEqual(1);
expect(bookmarkDensity.borderLeftWidth).toBe(0);
expect(bookmarkDensity.borderRightWidth).toBe(0);
expect(bookmarkDensity.backgroundColor).toBe("rgba(0, 0, 0, 0)");
});
test("keeps the first screen usable on mobile", async ({ page }, testInfo) => {
test.skip(testInfo.project.name !== "chromium-mobile");