openpencil/tests/e2e/editor/resize-performance.spec.ts

57 lines
1.8 KiB
TypeScript

import { expect, test } from '@playwright/test'
import { CanvasHelper } from '#tests/helpers/canvas'
import { measureInteraction } from '#tests/helpers/performance/interaction'
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()
const counters = await measureInteraction(page, () => canvas.drag(340, 240, 420, 290, 12), id)
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()
})