import assert from "node:assert/strict"; import { readFile } from "node:fs/promises"; import test from "node:test"; import { applyEditedPathToNode, editablePathForNode, isEditablePathNode, normalizedPathDataToSvg } from "../src/ui/pages/CanvasWorkspace/canvas/editablePath.ts"; const shapeNode = { id: "shape-1", type: "frame", title: "Rectangle", x: 10, y: 20, width: 100, height: 60, content: JSON.stringify({ kind: "rectangle", cornerRadius: 0 }), tone: "shape", status: "draft", layerRole: "shape", fillColor: "transparent", strokeColor: "#111827", strokeWidth: 2 }; test("converts shape-tool geometry into commands supported by the path editor", () => { const path = editablePathForNode(shapeNode); assert.match(path, /^M /); assert.match(path, / L /); assert.match(path, / Z$/); assert.doesNotMatch(path, /[AHV]/); }); test("persists an edited shape path and expands its canvas bounds without moving world vertices", () => { const edited = applyEditedPathToNode(shapeNode, [1, -10, 10, 2, 100, 10, 2, 100, 60, 2, -10, 60, 11]); const options = JSON.parse(edited.content); assert.equal(options.kind, "path"); assert.ok(Array.isArray(options.pathData)); assert.equal(edited.x, -3); assert.equal(edited.width, 116); assert.match(editablePathForNode(edited), /^M 3 10/); }); test("keeps unmarked Brush strokes outside the vertex editor", () => { const brushSvg = ''; const brushNode = { ...shapeNode, id: "brush-1", type: "image", title: "Brush stroke", width: 100, height: 50, content: `data:image/svg+xml;charset=utf-8,${encodeURIComponent(brushSvg)}`, layerRole: "pen-stroke", strokeColor: "#000000", strokeWidth: 3 }; assert.equal(isEditablePathNode(brushNode), false); assert.equal(editablePathForNode(brushNode), null); assert.equal(applyEditedPathToNode(brushNode, [1, 5, 5, 2, 95, 45]), brushNode); }); test("scales normalized cubic data back into SVG coordinates", () => { assert.equal(normalizedPathDataToSvg([1, 0, 0.5, 5, 0.25, 0, 0.75, 1, 1, 0.5, 11], 200, 100), "M 0 50 C 50 0 150 100 200 50 Z"); }); test("registers SVGPathEditor on the project's Leafer 2.2 Path runtime", async () => { await import("@leafer-in/editor"); const core = await import("@leafer-ui/core"); await import("leafer-x-path-editor"); const path = new core.Path({ path: "M 0 0 L 10 10", editable: true }); assert.equal(path.editInner, "SVGPathEditor"); }); test("keeps the Pen tool immediately after Shape in the workspace toolbar", async () => { const source = await readFile(new URL("../src/ui/pages/CanvasWorkspace/canvas/WorkspaceToolbar.tsx", import.meta.url), "utf8"); const workspaceSource = await readFile(new URL("../src/ui/pages/CanvasWorkspace/index.tsx", import.meta.url), "utf8"); const styles = await readFile(new URL("../src/ui/styles.css", import.meta.url), "utf8"); const nodePointerSource = workspaceSource.slice(workspaceSource.indexOf("const handleNodePointerDown"), workspaceSource.indexOf("const startPathEditing")); assert.ok(source.indexOf(" chooseCanvasTool\("path"\)\)/); assert.match(workspaceSource, /key === "b"\) return void run\(\(\) => chooseCanvasTool\("pen"\)\)/); assert.match(styles, /\.canvas-stage\.is-path-pen-tool \.canvas-world \*/); assert.match(styles, /\.canvas-stage\.is-path-pen-tool \.canvas-path-editor-overlay \*/); assert.match(styles, /cursor:\s*url\("\/cursors\/pen-tool\.png\?v=4"\) 4 4, default !important;/); });