Files
landing-builder/components/wysiwyg/Canvas.moveable.test.tsx
T

57 lines
1.6 KiB
TypeScript

import React from 'react'
import { describe, it, expect, vi, beforeEach } from 'vitest'
import { render, screen } from '@testing-library/react'
import { Canvas } from '@/components/wysiwyg/Canvas'
import type { Frame } from '@/lib/wysiwyg/schema'
vi.mock('react-moveable', () => {
const Mock = (props: Record<string, unknown>) => <div data-testid="moveable" data-props={JSON.stringify({
draggable: props.draggable,
resizable: props.resizable,
rotatable: props.rotatable,
snappable: props.snappable,
snapGridWidth: props.snapGridWidth,
snapGridHeight: props.snapGridHeight,
})} />
return { default: Mock }
})
const frame: Frame = {
id: 'frame1',
width: 800,
height: 600,
background: '#ffffff',
layers: [
{
id: 'layer1',
name: 'Layer 1',
visible: true,
locked: false,
objects: [
{ id: 'obj1', type: 'text', x: 10, y: 12, width: 100, height: 40, rotate: 0, zIndex: 0, props: { text: 'Hello', fontSize: 16, color: '#000000' } },
],
},
],
}
describe('Canvas + Moveable integration (smoke)', () => {
beforeEach(() => {
vi.clearAllMocks()
})
it('renders Moveable with draggable/resizable/rotatable and 8px grid', () => {
render(<Canvas frame={frame} />)
const mv = screen.getByTestId('moveable')
expect(mv).toBeInTheDocument()
const props = JSON.parse(mv.getAttribute('data-props') || '{}')
expect(props.draggable).toBe(true)
expect(props.resizable).toBe(true)
expect(props.rotatable).toBe(true)
expect(props.snappable).toBe(true)
expect(props.snapGridWidth).toBe(8)
expect(props.snapGridHeight).toBe(8)
})
})