import { describe, it, expect, beforeEach } from 'vitest';
import { tiltHover } from './tilt-hover.js';
import { mountHost, connectTrait, resetDOM } from '../test-helpers.js';

describe('tilt-hover', () => {
  beforeEach(resetDOM);

  it('pointermove sets data-tilt-hover-active and applies transform', () => {
    const host = mountHost();
    connectTrait(tiltHover, host);
    host.dispatchEvent(new PointerEvent('pointermove', { clientX: 100, clientY: 100, bubbles: true }));
    expect(host.hasAttribute('data-tilt-hover-active')).toBe(true);
    expect(host.style.transform).toContain('perspective');
  });

  it('pointerleave clears active', () => {
    const host = mountHost();
    connectTrait(tiltHover, host);
    host.dispatchEvent(new PointerEvent('pointermove', { clientX: 50, clientY: 50, bubbles: true }));
    host.dispatchEvent(new PointerEvent('pointerleave', { bubbles: true }));
    expect(host.hasAttribute('data-tilt-hover-active')).toBe(false);
  });

  it('disconnect mid-tilt clears active + transform', () => {
    const host = mountHost();
    const inst = connectTrait(tiltHover, host);
    host.dispatchEvent(new PointerEvent('pointermove', { clientX: 50, clientY: 50, bubbles: true }));
    inst.disconnect(host);
    expect(host.hasAttribute('data-tilt-hover-active')).toBe(false);
    expect(host.style.transform).toBe('');
  });
});
