- Keep the development MCP bridge alive until Vite shuts down - Ignore empty host-font responses and cover current browser font policy - Update interaction selectors, menu labels, resize accounting, and reviewed UI snapshots
93 lines
3 KiB
TypeScript
93 lines
3 KiB
TypeScript
import { expect, test } from '@playwright/test'
|
|
|
|
import { CanvasHelper } from '#tests/helpers/canvas'
|
|
|
|
test('resizing uses repaint-only previews until mouseup', async ({ page }) => {
|
|
await page.goto('/')
|
|
const canvas = new CanvasHelper(page)
|
|
await canvas.waitForInit()
|
|
canvas.errors.length = 0
|
|
await canvas.clearCanvas()
|
|
|
|
const id = await page.evaluate(() => {
|
|
const store = window.openPencil?.getStore?.()
|
|
if (!store) throw new Error('OpenPencil store not initialized')
|
|
store.state.zoom = 1
|
|
store.state.panX = 0
|
|
store.state.panY = 0
|
|
const node = store.graph.createNode('FRAME', store.state.currentPageId, {
|
|
name: 'Resizable Card',
|
|
x: 100,
|
|
y: 100,
|
|
width: 240,
|
|
height: 140,
|
|
fills: [{ type: 'SOLID', color: { r: 1, g: 1, b: 1, a: 1 }, opacity: 1, visible: true }]
|
|
})
|
|
for (let i = 0; i < 12; i++) {
|
|
store.graph.createNode('TEXT', node.id, {
|
|
name: `Label ${i}`,
|
|
text: `Label ${i}`,
|
|
x: 16,
|
|
y: 16 + i * 18,
|
|
width: 160,
|
|
height: 16
|
|
})
|
|
}
|
|
store.select([node.id])
|
|
store.requestRender()
|
|
return node.id
|
|
})
|
|
await canvas.waitForRender()
|
|
|
|
await page.evaluate((selectedId) => {
|
|
const store = window.openPencil?.getStore?.()
|
|
if (!store) throw new Error('OpenPencil store not initialized')
|
|
const originalStoreUpdate = store.updateNode.bind(store)
|
|
const originalGraphUpdate = store.graph.updateNode.bind(store.graph)
|
|
let storeUpdateCount = 0
|
|
let graphUpdateCount = 0
|
|
let repaintCount = 0
|
|
store.updateNode = ((nodeId, changes) => {
|
|
if (nodeId === selectedId) storeUpdateCount++
|
|
return originalStoreUpdate(nodeId, changes)
|
|
}) as typeof store.updateNode
|
|
store.graph.updateNode = ((nodeId, changes) => {
|
|
if (nodeId === selectedId) graphUpdateCount++
|
|
return originalGraphUpdate(nodeId, changes)
|
|
}) as typeof store.graph.updateNode
|
|
store.onEditorEvent('repaint:requested', () => {
|
|
repaintCount++
|
|
})
|
|
Object.assign(window, {
|
|
__openPencilResizeCounters: () => ({ storeUpdateCount, graphUpdateCount, repaintCount })
|
|
})
|
|
}, id)
|
|
|
|
await canvas.drag(340, 240, 420, 290, 12)
|
|
|
|
const counters = await page.evaluate(() => {
|
|
const getCounters = (
|
|
window as typeof window & {
|
|
__openPencilResizeCounters?: () => {
|
|
storeUpdateCount: number
|
|
graphUpdateCount: number
|
|
repaintCount: number
|
|
}
|
|
}
|
|
).__openPencilResizeCounters
|
|
return getCounters?.() ?? null
|
|
})
|
|
const node = await page.evaluate((nodeId) => {
|
|
const store = window.openPencil?.getStore?.()
|
|
if (!store) throw new Error('OpenPencil store not initialized')
|
|
return store.graph.getNode(nodeId)
|
|
}, id)
|
|
|
|
expect(counters?.storeUpdateCount).toBeLessThanOrEqual(1)
|
|
expect(counters?.graphUpdateCount).toBeLessThanOrEqual(1)
|
|
expect(counters?.repaintCount).toBeGreaterThan(0)
|
|
expect(node?.width).toBeGreaterThan(240)
|
|
expect(node?.height).toBeGreaterThan(140)
|
|
canvas.assertNoErrors()
|
|
})
|