@adia-ai/web-components 0.8.19 → 0.8.21

package/traits/noise-texture/noise-texture.test.js

@@ -1,20 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import { noiseTexture } from './noise-texture.js';
-import { mountHost, connectTrait, resetDOM } from '../test-helpers.js';
-
-describe('noise-texture', () => {
-  beforeEach(resetDOM);
-
-  it('connect sets data-noise-texture-active and appends an overlay', () => {
-    const host = mountHost();
-    connectTrait(noiseTexture, host);
-    expect(host.hasAttribute('data-noise-texture-active')).toBe(true);
-  });
-
-  it('disconnect clears active + removes overlay', () => {
-    const host = mountHost();
-    const inst = connectTrait(noiseTexture, host);
-    inst.disconnect(host);
-    expect(host.hasAttribute('data-noise-texture-active')).toBe(false);
-  });
-});

package/traits/parallax/parallax.test.js

@@ -1,26 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import { parallax } from './parallax.js';
-import { mountHost, connectTrait, resetDOM } from '../test-helpers.js';
-
-describe('parallax', () => {
-  beforeEach(resetDOM);
-
-  it('connect sets data-parallax-active', () => {
-    const host = mountHost();
-    connectTrait(parallax, host);
-    expect(host.hasAttribute('data-parallax-active')).toBe(true);
-  });
-
-  it('disconnect clears active + translate', () => {
-    const host = mountHost();
-    const inst = connectTrait(parallax, host);
-    inst.disconnect(host);
-    expect(host.hasAttribute('data-parallax-active')).toBe(false);
-    expect(host.style.translate).toBe('');
-  });
-
-  it('respects data-parallax-strength (default 0.5)', () => {
-    const host = mountHost('div', { 'data-parallax-strength': '0.2' });
-    expect(() => connectTrait(parallax, host)).not.toThrow();
-  });
-});

package/traits/portal/portal.test.js

@@ -1,30 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import { portal } from './portal.js';
-import { mountHost, connectTrait, resetDOM } from '../test-helpers.js';
-
-describe('portal', () => {
-  beforeEach(resetDOM);
-
-  it('connect sets data-portal-active', () => {
-    const host = mountHost();
-    connectTrait(portal, host);
-    expect(host.hasAttribute('data-portal-active')).toBe(true);
-  });
-
-  it('disconnect clears the active attribute', () => {
-    const host = mountHost();
-    const inst = connectTrait(portal, host);
-    inst.disconnect(host);
-    expect(host.hasAttribute('data-portal-active')).toBe(false);
-  });
-
-  it('with data-portal-target, host is moved to the target element', () => {
-    const target = document.createElement('div');
-    target.id = 'portal-out';
-    document.body.appendChild(target);
-    const host = mountHost('div', { 'data-portal-target': '#portal-out' });
-    connectTrait(portal, host);
-    // The trait moves the host into the target on connect.
-    expect(target.contains(host)).toBe(true);
-  });
-});

package/traits/pressable/pressable.test.js

@@ -1,73 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import { pressable } from './pressable.js';
-import { mountHost, connectTrait, spyEvent, resetDOM } from '../test-helpers.js';
-
-describe('pressable', () => {
-  beforeEach(resetDOM);
-
-  it('sets data-pressable-pressed on pointerdown, removes on pointerup', () => {
-    const host = mountHost();
-    connectTrait(pressable, host);
-    host.dispatchEvent(new PointerEvent('pointerdown'));
-    expect(host.hasAttribute('data-pressable-pressed')).toBe(true);
-    host.dispatchEvent(new PointerEvent('pointerup'));
-    expect(host.hasAttribute('data-pressable-pressed')).toBe(false);
-  });
-
-  it('dispatches "press" event on pointerup', () => {
-    const host = mountHost();
-    connectTrait(pressable, host);
-    const spy = spyEvent(host, 'press');
-    host.dispatchEvent(new PointerEvent('pointerdown'));
-    host.dispatchEvent(new PointerEvent('pointerup'));
-    expect(spy.count).toBe(1);
-  });
-
-  it('dispatches "press" on Enter/Space keyup', () => {
-    const host = mountHost();
-    connectTrait(pressable, host);
-    const spy = spyEvent(host, 'press');
-    host.dispatchEvent(new KeyboardEvent('keydown', { key: 'Enter' }));
-    host.dispatchEvent(new KeyboardEvent('keyup', { key: 'Enter' }));
-    expect(spy.count).toBe(1);
-    host.dispatchEvent(new KeyboardEvent('keydown', { key: ' ' }));
-    host.dispatchEvent(new KeyboardEvent('keyup', { key: ' ' }));
-    expect(spy.count).toBe(2);
-  });
-
-  it('respects [disabled] — no event, no attribute toggle', () => {
-    const host = mountHost('button', { disabled: '' });
-    connectTrait(pressable, host);
-    const spy = spyEvent(host, 'press');
-    host.dispatchEvent(new PointerEvent('pointerdown'));
-    expect(host.hasAttribute('data-pressable-pressed')).toBe(false);
-    host.dispatchEvent(new PointerEvent('pointerup'));
-    expect(spy.count).toBe(0);
-  });
-
-  it('clears pressed state on pointerleave (canceled press)', () => {
-    const host = mountHost();
-    connectTrait(pressable, host);
-    const spy = spyEvent(host, 'press');
-    host.dispatchEvent(new PointerEvent('pointerdown'));
-    expect(host.hasAttribute('data-pressable-pressed')).toBe(true);
-    host.dispatchEvent(new PointerEvent('pointerleave'));
-    expect(host.hasAttribute('data-pressable-pressed')).toBe(false);
-    host.dispatchEvent(new PointerEvent('pointerup'));
-    expect(spy.count).toBe(0);
-  });
-
-  it('disconnect removes all listeners and clears attribute', () => {
-    const host = mountHost();
-    const inst = connectTrait(pressable, host);
-    host.dispatchEvent(new PointerEvent('pointerdown'));
-    expect(host.hasAttribute('data-pressable-pressed')).toBe(true);
-    inst.disconnect(host);
-    expect(host.hasAttribute('data-pressable-pressed')).toBe(false);
-    // Re-firing events post-disconnect is a no-op
-    const spy = spyEvent(host, 'press');
-    host.dispatchEvent(new PointerEvent('pointerdown'));
-    host.dispatchEvent(new PointerEvent('pointerup'));
-    expect(spy.count).toBe(0);
-  });
-});

package/traits/resettable/resettable.test.js

@@ -1,100 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import { resettable } from './resettable.js';
-import { mountHost, connectTrait, spyEvent, resetDOM } from '../test-helpers.js';
-
-function mountInForm(initialValue = 'initial') {
-  const form = document.createElement('form');
-  document.body.appendChild(form);
-  const host = document.createElement('input');
-  host.value = initialValue;
-  form.appendChild(host);
-  return { form, host };
-}
-
-describe('resettable', () => {
-  beforeEach(resetDOM);
-
-  it('captures initial value on connect; restores it on form reset', () => {
-    const { form, host } = mountInForm('original');
-    connectTrait(resettable, host);
-    host.value = 'modified';
-    form.dispatchEvent(new Event('reset', { bubbles: true }));
-    expect(host.value).toBe('original');
-  });
-
-  it('dispatches reset-applied with the initial value in detail', () => {
-    const { form, host } = mountInForm('hello');
-    connectTrait(resettable, host);
-    const spy = spyEvent(host, 'reset-applied');
-    host.value = 'changed';
-    form.dispatchEvent(new Event('reset', { bubbles: true }));
-    expect(spy.count).toBe(1);
-    expect(spy.last.initialValue).toBe('hello');
-  });
-
-  it('outside a form: no-op (no throw, no listener)', () => {
-    const host = mountHost('input', { value: 'x' });
-    expect(() => connectTrait(resettable, host)).not.toThrow();
-    expect(host.hasAttribute('data-resettable-active')).toBe(true);
-  });
-
-  it('disconnect removes the form listener', () => {
-    const { form, host } = mountInForm('a');
-    const inst = resettable();
-    inst.connect(host);
-    inst.disconnect(host);
-    host.value = 'b';
-    form.dispatchEvent(new Event('reset', { bubbles: true }));
-    // After disconnect, the trait should NOT have reset the value.
-    expect(host.value).toBe('b');
-    expect(host.hasAttribute('data-resettable-active')).toBe(false);
-  });
-
-  it('multiple controls in the same form each reset independently', () => {
-    const form = document.createElement('form');
-    document.body.appendChild(form);
-    const a = document.createElement('input'); a.value = 'A';
-    const b = document.createElement('input'); b.value = 'B';
-    form.appendChild(a); form.appendChild(b);
-    resettable().connect(a);
-    resettable().connect(b);
-    a.value = 'changed-a';
-    b.value = 'changed-b';
-    form.dispatchEvent(new Event('reset', { bubbles: true }));
-    expect(a.value).toBe('A');
-    expect(b.value).toBe('B');
-  });
-
-  it('boolean controls (host.checked) restore their initial checked state', () => {
-    // Synthesize a switch-like host: the only state is a boolean `checked`
-    // reactive property — no `value`. Mirrors switch-ui's API.
-    const form = document.createElement('form');
-    document.body.appendChild(form);
-    const host = document.createElement('div');
-    host.checked = true;
-    form.appendChild(host);
-
-    connectTrait(resettable, host);
-    const spy = spyEvent(host, 'reset-applied');
-
-    host.checked = false; // user toggles it off
-    form.dispatchEvent(new Event('reset', { bubbles: true }));
-
-    expect(host.checked).toBe(true);
-    expect(spy.count).toBe(1);
-    expect(spy.last.initialValue).toBe(true);
-  });
-
-  it('boolean controls starting unchecked stay unchecked after reset', () => {
-    const form = document.createElement('form');
-    document.body.appendChild(form);
-    const host = document.createElement('div');
-    host.checked = false;
-    form.appendChild(host);
-
-    connectTrait(resettable, host);
-    host.checked = true;
-    form.dispatchEvent(new Event('reset', { bubbles: true }));
-    expect(host.checked).toBe(false);
-  });
-});

package/traits/resizable/resizable.test.js

@@ -1,39 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import { resizable } from './resizable.js';
-import { mountHost, connectTrait, resetDOM } from '../test-helpers.js';
-
-describe('resizable', () => {
-  beforeEach(resetDOM);
-
-  it('connect attaches without throwing', () => {
-    const host = mountHost();
-    expect(() => connectTrait(resizable, host)).not.toThrow();
-  });
-
-  it('disconnect clears resizing state attributes', () => {
-    const host = mountHost();
-    const inst = connectTrait(resizable, host);
-    expect(() => inst.disconnect(host)).not.toThrow();
-    expect(host.hasAttribute('data-resizable-resizing')).toBe(false);
-    expect(host.hasAttribute('data-resizable-edge')).toBe(false);
-  });
-
-  it('creates 8 hit-zones — 4 edges + 4 corners (resize in x, y, and x/y)', () => {
-    const host = mountHost();
-    connectTrait(resizable, host);
-    const names = [...host.querySelectorAll('[data-resizable-handle]')]
-      .map((el) => el.dataset.resizableHandle);
-    expect(names).toHaveLength(8);
-    expect(names).toEqual(expect.arrayContaining([
-      'top', 'right', 'bottom', 'left',
-      'top-left', 'top-right', 'bottom-right', 'bottom-left',
-    ]));
-  });
-
-  it('disconnect removes all hit-zones', () => {
-    const host = mountHost();
-    const inst = connectTrait(resizable, host);
-    inst.disconnect(host);
-    expect(host.querySelectorAll('[data-resizable-handle]')).toHaveLength(0);
-  });
-});

package/traits/resize-observer/resize-observer.test.js

@@ -1,38 +0,0 @@
-import { describe, it, expect, beforeEach, vi, afterEach } from 'vitest';
-import { resizeObserver } from './resize-observer.js';
-import { mountHost, connectTrait, resetDOM } from '../test-helpers.js';
-
-describe('resize-observer', () => {
-  let originalRO;
-
-  beforeEach(() => {
-    resetDOM();
-    originalRO = globalThis.ResizeObserver;
-  });
-
-  afterEach(() => {
-    if (originalRO) globalThis.ResizeObserver = originalRO;
-    else delete globalThis.ResizeObserver;
-  });
-
-  it('without ResizeObserver: gracefully no-ops on connect', () => {
-    delete globalThis.ResizeObserver;
-    const host = mountHost();
-    expect(() => connectTrait(resizeObserver, host)).not.toThrow();
-  });
-
-  it('with mocked ResizeObserver: observe() called + disconnect cleans up', () => {
-    const observe = vi.fn();
-    const roDisconnect = vi.fn();
-    globalThis.ResizeObserver = function MockRO() {
-      this.observe = observe;
-      this.disconnect = roDisconnect;
-      this.unobserve = vi.fn();
-    };
-    const host = mountHost();
-    const inst = connectTrait(resizeObserver, host);
-    expect(observe).toHaveBeenCalledWith(host);
-    inst.disconnect(host);
-    expect(roDisconnect).toHaveBeenCalled();
-  });
-});

package/traits/ripple/ripple.test.js

@@ -1,32 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import { ripple } from './ripple.js';
-import { mountHost, connectTrait, resetDOM } from '../test-helpers.js';
-
-describe('ripple', () => {
-  beforeEach(resetDOM);
-
-  it('connect sets data-ripple-active', () => {
-    const host = mountHost();
-    connectTrait(ripple, host);
-    expect(host.hasAttribute('data-ripple-active')).toBe(true);
-  });
-
-  it('disconnect clears active + restores overflow', () => {
-    const host = mountHost();
-    const inst = connectTrait(ripple, host);
-    inst.disconnect(host);
-    expect(host.hasAttribute('data-ripple-active')).toBe(false);
-    expect(host.style.overflow).toBe('');
-  });
-
-  it('click appends a ripple span (in non-reduced-motion environment)', () => {
-    const host = mountHost();
-    connectTrait(ripple, host);
-    const beforeChildren = host.children.length;
-    host.dispatchEvent(new MouseEvent('click', { clientX: 10, clientY: 10, bubbles: true }));
-    // In happy-dom + reduced-motion preference unknown, the ripple may or may
-    // not append a span. The contract is "connect doesn't throw, no DOM leak
-    // on disconnect".
-    expect(host.children.length).toBeGreaterThanOrEqual(beforeChildren);
-  });
-});

package/traits/roving-tabindex/roving-tabindex.test.js

@@ -1,28 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import { rovingTabindex } from './roving-tabindex.js';
-import { mountHost, connectTrait, resetDOM } from '../test-helpers.js';
-
-function tabbableChild(host) {
-  const btn = document.createElement('button');
-  host.appendChild(btn);
-  return btn;
-}
-
-describe('roving-tabindex', () => {
-  beforeEach(resetDOM);
-
-  it('connect attaches without throwing', () => {
-    const host = mountHost();
-    tabbableChild(host);
-    tabbableChild(host);
-    tabbableChild(host);
-    expect(() => connectTrait(rovingTabindex, host)).not.toThrow();
-  });
-
-  it('disconnect cleans up', () => {
-    const host = mountHost();
-    tabbableChild(host);
-    const inst = connectTrait(rovingTabindex, host);
-    expect(() => inst.disconnect(host)).not.toThrow();
-  });
-});

package/traits/scale-press/scale-press.test.js

@@ -1,39 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import { scalePress } from './scale-press.js';
-import { mountHost, connectTrait, resetDOM } from '../test-helpers.js';
-
-describe('scale-press', () => {
-  beforeEach(resetDOM);
-
-  it('pointerdown applies scale(0.95) + active attribute', () => {
-    const host = mountHost();
-    connectTrait(scalePress, host);
-    host.dispatchEvent(new PointerEvent('pointerdown'));
-    expect(host.hasAttribute('data-scale-press-active')).toBe(true);
-    expect(host.style.transform).toContain('0.95');
-  });
-
-  it('pointerup releases scale and clears attribute', () => {
-    const host = mountHost();
-    connectTrait(scalePress, host);
-    host.dispatchEvent(new PointerEvent('pointerdown'));
-    host.dispatchEvent(new PointerEvent('pointerup'));
-    expect(host.hasAttribute('data-scale-press-active')).toBe(false);
-  });
-
-  it('pointerleave during press releases (canceled press)', () => {
-    const host = mountHost();
-    connectTrait(scalePress, host);
-    host.dispatchEvent(new PointerEvent('pointerdown'));
-    host.dispatchEvent(new PointerEvent('pointerleave'));
-    expect(host.hasAttribute('data-scale-press-active')).toBe(false);
-  });
-
-  it('respects [disabled] — no transform, no attribute', () => {
-    const host = mountHost('button', { disabled: '' });
-    connectTrait(scalePress, host);
-    host.dispatchEvent(new PointerEvent('pointerdown'));
-    expect(host.hasAttribute('data-scale-press-active')).toBe(false);
-    expect(host.style.transform).toBe('');
-  });
-});

package/traits/scroll-lock/scroll-lock.test.js

@@ -1,45 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import { scrollLock } from './scroll-lock.js';
-import { mountHost, connectTrait, resetDOM } from '../test-helpers.js';
-
-describe('scroll-lock', () => {
-  beforeEach(() => {
-    resetDOM();
-    document.body.style.overflow = '';
-  });
-
-  it('connect sets body overflow:hidden + active attribute', () => {
-    const host = mountHost();
-    const inst = connectTrait(scrollLock, host);
-    expect(document.body.style.overflow).toBe('hidden');
-    expect(host.hasAttribute('data-scroll-lock-active')).toBe(true);
-    // Balanced disconnect to keep the module-level lockCount honest for sibling tests.
-    inst.disconnect(host);
-  });
-
-  it('disconnect restores body overflow + clears attribute', () => {
-    document.body.style.overflow = 'auto';
-    const host = mountHost();
-    const inst = connectTrait(scrollLock, host);
-    inst.disconnect(host);
-    expect(document.body.style.overflow).toBe('auto');
-    expect(host.hasAttribute('data-scroll-lock-active')).toBe(false);
-  });
-
-  it('refcounted — disconnect order does not unlock until last consumer leaves', () => {
-    // The trait is module-scoped (lockCount + savedOverflow live in module state).
-    // Snapshot the current state so this assertion is independent of test order.
-    const startOverflow = document.body.style.overflow;
-    const a = mountHost();
-    const b = mountHost();
-    const instA = connectTrait(scrollLock, a);
-    const instB = connectTrait(scrollLock, b);
-    expect(document.body.style.overflow).toBe('hidden');
-    instA.disconnect(a);
-    // Still locked because b is still active
-    expect(document.body.style.overflow).toBe('hidden');
-    instB.disconnect(b);
-    // Restored to whatever it was when the *first* lock acquired it
-    expect(document.body.style.overflow).toBe(startOverflow);
-  });
-});

package/traits/scroll-progress/scroll-progress.test.js

@@ -1,182 +0,0 @@
-import { describe, it, expect, beforeEach, vi, afterEach } from 'vitest';
-import { scrollProgress } from './scroll-progress.js';
-import { mountHost, connectTrait, spyEvent, resetDOM } from '../test-helpers.js';
-
-describe('scroll-progress', () => {
-  let originalRAF;
-  let originalCAF;
-
-  beforeEach(() => {
-    resetDOM();
-    // Synchronous rAF — the trait's scheduler calls back immediately so
-    // we can assert post-update side-effects without awaiting frames.
-    originalRAF = globalThis.requestAnimationFrame;
-    originalCAF = globalThis.cancelAnimationFrame;
-    globalThis.requestAnimationFrame = (fn) => { fn(performance.now?.() ?? 0); return 1; };
-    globalThis.cancelAnimationFrame = vi.fn();
-  });
-
-  afterEach(() => {
-    globalThis.requestAnimationFrame = originalRAF;
-    globalThis.cancelAnimationFrame = originalCAF;
-  });
-
-  it('connect sets data-scroll-progress-active', () => {
-    const host = mountHost();
-    connectTrait(scrollProgress, host);
-    expect(host.hasAttribute('data-scroll-progress-active')).toBe(true);
-  });
-
-  it('disconnect clears active + progress + CSS variable', () => {
-    const host = mountHost();
-    const inst = connectTrait(scrollProgress, host);
-    inst.disconnect(host);
-    expect(host.hasAttribute('data-scroll-progress-active')).toBe(false);
-    expect(host.hasAttribute('data-scroll-progress')).toBe(false);
-    expect(host.style.getPropertyValue('--scroll-progress')).toBe('');
-  });
-
-  it('writes data-scroll-progress as a 0..1 string after connect', () => {
-    const host = mountHost();
-    connectTrait(scrollProgress, host);
-    // Synchronous rAF means the seed update has already run.
-    const v = host.getAttribute('data-scroll-progress');
-    expect(v).not.toBeNull();
-    const n = parseFloat(v);
-    expect(n).toBeGreaterThanOrEqual(0);
-    expect(n).toBeLessThanOrEqual(1);
-  });
-
-  it('writes the --scroll-progress CSS custom property', () => {
-    const host = mountHost();
-    connectTrait(scrollProgress, host);
-    const css = host.style.getPropertyValue('--scroll-progress');
-    expect(css).not.toBe('');
-    const n = parseFloat(css);
-    expect(n).toBeGreaterThanOrEqual(0);
-    expect(n).toBeLessThanOrEqual(1);
-  });
-
-  it('dispatches a scroll-progress event with { progress } detail', () => {
-    const host = mountHost();
-    const spy = spyEvent(host, 'scroll-progress');
-    connectTrait(scrollProgress, host);
-    // Initial seed fires once via synchronous rAF.
-    expect(spy.count).toBeGreaterThanOrEqual(1);
-    expect(typeof spy.last.progress).toBe('number');
-    expect(spy.last.progress).toBeGreaterThanOrEqual(0);
-    expect(spy.last.progress).toBeLessThanOrEqual(1);
-  });
-
-  it('mode="page" falls back to 0 when scroll range is zero', () => {
-    const host = mountHost('div', { 'data-scroll-progress-mode': 'page' });
-    connectTrait(scrollProgress, host);
-    // happy-dom reports zero scroll geometry by default.
-    expect(host.getAttribute('data-scroll-progress')).toBe('0.000');
-  });
-
-  it('mode="scrolled" reports 0..1 from host scrollTop / max', () => {
-    const host = mountHost('div', { 'data-scroll-progress-mode': 'scrolled' });
-    // Stub the geometry — happy-dom returns zeros for scroll metrics.
-    Object.defineProperty(host, 'scrollHeight', { configurable: true, value: 1000 });
-    Object.defineProperty(host, 'clientHeight', { configurable: true, value: 200 });
-    Object.defineProperty(host, 'scrollTop', { configurable: true, value: 200, writable: true });
-    connectTrait(scrollProgress, host);
-    const v = parseFloat(host.getAttribute('data-scroll-progress'));
-    // 200 / (1000 - 200) = 0.25
-    expect(v).toBeCloseTo(0.25, 2);
-  });
-
-  it('mode="in-view" clamps to [0,1] for offscreen rects', () => {
-    const host = mountHost();
-    // Far below the viewport.
-    host.getBoundingClientRect = () => ({ top: 99999, bottom: 100099, left: 0, right: 0, width: 0, height: 100, x: 0, y: 99999, toJSON() { return {}; } });
-    connectTrait(scrollProgress, host);
-    expect(parseFloat(host.getAttribute('data-scroll-progress'))).toBe(0);
-  });
-
-  it('mode="in-view" reports 1 for rects fully scrolled past', () => {
-    const host = mountHost();
-    // Far above the viewport.
-    host.getBoundingClientRect = () => ({ top: -2000, bottom: -1900, left: 0, right: 0, width: 0, height: 100, x: 0, y: -2000, toJSON() { return {}; } });
-    // Make sure window.innerHeight is sane.
-    Object.defineProperty(window, 'innerHeight', { configurable: true, value: 800 });
-    connectTrait(scrollProgress, host);
-    expect(parseFloat(host.getAttribute('data-scroll-progress'))).toBe(1);
-  });
-
-  it('data-scroll-container selector resolves an explicit ancestor', () => {
-    document.body.innerHTML = '<div id="custom-scroller" style="overflow:auto;"><div id="inner"></div></div>';
-    const host = document.getElementById('inner');
-    host.setAttribute('data-scroll-container', '#custom-scroller');
-    const scroller = document.getElementById('custom-scroller');
-    const addSpy = vi.spyOn(scroller, 'addEventListener');
-    connectTrait(scrollProgress, host);
-    // The trait should attach a scroll listener to the resolved container.
-    const calls = addSpy.mock.calls.filter(([type]) => type === 'scroll');
-    expect(calls.length).toBeGreaterThanOrEqual(1);
-  });
-
-  it('invalid data-scroll-container selector falls through to ancestor walk', () => {
-    document.body.innerHTML = '<div id="parent" style="overflow:auto;"><div id="child"></div></div>';
-    const host = document.getElementById('child');
-    host.setAttribute('data-scroll-container', '###not-a-valid-selector');
-    expect(() => connectTrait(scrollProgress, host)).not.toThrow();
-  });
-
-  it('schedules through rAF — second scroll within the same frame coalesces', () => {
-    let queued = 0;
-    let pending = null;
-    globalThis.requestAnimationFrame = (fn) => {
-      queued++;
-      pending = fn;
-      return queued;
-    };
-    globalThis.cancelAnimationFrame = vi.fn();
-    const host = mountHost();
-    const inst = connectTrait(scrollProgress, host);
-    const baseline = queued;
-    // Fire two scroll events back-to-back without flushing the rAF.
-    window.dispatchEvent(new Event('scroll'));
-    window.dispatchEvent(new Event('scroll'));
-    // Only one rAF should be queued in addition to the seed.
-    expect(queued - baseline).toBeLessThanOrEqual(1);
-    // Flush manually so disconnect has nothing pending.
-    if (pending) pending(0);
-    inst.disconnect(host);
-  });
-
-  it('disconnect cancels the pending rAF', () => {
-    let pendingId = null;
-    globalThis.requestAnimationFrame = () => { pendingId = 42; return 42; };
-    const cancelSpy = vi.fn();
-    globalThis.cancelAnimationFrame = cancelSpy;
-    const host = mountHost();
-    const inst = connectTrait(scrollProgress, host);
-    inst.disconnect(host);
-    // The trait queued one rAF on connect; disconnect should cancel it.
-    expect(cancelSpy).toHaveBeenCalled();
-  });
-
-  it('disconnect removes the scroll listener from the resolved container', () => {
-    document.body.innerHTML = '<div id="scr" style="overflow:auto;"><div id="h"></div></div>';
-    const host = document.getElementById('h');
-    host.setAttribute('data-scroll-container', '#scr');
-    const scroller = document.getElementById('scr');
-    const removeSpy = vi.spyOn(scroller, 'removeEventListener');
-    const inst = connectTrait(scrollProgress, host);
-    inst.disconnect(host);
-    const calls = removeSpy.mock.calls.filter(([type]) => type === 'scroll');
-    expect(calls.length).toBeGreaterThanOrEqual(1);
-  });
-
-  it('reconnect after disconnect does not throw and restores the active flag', () => {
-    const host = mountHost();
-    const inst1 = connectTrait(scrollProgress, host);
-    inst1.disconnect(host);
-    const inst2 = connectTrait(scrollProgress, host);
-    expect(host.hasAttribute('data-scroll-progress-active')).toBe(true);
-    inst2.disconnect(host);
-    expect(host.hasAttribute('data-scroll-progress-active')).toBe(false);
-  });
-});