diff --git a/tests/frontend/components/lorasWidgetEvents.interactions.test.js b/tests/frontend/components/lorasWidgetEvents.interactions.test.js index 5c797f69..39969367 100644 --- a/tests/frontend/components/lorasWidgetEvents.interactions.test.js +++ b/tests/frontend/components/lorasWidgetEvents.interactions.test.js @@ -78,7 +78,7 @@ describe('LoRA widget drag interactions', () => { expect(widget.callback).toHaveBeenCalledWith(widget.value); }); - it('initiates drag gestures, updates strength, and clears cursor state on mouseup', async () => { + it('initiates drag gestures, updates strength, and clears cursor state on pointerup', async () => { const module = await import(EVENTS_MODULE); const renderSpy = vi.fn(); const previewSpy = { hide: vi.fn() }; @@ -99,18 +99,22 @@ describe('LoRA widget drag interactions', () => { onDragEnd, }); - dragEl.dispatchEvent(new MouseEvent('mousedown', { clientX: 50, bubbles: true })); + dragEl.dispatchEvent(new PointerEvent('pointerdown', { clientX: 50, bubbles: true, pointerId: 1 })); + expect(document.body.classList.contains('lm-lora-strength-dragging')).toBe(false); + expect(onDragStart).not.toHaveBeenCalled(); + + dragEl.dispatchEvent(new PointerEvent('pointermove', { clientX: 70, bubbles: true, pointerId: 1 })); expect(document.body.classList.contains('lm-lora-strength-dragging')).toBe(true); expect(onDragStart).toHaveBeenCalledTimes(1); - - document.dispatchEvent(new MouseEvent('mousemove', { clientX: 70, bubbles: true })); - expect(renderSpy).toHaveBeenCalledWith(widget.value, widget); expect(previewSpy.hide).toHaveBeenCalled(); expect(widget.value[0].strength).not.toBe(0.5); + expect(widget.callback).not.toHaveBeenCalled(); + expect(renderSpy).not.toHaveBeenCalled(); - document.dispatchEvent(new MouseEvent('mouseup')); + dragEl.dispatchEvent(new PointerEvent('pointerup', { pointerId: 1 })); expect(document.body.classList.contains('lm-lora-strength-dragging')).toBe(false); expect(onDragEnd).toHaveBeenCalledTimes(1); + expect(renderSpy).toHaveBeenCalledWith(widget.value, widget); }); it('deletes the selected LoRA when backspace is pressed outside of strength inputs', async () => { diff --git a/tests/frontend/setup.js b/tests/frontend/setup.js index b6862e67..39e017e1 100644 --- a/tests/frontend/setup.js +++ b/tests/frontend/setup.js @@ -1,6 +1,35 @@ import { afterEach, beforeEach } from 'vitest'; import { resetDom } from './utils/domFixtures.js'; +// Polyfill PointerEvent for jsdom environment +if (typeof window !== 'undefined' && !window.PointerEvent) { + class PointerEvent extends MouseEvent { + constructor(type, eventInit = {}) { + super(type, eventInit); + this.pointerId = eventInit.pointerId || 0; + this.pointerType = eventInit.pointerType || 'mouse'; + this.isPrimary = eventInit.isPrimary !== undefined ? eventInit.isPrimary : true; + } + } + window.PointerEvent = PointerEvent; +} + +// Polyfill setPointerCapture and releasePointerCapture for jsdom elements +if (typeof Element !== 'undefined') { + const capturedPointers = new Map(); + + Element.prototype.setPointerCapture = function(pointerId) { + capturedPointers.set(pointerId, this); + }; + + Element.prototype.releasePointerCapture = function(pointerId) { + capturedPointers.delete(pointerId); + }; + + // Store captured pointers for potential use in tests + window.__testCapturedPointers = capturedPointers; +} + beforeEach(() => { // Ensure storage is clean before each test to avoid cross-test pollution localStorage.clear();