import { describe, expect, test } from "bun:test"; import type { ImageDocument } from "@core/document"; import { resolveTransformTargetBounds, selectedTransformTarget } from "./transform-targets"; import { applyTransformTargetBounds } from "@commands/transform-document"; const document: ImageDocument = { id: "d1", name: "Test", version: 1, assets: [{ id: "asset-1", name: "Image", mimeType: "image/png", source: "asset://image", intrinsicSize: { w: 200, h: 100 } }], artboards: [ { id: "a1", name: "Artboard", bounds: { x: 0, y: 0, w: 100, h: 80 }, backgroundColor: "transparent", visible: true, locked: false, layers: [ { id: "l1", type: "image", name: "Image Layer", visible: true, locked: false, opacity: 1, assetId: "asset-1", transform: { position: { x: 10, y: 20 }, scale: { x: 0.5, y: 2 }, rotation: 0 }, }, ], }, ], }; describe("transform targets", () => { test("selects layer target before artboard target", () => { expect(selectedTransformTarget(document, { artboardId: "a1", layerIds: ["l1"] })).toEqual({ type: "layer", id: "l1" }); }); test("resolves artboard bounds", () => { expect(resolveTransformTargetBounds(document, { type: "artboard", id: "a1" })).toEqual({ x: 0, y: 0, w: 100, h: 80 }); }); test("resolves image layer bounds from intrinsic asset dimensions", () => { expect(resolveTransformTargetBounds(document, { type: "layer", id: "l1" })).toEqual({ x: 10, y: 20, w: 100, h: 200 }); }); test("resolves group bounds from descendant layers", () => { expect(resolveTransformTargetBounds(groupDocument(), { type: "layer", id: "g1" })).toEqual({ x: 10, y: 20, w: 300, h: 200 }); }); test("applies image layer bounds to transform", () => { const next = applyTransformTargetBounds(document, { type: "layer", id: "l1" }, { x: 30, y: 40, w: 400, h: 50 }); const layer = next.artboards[0]?.layers[0]; expect(layer?.transform).toEqual({ position: { x: 30, y: 40 }, scale: { x: 2, y: 0.5 }, rotation: 0 }); }); test("keeps attached mask bounds in sync with transformed layers", () => { const maskedDocument: ImageDocument = { ...document, assets: [...document.assets, { id: "mask-asset", name: "Mask", mimeType: "image/png", source: "asset://mask", intrinsicSize: { w: 200, h: 100 } }], artboards: [ { ...document.artboards[0]!, layers: [ { id: "mask", type: "raster", name: "Mask", visible: true, locked: false, opacity: 1, assetId: "mask-asset", transform: { position: { x: 10, y: 20 }, scale: { x: 0.5, y: 2 }, rotation: 0 }, }, { ...document.artboards[0]!.layers[0]!, clippingMask: { maskLayerId: "mask" } }, ], }, ], }; const next = applyTransformTargetBounds(maskedDocument, { type: "layer", id: "l1" }, { x: 30, y: 40, w: 400, h: 50 }); expect(next.artboards[0]?.layers[0]?.transform).toEqual({ position: { x: 30, y: 40 }, scale: { x: 2, y: 0.5 }, rotation: 0 }); expect(next.artboards[0]?.layers[1]?.transform).toEqual({ position: { x: 30, y: 40 }, scale: { x: 2, y: 0.5 }, rotation: 0 }); }); test("applies group bounds to descendant layer transforms", () => { const next = applyTransformTargetBounds(groupDocument(), { type: "layer", id: "g1" }, { x: 20, y: 40, w: 600, h: 100 }); const group = next.artboards[0]?.layers[0]; const first = group?.type === "group" ? group.children[0] : undefined; const second = group?.type === "group" ? group.children[1] : undefined; expect(first?.transform).toEqual({ position: { x: 20, y: 40 }, scale: { x: 1, y: 1 }, rotation: 0 }); expect(second?.transform).toEqual({ position: { x: 420, y: 90 }, scale: { x: 1, y: 0.5 }, rotation: 0 }); }); test("applies artboard bounds", () => { const next = applyTransformTargetBounds(document, { type: "artboard", id: "a1" }, { x: 10, y: 20, w: 200, h: 160 }); expect(next.artboards[0]?.bounds).toEqual({ x: 10, y: 20, w: 200, h: 160 }); }); }); function groupDocument(): ImageDocument { return { ...document, artboards: [ { ...document.artboards[0]!, layers: [ { id: "g1", type: "group", name: "Group", visible: true, locked: false, opacity: 1, transform: { position: { x: 0, y: 0 }, scale: { x: 1, y: 1 }, rotation: 0 }, children: [ document.artboards[0]!.layers[0]!, { ...document.artboards[0]!.layers[0]!, id: "l2", name: "Second Layer", transform: { position: { x: 210, y: 120 }, scale: { x: 0.5, y: 1 }, rotation: 0 }, }, ], }, ], }, ], }; }