openpencil/tests/engine/figma/api/create/component-from-node.test.ts
xemc 814352ec90 fix(figma-api): preserve variable bindings when converting a node to a component
createComponentFromNode copied a hand-picked list of fields onto the new
COMPONENT node but omitted boundVariables/variableModes, silently dropping
any variable bindings on the frame itself (padding, radius, stroke, etc).
Child nodes were unaffected since they're copied via cloneTree, which
already carries bindings through cloneNodeProps.
2026-08-26 10:17:13 +10:00

43 lines
1.3 KiB
TypeScript

import { describe, expect, test } from 'bun:test'
import { createAPI } from '../helpers'
describe('createComponentFromNode', () => {
test('converts frame to component', () => {
const api = createAPI()
const frame = api.createFrame()
frame.name = 'MyButton'
frame.resize(200, 50)
const child = api.createRectangle()
child.name = 'Background'
frame.appendChild(child)
const frameId = frame.id
const comp = api.createComponentFromNode(frame)
expect(comp.type).toBe('COMPONENT')
expect(comp.name).toBe('MyButton')
expect(comp.width).toBe(200)
expect(comp.height).toBe(50)
expect(comp.children.length).toBe(1)
expect(comp.children[0].name).toBe('Background')
expect(api.getNodeById(frameId)).toBeNull()
})
test('preserves the frame own variable bindings', () => {
const api = createAPI()
const collection = api.createVariableCollection('Radii')
const variable = api.createVariable('radius/md', 'FLOAT', collection.id, 8)
const frame = api.createFrame()
frame.name = 'Card'
frame.resize(200, 50)
frame.cornerRadius = 8
api.bindVariable(frame.id, 'cornerRadius', variable.id)
const comp = api.createComponentFromNode(frame)
const raw = api.graph.getNode(comp.id)
expect(raw?.boundVariables.cornerRadius).toBe(variable.id)
})
})