openpencil/tests/engine
Anton Soldatov 37da83aec3
Image drag-and-drop, clipboard paste, and paste-at-cursor (#92)
* Image drag-and-drop and clipboard paste onto canvas

* Paste images at cursor position, track canvas cursor in state

* Paste nodes at cursor position (Figma and internal clipboard)

* Fix review: center images at cursor, fix hasImageFiles, clean up hash/undo

* Paste at viewport center when cursor is outside canvas

* Fix Figma paste positioning: center nodes at cursor after import

* Image support: clipboard, export, drag-and-drop, paste, renderer, tools, UI

- Clipboard: embed image bytes (base64) in OpenPencil clipboard payload so
  copy/paste between documents preserves image fills
- Fig export: write images/ folder to .fig zip (both fflate and Tauri paths)
- Tauri: extend build_fig_file to accept image entries
- Renderer: implement CROP (with imageTransform) and TILE (TileMode.Repeat)
  scale modes, fix FIT to center the fitted image
- FigmaAPI: add createImage(bytes) with sync FNV-1a hash
- Tools: add set_image_fill tool for AI/MCP
- FillPicker: replace placeholder with file picker, preview, scale mode selector
- Drag-and-drop: new use-image-drop composable creates image nodes from dropped files
- Paste: keyboard paste handler detects image clipboard items
- Shared utils: extract hashImageBytes and getImageDimensions to src/utils/image.ts

* Add image tests and Yjs image sync for collaboration

Tests (18 new):
- FigmaAPI.createImage: deterministic hash, storage, format
- set_image_fill tool: all scale modes, error handling, storage
- Clipboard roundtrip: image bytes preserved, multiple images, children
- Fig export/import: zip contains images/, full round-trip

Collab:
- Add yimages Y.Map to sync graph.images via Yjs
- Observer applies remote image adds/deletes to local graph
- syncNodeToYjs pushes referenced image data alongside node props
- syncAllNodesToYjs bulk-syncs all images on room share

* Fix FillPicker: remove deleted utils/image import, use SHA-1 inline

* Extract storeImage() on editor store, use in FillPicker and placeImageNode

* Unify image hash: use sync FNV-1a everywhere, export computeImageHash

Editor store's hashBytes (async SHA-1) produced different hashes than
FigmaAPI.createImage (sync FNV-1a) for the same bytes. This meant
drag-and-drop images couldn't be deduplicated against AI tool images.

Replace hashBytes with computeImageHash from core. storeImage() is
now sync.

* Skip drawing IMAGE fills when image data is missing

When pasting from Figma, image fills reference a CDN hash but no pixel
data is included in the clipboard. Previously this rendered as a solid
black rectangle because applyImageFill bailed without setting a shader,
leaving stale paint state.

applyFill now returns false when the fill can't be applied, and callers
skip the draw call. The node still exists with the correct imageHash —
if the image data is later provided (e.g. via file re-open), it will
render correctly.

* Warn when Figma paste has missing image data

Show amber warning toast when pasted nodes reference image fills
without available bytes (Figma clipboard limitation).

Add 'warning' toast variant with tailwind-variants, extract toast
styles to src/components/ui/toast.ts.

* Use useFileDialog and useObjectUrl in FillPicker

Replace manual file input ref, click(), createObjectURL/revokeObjectURL
with vueuse composables. Remove hidden <input type=file> from template.

---------

Co-authored-by: Danila Poyarkov <dev@dannote.net>
2026-03-11 07:52:04 +03:00
..
abspos-cache.test.ts Clean up tools/schema, add geometry.ts, isMixed helper, fix imports, add tests 2026-03-06 22:33:10 +03:00
acp-agent.test.ts Add ACP agent package with tests 2026-03-05 09:14:54 +03:00
clipboard.test.ts Merge pull request #78 from open-pencil/detach-orphaned-instances 2026-03-09 00:11:05 +03:00
color.test.ts Centralize all color utilities in color.ts 2026-03-07 10:02:11 +03:00
copy.test.ts Fix copyFill missing gradientTransform/imageTransform, add copy tests 2026-03-09 08:50:28 +03:00
effects-and-resize.test.ts Fix effects rendering: shadows, blur, spread (#24) 2026-03-03 09:53:39 +03:00
eval-cli.test.ts Fix hit-testing: scope hover to current page, click-through empty containers 2026-03-05 08:56:35 +03:00
export-jsx.test.ts CSS Grid layout mode (#73) 2026-03-08 18:23:53 +03:00
fig-import.test.ts Clean up tools/schema, add geometry.ts, isMixed helper, fix imports, add tests 2026-03-06 22:33:10 +03:00
fig-roundtrip.test.ts Emit derivedTextData and textUserLayoutVersion for text nodes 2026-03-08 23:28:54 +03:00
figma-api.test.ts Fill Figma Plugin API gaps: 29 new tests, 30+ new properties and methods 2026-03-01 13:35:02 +03:00
fonts.test.ts Clean up tools/schema, add geometry.ts, isMixed helper, fix imports, add tests 2026-03-06 22:33:10 +03:00
image.test.ts Image drag-and-drop, clipboard paste, and paste-at-cursor (#92) 2026-03-11 07:52:04 +03:00
individual-strokes.test.ts Clean up tools/schema, add geometry.ts, isMixed helper, fix imports, add tests 2026-03-06 22:33:10 +03:00
layout.test.ts Fix text layout without CanvasKit: estimate size instead of 100×100 default 2026-03-10 22:59:15 +03:00
mcp-server.test.ts Fix hit-testing: scope hover to current page, click-through empty containers 2026-03-05 08:56:35 +03:00
mcp.test.ts Fix hit-testing: scope hover to current page, click-through empty containers 2026-03-05 08:56:35 +03:00
multi-selection.test.ts Clean up tools/schema, add geometry.ts, isMixed helper, fix imports, add tests 2026-03-06 22:33:10 +03:00
mutation.test.ts Add mutation unit tests: toggleBoldInRange, vectorNetworkBlob precision, SceneGraph+UndoManager integration 2026-03-07 23:11:03 +03:00
perf.bench.ts Fix copyFill missing gradientTransform/imageTransform, add copy tests 2026-03-09 08:50:28 +03:00
profiler.test.ts Clean up tools/schema, add geometry.ts, isMixed helper, fix imports, add tests 2026-03-06 22:33:10 +03:00
render-text.test.ts Fix CJK text garbled when font unavailable (#89) 2026-03-10 16:58:57 +03:00
render.test.ts Fix auto-layout overflow, grid layout, AI chat UX (#86) 2026-03-10 15:43:04 +03:00
renderer-effects.test.ts Clean up tools/schema, add geometry.ts, isMixed helper, fix imports, add tests 2026-03-06 22:33:10 +03:00
scene-graph.test.ts Clean up tools/schema, add geometry.ts, isMixed helper, fix imports, add tests 2026-03-06 22:33:10 +03:00
snap.test.ts Clean up tools/schema, add geometry.ts, isMixed helper, fix imports, add tests 2026-03-06 22:33:10 +03:00
style-runs.test.ts Clean up tools/schema, add geometry.ts, isMixed helper, fix imports, add tests 2026-03-06 22:33:10 +03:00
svg-export.test.ts SVG export (#52) 2026-03-05 10:31:02 +03:00
tailwind-jsx.test.ts CSS Grid layout mode (#73) 2026-03-08 18:23:53 +03:00
text-editor.test.ts Clean up tools/schema, add geometry.ts, isMixed helper, fix imports, add tests 2026-03-06 22:33:10 +03:00
tools-ai-adapter.test.ts Unify tool definitions: define once, adapt for AI/CLI/MCP 2026-03-01 15:02:05 +03:00
tools-cli.test.ts Fix hit-testing: scope hover to current page, click-through empty containers 2026-03-05 08:56:35 +03:00
tools.test.ts XPath query for node selection (#82) 2026-03-09 15:32:27 +03:00
undo.test.ts Clean up tools/schema, add geometry.ts, isMixed helper, fix imports, add tests 2026-03-06 22:33:10 +03:00
vector.test.ts Clean up tools/schema, add geometry.ts, isMixed helper, fix imports, add tests 2026-03-06 22:33:10 +03:00
xpath.test.ts XPath query for node selection (#82) 2026-03-09 15:32:27 +03:00