diff --git a/src/__tests__/Card.test.tsx b/src/__tests__/Card.test.tsx index 43dad8c..7d8c2cf 100644 --- a/src/__tests__/Card.test.tsx +++ b/src/__tests__/Card.test.tsx @@ -70,6 +70,19 @@ describe('Card', () => { }) }) + describe('drag threshold', () => { + it('does not fire onDragStart immediately when pointer-down on card outer area', () => { + const { container, props } = renderCard() + const card = container.firstElementChild as HTMLElement + + // Simulate pointerdown on the outer card div (padding area) + card.dispatchEvent(new PointerEvent('pointerdown', { button: 0, clientX: 50, clientY: 50, bubbles: true })) + + // onDragStart should NOT be called immediately — it should wait for threshold movement + expect(props.onDragStart).not.toHaveBeenCalled() + }) + }) + describe('dragging styles', () => { it('applies dragging styles when isDragging is true', () => { const { container } = renderCard({ isDragging: true }) diff --git a/src/components/Card.tsx b/src/components/Card.tsx index 461e5ec..7c5bc35 100644 --- a/src/components/Card.tsx +++ b/src/components/Card.tsx @@ -222,7 +222,7 @@ export default function Card({ onPointerDown={(e) => { if (e.button !== 0 || editing) return e.preventDefault() - fireDragStart(e.clientX, e.clientY) + startPendingDrag(e.clientX, e.clientY) }}> {editing ? (