78 lines
2.5 KiB
TypeScript
78 lines
2.5 KiB
TypeScript
import { expect, test } from "@playwright/test";
|
|
import {
|
|
CANVAS_ARRANGE_COMPONENT_GAP,
|
|
CANVAS_ARRANGE_NODE_GAP,
|
|
CANVAS_ARRANGE_SNAP_GRID_SIZE,
|
|
applyCanvasArrangeUpdates,
|
|
arrangeCanvasNodes,
|
|
getArrangeCanvasViewport,
|
|
} from "@/lib/canvas/arrange";
|
|
|
|
const nodes = [
|
|
{ height: 350, id: "source", width: 350, x: 13, y: 17 },
|
|
{ height: 350, id: "target", width: 350, x: 20, y: 500 },
|
|
{ height: 350, id: "isolated", width: 350, x: 2000, y: 1000 },
|
|
];
|
|
|
|
test.describe("video canvas arrange", () => {
|
|
test("uses the competitor's ELK spacing, rightward layering, and twelve-unit grid", async () => {
|
|
expect(CANVAS_ARRANGE_NODE_GAP).toBe(100);
|
|
expect(CANVAS_ARRANGE_COMPONENT_GAP).toBe(150);
|
|
expect(CANVAS_ARRANGE_SNAP_GRID_SIZE).toBe(12);
|
|
|
|
await expect(
|
|
arrangeCanvasNodes(nodes, [{ source: "source", target: "target" }])
|
|
).resolves.toEqual([
|
|
{ id: "source", position: { x: 12, y: 12 } },
|
|
{ id: "target", position: { x: 564, y: 12 } },
|
|
{ id: "isolated", position: { x: 1068, y: 12 } },
|
|
]);
|
|
});
|
|
|
|
test("deduplicates repeated root edges before laying out a connected component", async () => {
|
|
const singleEdgeResult = await arrangeCanvasNodes(nodes, [
|
|
{ source: "source", target: "target" },
|
|
]);
|
|
const duplicateEdgeResult = await arrangeCanvasNodes(nodes, [
|
|
{ source: "source", target: "target" },
|
|
{ source: "source", target: "target" },
|
|
]);
|
|
|
|
expect(duplicateEdgeResult).toEqual(singleEdgeResult);
|
|
});
|
|
|
|
test("does not create a confirmation update for zero or one root node", async () => {
|
|
await expect(arrangeCanvasNodes([], [])).resolves.toEqual([]);
|
|
await expect(arrangeCanvasNodes([nodes[0]], [])).resolves.toEqual([]);
|
|
});
|
|
|
|
test("applies only changed positions and preserves the rest of each node", () => {
|
|
expect(
|
|
applyCanvasArrangeUpdates(
|
|
nodes.map((node) => ({ ...node, title: node.id })),
|
|
[{ id: "target", position: { x: 564, y: 12 } }]
|
|
)
|
|
).toEqual([
|
|
{ ...nodes[0], title: "source" },
|
|
{ ...nodes[1], title: "target", x: 564, y: 12 },
|
|
{ ...nodes[2], title: "isolated" },
|
|
]);
|
|
});
|
|
|
|
test("fits arranged bounds from a fixed 48-pixel origin with twelve-percent padding", () => {
|
|
expect(
|
|
getArrangeCanvasViewport({
|
|
canvasHeight: 805,
|
|
canvasWidth: 1512,
|
|
maxZoom: 8,
|
|
minZoom: 0.1,
|
|
nodes,
|
|
})
|
|
).toEqual({
|
|
x: 40.987996999249816,
|
|
y: 38.8304576144036,
|
|
zoom: 0.5393848462115529,
|
|
});
|
|
});
|
|
});
|