From 02870fc392d99142959aa586f8fa5b7110dbd61d Mon Sep 17 00:00:00 2001 From: ajnart Date: Sun, 23 Aug 2026 01:42:16 +0200 Subject: [PATCH] test: align grid footprint expectations --- .../components/board/layout/test/board-lanes.spec.ts | 4 ++-- .../src/components/board/layout/test/geometry.spec.ts | 10 +++++++--- .../board/sections/grid/test/fixed-grid-item.spec.ts | 8 ++++---- .../sections/grid/test/grid-preview-geometry.spec.ts | 6 +++--- .../sections/grid/test/grid-resize-outline.spec.ts | 6 +++--- 5 files changed, 19 insertions(+), 15 deletions(-) diff --git a/apps/nextjs/src/components/board/layout/test/board-lanes.spec.ts b/apps/nextjs/src/components/board/layout/test/board-lanes.spec.ts index 373a5ec6d..8dcb55fd0 100644 --- a/apps/nextjs/src/components/board/layout/test/board-lanes.spec.ts +++ b/apps/nextjs/src/components/board/layout/test/board-lanes.spec.ts @@ -8,7 +8,7 @@ import { ItemMockBuilder } from "~/components/board/items/actions/test/mocks/ite import { getBoardLaneColumnCount, getInitialBoardLogicalHeight, - getLogicalTrackSize, + getLogicalGridSize, getRootSectionForLane, } from "../index"; @@ -131,6 +131,6 @@ describe("board lanes", () => { }, ]; - expect(getInitialBoardLogicalHeight(board, layoutId)).toBe(getLogicalTrackSize(4)); + expect(getInitialBoardLogicalHeight(board, layoutId)).toBe(getLogicalGridSize(4)); }); }); diff --git a/apps/nextjs/src/components/board/layout/test/geometry.spec.ts b/apps/nextjs/src/components/board/layout/test/geometry.spec.ts index 0db173bb6..ca1887013 100644 --- a/apps/nextjs/src/components/board/layout/test/geometry.spec.ts +++ b/apps/nextjs/src/components/board/layout/test/geometry.spec.ts @@ -3,24 +3,28 @@ import { describe, expect, test } from "vitest"; import { getGridRowCountForVisualHeight, getLayoutRowCount, + getLogicalGridSize, getLogicalItemStyle, getLogicalTrackSize, normalizeGridPlacement, } from "../index"; describe("fixed dashboard geometry", () => { - test("keeps a 1x1 item exactly 200px with a fixed 12px gap", () => { + test("separates content track sizes from complete grid footprints", () => { expect(getLogicalTrackSize(1)).toBe(200); expect(getLogicalTrackSize(0.5)).toBe(94); expect(getLogicalTrackSize(2)).toBe(412); expect(getLogicalTrackSize(3)).toBe(624); + expect(getLogicalGridSize(1)).toBe(212); + expect(getLogicalGridSize(2)).toBe(424); + expect(getLogicalGridSize(3)).toBe(636); expect(getLogicalItemStyle({ x: 1, y: 2, w: 2, h: 3 })).toEqual({ position: "absolute", left: 212, top: 424, - width: 412, - height: 624, + width: 424, + height: 636, }); }); diff --git a/apps/nextjs/src/components/board/sections/grid/test/fixed-grid-item.spec.ts b/apps/nextjs/src/components/board/sections/grid/test/fixed-grid-item.spec.ts index 5cb587347..b6f5588f9 100644 --- a/apps/nextjs/src/components/board/sections/grid/test/fixed-grid-item.spec.ts +++ b/apps/nextjs/src/components/board/sections/grid/test/fixed-grid-item.spec.ts @@ -4,7 +4,7 @@ import { createRoot } from "react-dom/client"; import type { Root } from "react-dom/client"; import { afterEach, beforeEach, describe, expect, test, vi } from "vitest"; -import { getCollapsedDisplayLayout, LOGICAL_GRID_CELL_SIZE } from "../../../layout"; +import { getCollapsedDisplayLayout, getLogicalGridSize } from "../../../layout"; import { FixedGridItem } from "../fixed-grid-item"; const mocks = vi.hoisted(() => ({ @@ -250,14 +250,14 @@ describe("fixed grid item behavior", () => { expect(container.querySelector('[data-testid="board-grid-drag-affordance"]')).toBeNull(); }); - test("renders a view-only 1x1 card at the fixed 200px logical size", () => { + test("renders a view-only 1x1 card at the complete grid footprint", () => { mocks.editMode = false; renderWeather(root); const item = container.querySelector('[data-grid-id="weather"]'); expect(item).not.toBeNull(); - expect(item?.style.width).toBe(`${LOGICAL_GRID_CELL_SIZE}px`); - expect(item?.style.height).toBe(`${LOGICAL_GRID_CELL_SIZE}px`); + expect(item?.style.width).toBe(`${getLogicalGridSize(1)}px`); + expect(item?.style.height).toBe(`${getLogicalGridSize(1)}px`); expect(item?.getAttribute("role")).toBeNull(); act(() => item?.dispatchEvent(new KeyboardEvent("keydown", { key: "ArrowRight", bubbles: true }))); diff --git a/apps/nextjs/src/components/board/sections/grid/test/grid-preview-geometry.spec.ts b/apps/nextjs/src/components/board/sections/grid/test/grid-preview-geometry.spec.ts index edaf4c96d..7d4ecb10a 100644 --- a/apps/nextjs/src/components/board/sections/grid/test/grid-preview-geometry.spec.ts +++ b/apps/nextjs/src/components/board/sections/grid/test/grid-preview-geometry.spec.ts @@ -1,6 +1,6 @@ import { beforeEach, describe, expect, test } from "vitest"; -import { getLogicalTrackSize, LOGICAL_GRID_PITCH } from "~/components/board/layout"; +import { getLogicalGridSize, LOGICAL_GRID_PITCH } from "~/components/board/layout"; import { createGridPreviewDomState, syncGridPreviewGeometry } from "../grid-preview-geometry"; @@ -65,8 +65,8 @@ describe("grid preview geometry", () => { expect(active?.getAttribute("data-grid-preview")).toBe("true"); expect(active?.style.getPropertyValue("--board-grid-preview-x")).toBe(`${LOGICAL_GRID_PITCH}px`); expect(active?.style.getPropertyValue("--board-grid-preview-y")).toBe(`${LOGICAL_GRID_PITCH}px`); - expect(active?.style.getPropertyValue("--board-grid-preview-width")).toBe(`${getLogicalTrackSize(3)}px`); - expect(active?.style.getPropertyValue("--board-grid-preview-height")).toBe(`${getLogicalTrackSize(4)}px`); + expect(active?.style.getPropertyValue("--board-grid-preview-width")).toBe(`${getLogicalGridSize(3)}px`); + expect(active?.style.getPropertyValue("--board-grid-preview-height")).toBe(`${getLogicalGridSize(4)}px`); expect(active?.dataset.gridW).toBe("3"); expect(active?.dataset.gridH).toBe("4"); }); diff --git a/apps/nextjs/src/components/board/sections/grid/test/grid-resize-outline.spec.ts b/apps/nextjs/src/components/board/sections/grid/test/grid-resize-outline.spec.ts index b5633d68d..e329b2faf 100644 --- a/apps/nextjs/src/components/board/sections/grid/test/grid-resize-outline.spec.ts +++ b/apps/nextjs/src/components/board/sections/grid/test/grid-resize-outline.spec.ts @@ -1,6 +1,6 @@ import { afterEach, describe, expect, test, vi } from "vitest"; -import { getLogicalTrackSize } from "~/components/board/layout"; +import { getLogicalGridSize } from "~/components/board/layout"; import { createGridResizeOutlineController } from "../grid-resize-outline"; @@ -30,8 +30,8 @@ describe("grid resize outline", () => { const outline = shell.querySelector("[data-grid-resize-outline]"); expect(outline?.style.left).toBe("0px"); expect(outline?.style.top).toBe("0px"); - expect(outline?.style.width).toBe(`${getLogicalTrackSize(1)}px`); - expect(outline?.style.height).toBe(`${getLogicalTrackSize(2)}px`); + expect(outline?.style.width).toBe(`${getLogicalGridSize(1)}px`); + expect(outline?.style.height).toBe(`${getLogicalGridSize(2)}px`); expect(outline?.dataset.gridResizeValid).toBe("false"); controller.schedule(null);