openpencil/tests/engine/layout/auto-layout/alignment/primary-axis.test.ts
Danila Poyarkov 75dd86d0ad fix(fig): improve imported component layout parity
- Preserve Figma min/max constraints, scalar variable bindings, and direct text bounds
- Reflow only authoritative generated instance geometry and pinned descendants
- Avoid double-applying auto spacing and unsafe lone-child normalization
2026-08-03 18:00:15 +03:00

111 lines
2.9 KiB
TypeScript

import { describe, expect, test } from 'bun:test'
import { computeLayout, SceneGraph } from '@open-pencil/core'
import { autoFrame, pageId, rect } from '#tests/helpers/layout'
describe('alignment - primary axis', () => {
test('center alignment (horizontal)', () => {
const graph = new SceneGraph()
const frame = autoFrame(graph, pageId(graph), {
width: 400,
height: 100,
primaryAxisAlign: 'CENTER'
})
rect(graph, frame.id, 100, 50)
computeLayout(graph, frame.id)
const child = graph.getChildren(frame.id)[0]
expect(child.x).toBe(150)
})
test('max alignment (horizontal)', () => {
const graph = new SceneGraph()
const frame = autoFrame(graph, pageId(graph), {
width: 400,
height: 100,
primaryAxisAlign: 'MAX'
})
rect(graph, frame.id, 100, 50)
computeLayout(graph, frame.id)
const child = graph.getChildren(frame.id)[0]
expect(child.x).toBe(300)
})
test('space-between alignment (horizontal)', () => {
const graph = new SceneGraph()
const frame = autoFrame(graph, pageId(graph), {
width: 400,
height: 100,
itemSpacing: 32,
primaryAxisAlign: 'SPACE_BETWEEN'
})
rect(graph, frame.id, 50, 50)
rect(graph, frame.id, 50, 50)
rect(graph, frame.id, 50, 50)
computeLayout(graph, frame.id)
const children = graph.getChildren(frame.id)
expect(children[0].x).toBe(0)
expect(children[2].x).toBe(350)
expect(children[1].x).toBeCloseTo(175, 0)
})
test('space-between alignment ignores stored primary spacing vertically', () => {
const graph = new SceneGraph()
const frame = autoFrame(graph, pageId(graph), {
layoutMode: 'VERTICAL',
width: 100,
height: 400,
itemSpacing: 32,
primaryAxisAlign: 'SPACE_BETWEEN'
})
rect(graph, frame.id, 50, 50)
rect(graph, frame.id, 50, 50)
rect(graph, frame.id, 50, 50)
computeLayout(graph, frame.id)
const children = graph.getChildren(frame.id)
expect(children[0].y).toBe(0)
expect(children[1].y).toBeCloseTo(175, 0)
expect(children[2].y).toBe(350)
})
test('center alignment (vertical)', () => {
const graph = new SceneGraph()
const frame = autoFrame(graph, pageId(graph), {
layoutMode: 'VERTICAL',
width: 200,
height: 400,
primaryAxisAlign: 'CENTER'
})
rect(graph, frame.id, 50, 100)
computeLayout(graph, frame.id)
const child = graph.getChildren(frame.id)[0]
expect(child.y).toBe(150)
})
test('max alignment (vertical)', () => {
const graph = new SceneGraph()
const frame = autoFrame(graph, pageId(graph), {
layoutMode: 'VERTICAL',
width: 200,
height: 400,
primaryAxisAlign: 'MAX'
})
rect(graph, frame.id, 50, 100)
computeLayout(graph, frame.id)
const child = graph.getChildren(frame.id)[0]
expect(child.y).toBe(300)
})
})