@adia-ai/web-components 0.8.19 → 0.8.21

package/traits/shimmer-loading/shimmer-loading.test.js

@@ -1,43 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import { shimmerLoading } from './shimmer-loading.js';
-import { mountHost, connectTrait, resetDOM } from '../test-helpers.js';
-
-describe('shimmer-loading', () => {
-  beforeEach(resetDOM);
-
-  it('sets data-shimmer-loading-active and appends an overlay', () => {
-    const host = mountHost();
-    connectTrait(shimmerLoading, host);
-    expect(host.hasAttribute('data-shimmer-loading-active')).toBe(true);
-    // Either a static muted overlay (reduced-motion) or the shimmer overlay
-    // is appended as a child div.
-    const overlay = host.querySelector('div');
-    expect(overlay).toBeTruthy();
-  });
-
-  it('disconnect removes overlay + cleans active attribute', () => {
-    const host = mountHost();
-    const inst = shimmerLoading();
-    inst.connect(host);
-    expect(host.querySelector('div')).toBeTruthy();
-    inst.disconnect(host);
-    expect(host.hasAttribute('data-shimmer-loading-active')).toBe(false);
-    expect(host.querySelector('div')).toBeFalsy();
-  });
-
-  it('host gets position:relative if not already set (so the overlay anchors)', () => {
-    const host = mountHost();
-    connectTrait(shimmerLoading, host);
-    expect(host.style.position).toBe('relative');
-  });
-
-  it('parallel attach to two hosts: each gets its own overlay', () => {
-    const a = mountHost();
-    const b = mountHost();
-    shimmerLoading().connect(a);
-    shimmerLoading().connect(b);
-    expect(a.querySelector('div')).toBeTruthy();
-    expect(b.querySelector('div')).toBeTruthy();
-    expect(a.querySelector('div')).not.toBe(b.querySelector('div'));
-  });
-});

package/traits/smoke.test.js

@@ -1,111 +0,0 @@
-/**
- * Universal trait contract — runs against every trait imported from
- * traits/index.js. Asserts schema integrity, attribute cleanup on
- * disconnect, and idempotent connect/disconnect cycles.
- *
- * Per-trait behavior tests live in `<trait>.test.js` siblings.
- */
-
-import { describe, it, expect, beforeEach } from 'vitest';
-import * as traits from './index.js';
-import { mountHost, connectTrait, expectValidSchema, resetDOM } from './test-helpers.js';
-
-const KNOWN_CATEGORIES = new Set([
-  'input-interaction',
-  'keyboard-navigation',
-  'forms-data',
-  'layout-measurement',
-  'motion-positioning',
-  'animation-feedback',
-  'visual-dynamics',
-  'interaction-delight',
-  'audio-haptics-sensory',
-]);
-
-const ALL_TRAITS = Object.entries(traits).filter(([, fn]) => typeof fn === 'function' && fn.schema);
-
-describe('trait registry — universal contract', () => {
-  beforeEach(resetDOM);
-
-  it('exports at least 40 traits', () => {
-    expect(ALL_TRAITS.length).toBeGreaterThanOrEqual(40);
-  });
-
-  it('every trait declares a known category', () => {
-    for (const [exportName, trait] of ALL_TRAITS) {
-      expect(KNOWN_CATEGORIES.has(trait.schema.category), `${exportName} category=${trait.schema.category}`).toBe(true);
-    }
-  });
-
-  it('every trait has a non-empty description', () => {
-    for (const [exportName, trait] of ALL_TRAITS) {
-      expect(trait.schema.description, `${exportName} missing description`).toBeTruthy();
-      expect(trait.schema.description.length, `${exportName} description too short`).toBeGreaterThan(10);
-    }
-  });
-
-  it('every trait passes the schema-shape contract', () => {
-    for (const [, trait] of ALL_TRAITS) expectValidSchema(trait);
-  });
-
-  it('attribute, event, and config names use kebab-case', () => {
-    const KEBAB_OR_DATA = /^(?:data-)?[a-z][a-z0-9]*(?:-[a-z0-9]+)*$/;
-    for (const [exportName, trait] of ALL_TRAITS) {
-      for (const a of trait.schema.attributes) {
-        expect(KEBAB_OR_DATA.test(a), `${exportName} attribute "${a}" not kebab-case`).toBe(true);
-        expect(a.startsWith('data-'), `${exportName} attribute "${a}" must start with data-`).toBe(true);
-      }
-      for (const e of trait.schema.events) {
-        expect(KEBAB_OR_DATA.test(e), `${exportName} event "${e}" not kebab-case`).toBe(true);
-      }
-      for (const c of trait.schema.config) {
-        expect(c.startsWith('data-'), `${exportName} config "${c}" must start with data-`).toBe(true);
-      }
-    }
-  });
-
-  it('connect → disconnect leaves no managed attributes behind', () => {
-    for (const [exportName, trait] of ALL_TRAITS) {
-      const host = mountHost();
-      const inst = connectTrait(trait, host);
-      inst.disconnect(host);
-      for (const attr of trait.schema.attributes) {
-        expect(host.hasAttribute(attr), `${exportName} left "${attr}" after disconnect`).toBe(false);
-      }
-      host.remove();
-    }
-  });
-
-  it('connect → disconnect → connect again does not throw', () => {
-    for (const [exportName, trait] of ALL_TRAITS) {
-      const host = mountHost();
-      const inst1 = connectTrait(trait, host);
-      inst1.disconnect(host);
-      expect(() => {
-        const inst2 = connectTrait(trait, host);
-        inst2.disconnect(host);
-      }, `${exportName} reconnect threw`).not.toThrow();
-      host.remove();
-    }
-  });
-
-  it('two parallel instances on different hosts do not interfere', () => {
-    for (const [exportName, trait] of ALL_TRAITS) {
-      const a = mountHost();
-      const b = mountHost();
-      const instA = connectTrait(trait, a);
-      const instB = connectTrait(trait, b);
-      // Disconnect one — the other should still clean up correctly.
-      expect(() => instA.disconnect(a), `${exportName} disconnect-A threw`).not.toThrow();
-      expect(() => instB.disconnect(b), `${exportName} disconnect-B threw`).not.toThrow();
-      a.remove();
-      b.remove();
-    }
-  });
-
-  it('catalog count matches export count', async () => {
-    const mod = await import('./_catalog.json', { with: { type: 'json' } });
-    const catalog = mod.default || mod;
-    expect(catalog.count, `catalog says ${catalog.count}, exports has ${ALL_TRAITS.length}`).toBe(ALL_TRAITS.length);
-  });
-});

package/traits/snap-to-grid/snap-to-grid.test.js

@@ -1,40 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import { snapToGrid } from './snap-to-grid.js';
-import { mountHost, connectTrait, resetDOM } from '../test-helpers.js';
-
-describe('snap-to-grid', () => {
-  beforeEach(resetDOM);
-
-  it('drag-end with x,y rounds to nearest grid increment (default 16)', () => {
-    const host = mountHost();
-    connectTrait(snapToGrid, host);
-    host.dispatchEvent(new CustomEvent('drag-end', { detail: { x: 23, y: 41 } }));
-    expect(host.style.translate).toBe('16px 48px');
-    expect(host.hasAttribute('data-snap-to-grid-snapped')).toBe(true);
-  });
-
-  it('respects data-snap-grid override', () => {
-    const host = mountHost('div', { 'data-snap-grid': '50' });
-    connectTrait(snapToGrid, host);
-    host.dispatchEvent(new CustomEvent('drag-end', { detail: { x: 73, y: 124 } }));
-    expect(host.style.translate).toBe('50px 100px');
-  });
-
-  it('drag-end without detail is a no-op', () => {
-    const host = mountHost();
-    connectTrait(snapToGrid, host);
-    host.dispatchEvent(new CustomEvent('drag-end', { detail: {} }));
-    // happy-dom may return undefined or '' for unset style.translate; both
-    // mean "untouched" which is the contract here.
-    expect(host.style.translate || '').toBe('');
-    expect(host.hasAttribute('data-snap-to-grid-snapped')).toBe(false);
-  });
-
-  it('disconnect clears the snapped attribute', () => {
-    const host = mountHost();
-    const inst = connectTrait(snapToGrid, host);
-    host.dispatchEvent(new CustomEvent('drag-end', { detail: { x: 0, y: 0 } }));
-    inst.disconnect(host);
-    expect(host.hasAttribute('data-snap-to-grid-snapped')).toBe(false);
-  });
-});

package/traits/sound-feedback/sound-feedback.test.js

@@ -1,26 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import { soundFeedback } from './sound-feedback.js';
-import { mountHost, connectTrait, resetDOM } from '../test-helpers.js';
-
-describe('sound-feedback', () => {
-  beforeEach(resetDOM);
-
-  it('connect sets data-sound-feedback-active', () => {
-    const host = mountHost();
-    connectTrait(soundFeedback, host);
-    expect(host.hasAttribute('data-sound-feedback-active')).toBe(true);
-  });
-
-  it('disconnect clears active + stops listening', () => {
-    const host = mountHost();
-    const inst = connectTrait(soundFeedback, host);
-    inst.disconnect(host);
-    expect(host.hasAttribute('data-sound-feedback-active')).toBe(false);
-  });
-
-  it('without data-sound-type: press fires no audio (no throw)', () => {
-    const host = mountHost();
-    connectTrait(soundFeedback, host);
-    expect(() => host.dispatchEvent(new CustomEvent('press', { bubbles: true }))).not.toThrow();
-  });
-});

package/traits/spring-animate/spring-animate.test.js

@@ -1,28 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import { springAnimate } from './spring-animate.js';
-import { mountHost, connectTrait, resetDOM } from '../test-helpers.js';
-
-describe('spring-animate', () => {
-  beforeEach(resetDOM);
-
-  it('connect sets data-spring-animate-active', () => {
-    const host = mountHost();
-    connectTrait(springAnimate, host);
-    expect(host.hasAttribute('data-spring-animate-active')).toBe(true);
-  });
-
-  it('disconnect clears active', () => {
-    const host = mountHost();
-    const inst = connectTrait(springAnimate, host);
-    inst.disconnect(host);
-    expect(host.hasAttribute('data-spring-animate-active')).toBe(false);
-  });
-
-  it('respects data-spring-stiffness + data-spring-damping config', () => {
-    const host = mountHost('div', {
-      'data-spring-stiffness': '200',
-      'data-spring-damping': '0.6',
-    });
-    expect(() => connectTrait(springAnimate, host)).not.toThrow();
-  });
-});

package/traits/success-checkmark/success-checkmark.test.js

@@ -1,120 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import { successCheckmark } from './success-checkmark.js';
-import { mountHost, connectTrait, spyEvent, resetDOM, wait } from '../test-helpers.js';
-
-// Helper: query the SVG that the trait stamps. As of the overflow:hidden
-// fix, the SVG renders at body level (position: fixed) so it can't be
-// clipped by the host's ancestors — query document.body, not the host.
-const findSvg = () => document.body.querySelector('svg');
-
-describe('success-checkmark', () => {
-  beforeEach(resetDOM);
-
-  it('schema declares animation-feedback category', () => {
-    expect(successCheckmark.schema.category).toBe('animation-feedback');
-    expect(successCheckmark.schema.events).toContain('success-checkmark-done');
-    expect(successCheckmark.schema.attributes).toContain('data-success-checkmark-active');
-  });
-
-  it('connect → disconnect leaves no managed attribute', () => {
-    const host = mountHost();
-    const inst = connectTrait(successCheckmark, host);
-    inst.disconnect(host);
-    expect(host.hasAttribute('data-success-checkmark-active')).toBe(false);
-  });
-
-  it('stamps an SVG on validated event with detail.valid === true', () => {
-    const host = mountHost();
-    connectTrait(successCheckmark, host);
-
-    host.dispatchEvent(new CustomEvent('validated', {
-      detail: { valid: true, errors: [] },
-    }));
-
-    expect(host.hasAttribute('data-success-checkmark-active')).toBe(true);
-    const svg = findSvg();
-    expect(svg).not.toBeNull();
-    expect(svg.querySelector('path')).not.toBeNull();
-  });
-
-  it('does not stamp on validated event with detail.valid === false', () => {
-    const host = mountHost();
-    connectTrait(successCheckmark, host);
-
-    host.dispatchEvent(new CustomEvent('validated', {
-      detail: { valid: false, errors: ['nope'] },
-    }));
-
-    expect(host.hasAttribute('data-success-checkmark-active')).toBe(false);
-    expect(findSvg()).toBeNull();
-  });
-
-  it('fires on data-validation-valid (false → true)', async () => {
-    const host = mountHost();
-    connectTrait(successCheckmark, host);
-
-    host.setAttribute('data-validation-valid', '');
-    await wait(0);
-    expect(host.hasAttribute('data-success-checkmark-active')).toBe(true);
-    expect(findSvg()).not.toBeNull();
-  });
-
-  it('respects data-success-checkmark-trigger attribute toggle', async () => {
-    const host = mountHost();
-    connectTrait(successCheckmark, host);
-
-    host.setAttribute('data-success-checkmark-trigger', '');
-    await wait(0);
-    expect(findSvg()).not.toBeNull();
-  });
-
-  it('renders position: fixed at viewport coordinates (no longer clipped by host overflow)', () => {
-    const host = mountHost();
-    connectTrait(successCheckmark, host);
-
-    host.dispatchEvent(new CustomEvent('validated', {
-      detail: { valid: true, errors: [] },
-    }));
-
-    const svg = findSvg();
-    expect(svg).not.toBeNull();
-    // Body-level rendering with position: fixed escapes any
-    // overflow:hidden ancestor that the host might be inside.
-    expect(svg.style.position).toBe('fixed');
-    expect(svg.parentElement).toBe(document.body);
-  });
-
-  it('removes the SVG and fires success-checkmark-done after the visible+fade window', async () => {
-    const host = mountHost();
-    connectTrait(successCheckmark, host);
-    const spy = spyEvent(host, 'success-checkmark-done');
-
-    host.dispatchEvent(new CustomEvent('validated', { detail: { valid: true } }));
-    expect(findSvg()).not.toBeNull();
-
-    // 1500ms hold + 300ms fade = ~1800ms; give a small grace window.
-    await wait(1900);
-    expect(findSvg()).toBeNull();
-    expect(spy.count).toBe(1);
-    expect(host.hasAttribute('data-success-checkmark-active')).toBe(false);
-  });
-
-  it('disconnect removes any in-flight SVG', () => {
-    const host = mountHost();
-    const inst = connectTrait(successCheckmark, host);
-    host.dispatchEvent(new CustomEvent('validated', { detail: { valid: true } }));
-    expect(findSvg()).not.toBeNull();
-
-    inst.disconnect(host);
-    expect(findSvg()).toBeNull();
-    expect(host.hasAttribute('data-success-checkmark-active')).toBe(false);
-  });
-
-  it('does not mutate host.style.position (body-level rendering means the host needs no positioning context)', () => {
-    const host = mountHost();
-    const before = host.style.position;
-    connectTrait(successCheckmark, host);
-    host.dispatchEvent(new CustomEvent('validated', { detail: { valid: true } }));
-    expect(host.style.position).toBe(before);
-  });
-});

package/traits/tilt-hover/tilt-hover.test.js

@@ -1,32 +0,0 @@
-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('');
-  });
-});

package/traits/tossable/tossable.test.js

@@ -1,31 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import { tossable } from './tossable.js';
-import { mountHost, connectTrait, resetDOM } from '../test-helpers.js';
-
-function pointer(host, type, x, y) {
-  host.dispatchEvent(new PointerEvent(type, { clientX: x, clientY: y, pointerId: 1, bubbles: true }));
-}
-
-describe('tossable', () => {
-  beforeEach(resetDOM);
-
-  it('connect attaches without throwing', () => {
-    const host = mountHost();
-    expect(() => connectTrait(tossable, host)).not.toThrow();
-  });
-
-  it('drag sequence completes without throwing + disconnect cleans up', () => {
-    const host = mountHost();
-    const inst = connectTrait(tossable, host);
-    pointer(host, 'pointerdown', 0, 0);
-    pointer(host, 'pointermove', 50, 0);
-    pointer(host, 'pointerup', 50, 0);
-    expect(() => inst.disconnect(host)).not.toThrow();
-    expect(host.hasAttribute('data-tossable-flying')).toBe(false);
-  });
-
-  it('respects data-tossable-bounds config', () => {
-    const host = mountHost('div', { 'data-tossable-bounds': 'parent' });
-    expect(() => connectTrait(tossable, host)).not.toThrow();
-  });
-});

package/traits/traits-host.test.js

@@ -1,73 +0,0 @@
-/**
- * <traits-host> behavior tests — focus on the wrapper-specific contract:
- *  - children pass through visually (display: contents)
- *  - declarative traits attach to the wrapper
- *  - traits attribute swaps work the same as on UIElement subclasses
- *  - events from children bubble up to the wrapper for trait capture
- */
-
-import { describe, it, expect, beforeEach } from 'vitest';
-import './traits-host.js';
-import './pressable/pressable.js';
-import './hoverable/hoverable.js';
-import { resetDOM } from './test-helpers.js';
-
-describe('<traits-host>', () => {
-  beforeEach(resetDOM);
-
-  it('is registered as a UIElement subclass', () => {
-    const ctor = customElements.get('traits-host');
-    expect(ctor).toBeTruthy();
-  });
-
-  it('declarative traits=" " attaches to the wrapper itself', () => {
-    document.body.innerHTML = '<traits-host traits="pressable"><div>Raw</div></traits-host>';
-    const host = document.body.firstElementChild;
-    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('events from children bubble up so the trait captures them', () => {
-    document.body.innerHTML = '<traits-host traits="hoverable"><span class="inner">Hover</span></traits-host>';
-    const host = document.body.firstElementChild;
-    const inner = host.querySelector('.inner');
-    // Synthesize a pointerenter on the wrapper (DOM bubbling up from inner
-    // would also work but happy-dom doesn't always reflect that for hover).
-    host.dispatchEvent(new PointerEvent('pointerenter', { bubbles: true }));
-    expect(host.hasAttribute('data-hoverable-hover')).toBe(true);
-    host.dispatchEvent(new PointerEvent('pointerleave', { bubbles: true }));
-    expect(host.hasAttribute('data-hoverable-hover')).toBe(false);
-  });
-
-  it('changing traits attribute swaps the trait stack', () => {
-    document.body.innerHTML = '<traits-host traits="pressable"><div>x</div></traits-host>';
-    const host = document.body.firstElementChild;
-    host.dispatchEvent(new PointerEvent('pointerdown'));
-    expect(host.hasAttribute('data-pressable-pressed')).toBe(true);
-    host.dispatchEvent(new PointerEvent('pointerup'));
-
-    host.setAttribute('traits', 'hoverable');
-    host.dispatchEvent(new PointerEvent('pointerdown'));
-    expect(host.hasAttribute('data-pressable-pressed')).toBe(false);
-    host.dispatchEvent(new PointerEvent('pointerenter'));
-    expect(host.hasAttribute('data-hoverable-hover')).toBe(true);
-  });
-
-  it('removing the host cleans up trait attributes', () => {
-    document.body.innerHTML = '<traits-host traits="pressable"><div>x</div></traits-host>';
-    const host = document.body.firstElementChild;
-    host.dispatchEvent(new PointerEvent('pointerdown'));
-    expect(host.hasAttribute('data-pressable-pressed')).toBe(true);
-    host.remove();
-    expect(host.hasAttribute('data-pressable-pressed')).toBe(false);
-  });
-
-  it('with no traits attribute: pure pass-through, children render', () => {
-    document.body.innerHTML = '<traits-host><span class="x">child</span></traits-host>';
-    const host = document.body.firstElementChild;
-    expect(host.querySelector('.x')).toBeTruthy();
-    expect(host.querySelector('.x').textContent).toBe('child');
-  });
-});

package/traits/typeahead/typeahead.test.js

@@ -1,38 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import { typeahead } from './typeahead.js';
-import { mountHost, connectTrait, spyEvent, resetDOM, wait } from '../test-helpers.js';
-
-function child(host, text) {
-  const li = document.createElement('div');
-  li.textContent = text;
-  li.setAttribute('role', 'option');
-  host.appendChild(li);
-  return li;
-}
-
-describe('typeahead', () => {
-  beforeEach(resetDOM);
-
-  it('typing first letter matches a child by textContent', async () => {
-    const host = mountHost();
-    child(host, 'Apple');
-    child(host, 'Banana');
-    child(host, 'Cherry');
-    connectTrait(typeahead, host);
-    const spy = spyEvent(host, 'typeahead-match');
-    host.dispatchEvent(new KeyboardEvent('keydown', { key: 'b' }));
-    await wait(20);
-    expect(spy.count).toBeGreaterThanOrEqual(1);
-    expect(spy.last.element?.textContent).toBe('Banana');
-  });
-
-  it('disconnect removes the keydown listener', () => {
-    const host = mountHost();
-    child(host, 'Apple');
-    const inst = connectTrait(typeahead, host);
-    const spy = spyEvent(host, 'typeahead-match');
-    inst.disconnect(host);
-    host.dispatchEvent(new KeyboardEvent('keydown', { key: 'a' }));
-    expect(spy.count).toBe(0);
-  });
-});

package/traits/typewriter/typewriter.test.js

@@ -1,47 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import { typewriter } from './typewriter.js';
-import { mountHost, connectTrait, spyEvent, resetDOM, wait } from '../test-helpers.js';
-
-describe('typewriter', () => {
-  beforeEach(resetDOM);
-
-  it('starts with empty content + active attribute on connect', () => {
-    const host = mountHost();
-    host.textContent = 'Hello';
-    connectTrait(typewriter, host, { speed: 5 });
-    host.setAttribute('data-typewriter-speed', '5');
-    // Re-connect after setting speed (setup reads on connect)
-    typewriter().connect(host);
-    expect(host.hasAttribute('data-typewriter-active')).toBe(true);
-  });
-
-  it('reveals full text and fires typewriter-done', async () => {
-    const host = mountHost();
-    host.textContent = 'Hi';
-    host.setAttribute('data-typewriter-speed', '5');
-    const spy = spyEvent(host, 'typewriter-done');
-    typewriter().connect(host);
-    await wait(80);
-    expect(host.textContent).toBe('Hi');
-    expect(spy.count).toBeGreaterThanOrEqual(1);
-  });
-
-  it('disconnect mid-reveal restores original text', async () => {
-    const host = mountHost();
-    host.textContent = 'A long sentence to reveal';
-    host.setAttribute('data-typewriter-speed', '20');
-    const inst = typewriter();
-    inst.connect(host);
-    await wait(40);
-    inst.disconnect(host);
-    expect(host.textContent).toBe('A long sentence to reveal');
-    expect(host.hasAttribute('data-typewriter-active')).toBe(false);
-  });
-
-  it('respects data-typewriter-speed default (50ms)', () => {
-    const host = mountHost();
-    host.textContent = 'X';
-    typewriter().connect(host);
-    expect(host.hasAttribute('data-typewriter-active')).toBe(true);
-  });
-});