@adia-ai/web-modules 0.8.19 → 0.8.21

package/editor/editor-sidebar/editor-sidebar.test.js

@@ -1,383 +0,0 @@
-import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest';
-import '../../../web-components/core/element.js';
-import './editor-sidebar.js';
-
-const tick = () => new Promise((r) => queueMicrotask(r));
-
-function mount(html) {
-  const wrap = document.createElement('div');
-  wrap.innerHTML = html;
-  document.body.appendChild(wrap);
-  return wrap.firstElementChild;
-}
-
-let originalRect;
-beforeEach(() => {
-  document.body.innerHTML = '';
-  try { localStorage.clear(); } catch {}
-  globalThis.ResizeObserver = class {
-    observe() {} unobserve() {} disconnect() {}
-  };
-  // happy-dom: stub getBoundingClientRect to derive from style.width
-  originalRect = HTMLElement.prototype.getBoundingClientRect;
-  HTMLElement.prototype.getBoundingClientRect = function () {
-    const inline = this.style?.width || '';
-    const w = parseFloat(inline) || 240;
-    return { width: w, height: 600, top: 0, left: 0, right: w, bottom: 600, x: 0, y: 0 };
-  };
-});
-
-afterEach(() => {
-  if (originalRect) HTMLElement.prototype.getBoundingClientRect = originalRect;
-});
-
-describe('editor-sidebar', () => {
-  it('registers editor-sidebar as a custom element', () => {
-    expect(customElements.get('editor-sidebar')).toBeDefined();
-  });
-
-  it('defaults to collapsed=false on connect', () => {
-    const sb = mount('<editor-sidebar slot="leading"><pane-ui></pane-ui></editor-sidebar>');
-    expect(sb.collapsed).toBe(false);
-  });
-
-  it('reflects [collapsed] via property assignment', async () => {
-    const sb = mount('<editor-sidebar slot="leading"><pane-ui></pane-ui></editor-sidebar>');
-    sb.collapsed = true;
-    await tick();
-    expect(sb.hasAttribute('collapsed')).toBe(true);
-  });
-
-  it('exposes .toggle() / .collapse() / .expand() public methods', () => {
-    const sb = mount('<editor-sidebar slot="leading" collapsible><pane-ui></pane-ui></editor-sidebar>');
-    expect(typeof sb.toggle).toBe('function');
-    expect(typeof sb.collapse).toBe('function');
-    expect(typeof sb.expand).toBe('function');
-  });
-
-  it('persists pane width to editor-namespaced localStorage key (cluster-distinct)', () => {
-    const sb = mount('<editor-sidebar slot="leading" collapsible><pane-ui></pane-ui></editor-sidebar>');
-    const pane = sb.querySelector('pane-ui');
-    pane.style.width = '240px';
-    sb.collapse();
-    expect(sb.collapsed).toBe(true);
-    // editor-namespaced key
-    expect(localStorage.getItem('adia-editor-sidebar-leading')).not.toBeNull();
-    // Should NOT collide with admin or chat namespaces
-    expect(localStorage.getItem('adia-sidebar-leading')).toBeNull();
-    expect(localStorage.getItem('adia-chat-sidebar-leading')).toBeNull();
-  });
-
-  it('uses [name] override for the localStorage key', () => {
-    const sb = mount('<editor-sidebar slot="leading" name="navigator" collapsible><pane-ui></pane-ui></editor-sidebar>');
-    const pane = sb.querySelector('pane-ui');
-    pane.style.width = '200px';
-    sb.collapse();
-    expect(localStorage.getItem('adia-editor-sidebar-navigator')).not.toBeNull();
-    expect(localStorage.getItem('adia-editor-sidebar-leading')).toBeNull();
-  });
-
-  it('toggle() returns the new collapsed value', () => {
-    const sb = mount('<editor-sidebar slot="leading" collapsible><pane-ui></pane-ui></editor-sidebar>');
-    const pane = sb.querySelector('pane-ui');
-    pane.style.width = '200px';
-    const result = sb.toggle();
-    expect(result).toBe(sb.collapsed);
-  });
-
-  it('dispatches sidebar-toggle event on toggle()', () => {
-    const sb = mount('<editor-sidebar slot="leading" collapsible><pane-ui></pane-ui></editor-sidebar>');
-    const pane = sb.querySelector('pane-ui');
-    pane.style.width = '200px';
-    const onToggle = vi.fn();
-    sb.addEventListener('sidebar-toggle', onToggle);
-    sb.toggle();
-    expect(onToggle).toHaveBeenCalledTimes(1);
-    expect(onToggle.mock.calls[0][0].detail).toEqual(
-      expect.objectContaining({ name: expect.any(String), expanded: expect.any(Boolean) })
-    );
-  });
-
-  it('expand() restores from stored width or defaults to 240', () => {
-    // Pre-populate stored width
-    localStorage.setItem('adia-editor-sidebar-leading', '320');
-    const sb = mount('<editor-sidebar slot="leading" collapsible><pane-ui></pane-ui></editor-sidebar>');
-    sb.collapse();
-    sb.expand();
-    const pane = sb.querySelector('pane-ui');
-    expect(pane.style.width).toBe('320px');
-  });
-
-  it('cleanup on disconnect — removes pointerup listener', () => {
-    const sb = mount('<editor-sidebar slot="leading" collapsible><pane-ui></pane-ui></editor-sidebar>');
-    const removeSpy = vi.spyOn(document, 'removeEventListener');
-    sb.remove();
-    const removedTypes = removeSpy.mock.calls.map((args) => args[0]);
-    expect(removedTypes).toContain('pointerup');
-  });
-
-  it('does not latch [collapsed] on small-transient RO sample while host is display:none (§FB-49)', async () => {
-    // Capture the RO callback so we can fire it manually with a transient width.
-    let roCallback;
-    const savedRO = globalThis.ResizeObserver;
-    globalThis.ResizeObserver = class {
-      constructor(cb) { roCallback = cb; }
-      observe() {} unobserve() {} disconnect() {}
-    };
-
-    const sb = mount('<editor-sidebar slot="leading" collapsible><pane-ui></pane-ui></editor-sidebar>');
-    const pane = sb.querySelector('pane-ui');
-    pane.style.width = '240px';
-
-    // Simulate display:none via inline style; stub getComputedStyle to reflect it.
-    sb.style.display = 'none';
-    const origGCS = globalThis.getComputedStyle;
-    globalThis.getComputedStyle = (el, ps) => {
-      if (el === sb && el.style.display === 'none') return { display: 'none' };
-      return origGCS(el, ps);
-    };
-
-    // Fire the RO with a small-nonzero transient (48px = SNAP_THRESHOLD).
-    if (roCallback) roCallback([{ target: pane, contentRect: { width: 48 } }]);
-    await tick();
-
-    expect(sb.collapsed).toBe(false);
-    expect(sb.hasAttribute('collapsed')).toBe(false);
-
-    globalThis.ResizeObserver = savedRO;
-    globalThis.getComputedStyle = origGCS;
-  });
-
-  it('defers [collapsed]=true by one rAF for small-transient samples (§FB-50)', async () => {
-    let roCallback;
-    const savedRO = globalThis.ResizeObserver;
-    globalThis.ResizeObserver = class {
-      constructor(cb) { roCallback = cb; }
-      observe() {} unobserve() {} disconnect() {}
-    };
-
-    const sb = mount('<editor-sidebar slot="leading" collapsible><pane-ui></pane-ui></editor-sidebar>');
-    const pane = sb.querySelector('pane-ui');
-    // Simulate a small width on the pane (CSS grid collapse transient or drag).
-    pane.style.width = '48px';
-
-    if (roCallback) roCallback([{ target: pane }]);
-    // Immediately after RO callback — collapsed must NOT be set yet (rAF pending).
-    expect(sb.collapsed).toBe(false);
-
-    // After the rAF fires — pane still 48px, host visible → collapse is applied.
-    await new Promise((r) => requestAnimationFrame(r));
-    await tick();
-    expect(sb.collapsed).toBe(true);
-
-    globalThis.ResizeObserver = savedRO;
-  });
-
-  it('rAF check skips collapse if display:none applied before frame fires (§FB-50 wide→narrow race)', async () => {
-    let roCallback;
-    const savedRO = globalThis.ResizeObserver;
-    globalThis.ResizeObserver = class {
-      constructor(cb) { roCallback = cb; }
-      observe() {} unobserve() {} disconnect() {}
-    };
-
-    const sb = mount('<editor-sidebar slot="leading" collapsible><pane-ui></pane-ui></editor-sidebar>');
-    const pane = sb.querySelector('pane-ui');
-    // Transient 48px — CSS grid collapsed the track before display:none applied.
-    pane.style.width = '48px';
-
-    if (roCallback) roCallback([{ target: pane }]);
-    expect(sb.collapsed).toBe(false);  // deferred, not set yet
-
-    // Simulate display:none propagating before the rAF executes (the race window).
-    sb.style.display = 'none';
-    const origGCS = globalThis.getComputedStyle;
-    globalThis.getComputedStyle = (el, ps) => {
-      if (el === sb && el.style.display === 'none') return { display: 'none' };
-      return origGCS(el, ps);
-    };
-
-    // rAF fires — guard sees display:none → collapsed stays false.
-    await new Promise((r) => requestAnimationFrame(r));
-    await tick();
-    expect(sb.collapsed).toBe(false);
-    expect(sb.hasAttribute('collapsed')).toBe(false);
-
-    globalThis.ResizeObserver = savedRO;
-    globalThis.getComputedStyle = origGCS;
-  });
-
-  // ── GH #223: expand() permanently wedges when the width transition is enabled ──
-  // Root cause: pane-ui's real CSS transition (editor-shell.bespoke.css) animates
-  // width from 48px toward the restore target; early ResizeObserver samples
-  // mid-transition are legitimately still <= SNAP_THRESHOLD, and the old
-  // #syncCollapsed() couldn't tell that apart from a genuine drag-to-collapse
-  // settle — flipping [collapsed] back to true mid-flight re-matches the
-  // `!important` collapsed-width CSS rule, which snaps the pane back to 48px
-  // and permanently interrupts the transition (no further resize ever occurs
-  // to self-correct). These tests mock a nonzero `transitionDuration` on the
-  // pane (jsdom/happy-dom has no real CSS loaded) to exercise the suppression.
-  describe('expand() transition race (GH #223)', () => {
-    function withPaneTransitionDuration(pane, durationStr) {
-      const origGCS = globalThis.getComputedStyle;
-      globalThis.getComputedStyle = (el, ps) => {
-        if (el === pane) return { ...origGCS(el, ps), transitionDuration: durationStr };
-        return origGCS(el, ps);
-      };
-      return () => { globalThis.getComputedStyle = origGCS; };
-    }
-
-    it('does not latch [collapsed] on a small mid-transition RO sample while an explicit expand() is in flight', async () => {
-      let roCallback;
-      const savedRO = globalThis.ResizeObserver;
-      globalThis.ResizeObserver = class {
-        constructor(cb) { roCallback = cb; }
-        observe() {} unobserve() {} disconnect() {}
-      };
-
-      const sb = mount('<editor-sidebar slot="leading" collapsible><pane-ui></pane-ui></editor-sidebar>');
-      const pane = sb.querySelector('pane-ui');
-      const restoreGCS = withPaneTransitionDuration(pane, '0.18s');
-      pane.style.width = '48px';
-      sb.collapsed = true;
-
-      sb.expand(); // sets pane width to the restore target + marks expand-in-flight
-
-      // Mid-transition: the observer samples an intermediate, still-small width.
-      pane.style.width = '77px';
-      if (roCallback) roCallback([{ target: pane }]);
-      await new Promise((r) => requestAnimationFrame(r));
-      await tick();
-
-      // Must NOT have snapped back to collapsed — this is exactly the wedge bug.
-      expect(sb.collapsed).toBe(false);
-      expect(sb.hasAttribute('collapsed')).toBe(false);
-
-      restoreGCS();
-      globalThis.ResizeObserver = savedRO;
-    });
-
-    it('clears expand-in-flight and re-syncs on transitionend, landing on the correct final state', async () => {
-      let roCallback;
-      const savedRO = globalThis.ResizeObserver;
-      globalThis.ResizeObserver = class {
-        constructor(cb) { roCallback = cb; }
-        observe() {} unobserve() {} disconnect() {}
-      };
-
-      const sb = mount('<editor-sidebar slot="leading" collapsible><pane-ui></pane-ui></editor-sidebar>');
-      const pane = sb.querySelector('pane-ui');
-      const restoreGCS = withPaneTransitionDuration(pane, '0.18s');
-      pane.style.width = '48px';
-      sb.collapsed = true;
-
-      sb.expand();
-      pane.style.width = '240px'; // transition has now settled at its target
-      // `propertyName` is a TransitionEvent field, not a plain Event
-      // constructor option (the constructor silently drops unknown keys) —
-      // assign it as an own property after construction instead.
-      const transitionEnd = new Event('transitionend', { bubbles: false });
-      transitionEnd.propertyName = 'width';
-      pane.dispatchEvent(transitionEnd);
-      await tick();
-
-      expect(sb.collapsed).toBe(false);
-      expect(sb.hasAttribute('collapsed')).toBe(false);
-
-      // With expand-in-flight cleared, a genuinely small sample (e.g. a
-      // later user drag-to-collapse) must resume being trusted normally.
-      pane.style.width = '48px';
-      if (roCallback) roCallback([{ target: pane }]);
-      await new Promise((r) => requestAnimationFrame(r));
-      await tick();
-      expect(sb.collapsed).toBe(true);
-
-      restoreGCS();
-      globalThis.ResizeObserver = savedRO;
-    });
-
-    it('falls back to a bounded timer sized to the computed duration when transitionend never fires', async () => {
-      vi.useFakeTimers();
-      let roCallback;
-      const savedRO = globalThis.ResizeObserver;
-      globalThis.ResizeObserver = class {
-        constructor(cb) { roCallback = cb; }
-        observe() {} unobserve() {} disconnect() {}
-      };
-
-      const sb = mount('<editor-sidebar slot="leading" collapsible><pane-ui></pane-ui></editor-sidebar>');
-      const pane = sb.querySelector('pane-ui');
-      const restoreGCS = withPaneTransitionDuration(pane, '0.18s');
-      pane.style.width = '48px';
-      sb.collapsed = true;
-
-      sb.expand();
-      pane.style.width = '77px'; // stuck reporting a small value; no transitionend ever arrives
-      if (roCallback) roCallback([{ target: pane }]);
-      await vi.advanceTimersByTimeAsync(50); // rAF-equivalent settle window (fake timers)
-
-      // Still suppressed — the 180ms+50ms safety timer hasn't elapsed yet.
-      expect(sb.collapsed).toBe(false);
-
-      pane.style.width = '240px'; // by the time the safety timer fires, transition is done
-      await vi.advanceTimersByTimeAsync(300); // past the 180+50ms fallback
-      expect(sb.collapsed).toBe(false); // final re-sync sees the real (large) width
-
-      restoreGCS();
-      globalThis.ResizeObserver = savedRO;
-      vi.useRealTimers();
-    });
-
-    it('skips expand-in-flight suppression entirely when the computed transition duration is 0 (no transition to race)', async () => {
-      let roCallback;
-      const savedRO = globalThis.ResizeObserver;
-      globalThis.ResizeObserver = class {
-        constructor(cb) { roCallback = cb; }
-        observe() {} unobserve() {} disconnect() {}
-      };
-
-      const sb = mount('<editor-sidebar slot="leading" collapsible><pane-ui></pane-ui></editor-sidebar>');
-      const pane = sb.querySelector('pane-ui');
-      // No transitionDuration mock — jsdom/happy-dom defaults to '0s'.
-      pane.style.width = '48px';
-      sb.collapsed = true;
-
-      sb.expand();
-      // With a 0-duration transition, the width jump is instantaneous — the
-      // observer's first sample already lands at the final (large) width.
-      pane.style.width = '240px';
-      if (roCallback) roCallback([{ target: pane }]);
-      await tick();
-
-      expect(sb.collapsed).toBe(false);
-      globalThis.ResizeObserver = savedRO;
-    });
-  });
-
-  it('handles missing inner <pane-ui> gracefully (no crash)', () => {
-    const sb = mount('<editor-sidebar slot="leading"></editor-sidebar>');
-    // Should not throw
-    expect(() => sb.toggle()).not.toThrow();
-    expect(() => sb.collapse()).not.toThrow();
-    expect(() => sb.expand()).not.toThrow();
-  });
-
-  it('reflects [resizing] via property assignment', async () => {
-    const sb = mount('<editor-sidebar slot="leading"><pane-ui></pane-ui></editor-sidebar>');
-    sb.resizing = true;
-    await tick();
-    expect(sb.hasAttribute('resizing')).toBe(true);
-    sb.resizing = false;
-    await tick();
-    expect(sb.hasAttribute('resizing')).toBe(false);
-  });
-
-  it('clears [resizing] on document pointerup', async () => {
-    const sb = mount('<editor-sidebar slot="leading"><pane-ui></pane-ui></editor-sidebar>');
-    sb.resizing = true;
-    await tick();
-    document.dispatchEvent(new Event('pointerup'));
-    await tick();
-    expect(sb.resizing).toBe(false);
-  });
-});

package/editor/editor-toolbar/editor-toolbar.test.js

@@ -1,99 +0,0 @@
-import { describe, it, expect, beforeEach, vi } from 'vitest';
-import '../../../web-components/core/element.js';
-import './editor-toolbar.js';
-
-const tick = () => new Promise((r) => queueMicrotask(r));
-
-function mount(html) {
-  const wrap = document.createElement('div');
-  wrap.innerHTML = html;
-  document.body.appendChild(wrap);
-  return wrap.firstElementChild;
-}
-
-beforeEach(() => {
-  document.body.innerHTML = '';
-});
-
-describe('editor-toolbar', () => {
-  it('registers editor-toolbar as a custom element', () => {
-    expect(customElements.get('editor-toolbar')).toBeDefined();
-  });
-
-  it('defaults to fullScreen=false', () => {
-    const t = mount('<editor-toolbar></editor-toolbar>');
-    expect(t.fullScreen).toBe(false);
-  });
-
-  it('reflects [full-screen] via property assignment', async () => {
-    const t = mount('<editor-toolbar></editor-toolbar>');
-    t.fullScreen = true;
-    await tick();
-    expect(t.hasAttribute('full-screen')).toBe(true);
-  });
-
-  it('honors initial [full-screen] attribute on connect', () => {
-    const t = mount('<editor-toolbar full-screen></editor-toolbar>');
-    expect(t.fullScreen).toBe(true);
-  });
-
-  it('bubbles toolbar-action event from [data-toolbar-action] children', async () => {
-    const wrap = document.createElement('div');
-    wrap.innerHTML = `<editor-toolbar>
-      <button data-toolbar-action="save">Save</button>
-      <button data-toolbar-action="undo">Undo</button>
-    </editor-toolbar>`;
-    document.body.appendChild(wrap);
-    const toolbar = wrap.firstElementChild;
-    const saveBtn = toolbar.querySelector('[data-toolbar-action="save"]');
-
-    const onAction = vi.fn();
-    toolbar.addEventListener('toolbar-action', onAction);
-
-    saveBtn.click();
-    await tick();
-
-    expect(onAction).toHaveBeenCalledTimes(1);
-    expect(onAction.mock.calls[0][0].detail).toEqual({ name: 'save' });
-  });
-
-  it('does not fire toolbar-action for clicks outside [data-toolbar-action]', async () => {
-    const wrap = document.createElement('div');
-    wrap.innerHTML = `<editor-toolbar>
-      <span>Title</span>
-      <button>Plain button</button>
-    </editor-toolbar>`;
-    document.body.appendChild(wrap);
-    const toolbar = wrap.firstElementChild;
-    const plainBtn = toolbar.querySelector('button');
-
-    const onAction = vi.fn();
-    toolbar.addEventListener('toolbar-action', onAction);
-
-    plainBtn.click();
-    await tick();
-
-    expect(onAction).not.toHaveBeenCalled();
-  });
-
-  it('cleanup on disconnect — removes click listener', () => {
-    const t = mount('<editor-toolbar></editor-toolbar>');
-    const removeSpy = vi.spyOn(t, 'removeEventListener');
-    t.remove();
-    const removedTypes = removeSpy.mock.calls.map((args) => args[0]);
-    expect(removedTypes).toContain('click');
-  });
-
-  it('event bubbles up beyond the toolbar', async () => {
-    const outer = document.createElement('div');
-    document.body.appendChild(outer);
-    outer.innerHTML = `<editor-toolbar>
-      <button data-toolbar-action="settings"></button>
-    </editor-toolbar>`;
-    const onOuterAction = vi.fn();
-    outer.addEventListener('toolbar-action', onOuterAction);
-    outer.querySelector('button').click();
-    await tick();
-    expect(onOuterAction).toHaveBeenCalled();
-  });
-});

package/form/form-popover/form-popover.test.js

@@ -1,95 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import './form-popover.js';
-
-const mount = (html) => {
-  const wrap = document.createElement('div');
-  wrap.innerHTML = html;
-  document.body.appendChild(wrap);
-  return wrap.firstElementChild;
-};
-
-describe('form-popover-ui', () => {
-  beforeEach(() => { document.body.innerHTML = ''; });
-
-  it('adopts the fragment into the popover body, order preserved', () => {
-    const el = mount(`<form-popover-ui label="Options">
-      <check-ui label="a"></check-ui>
-      <divider-ui></divider-ui>
-      <input-ui placeholder="name"></input-ui>
-    </form-popover>`);
-    const body = el.querySelector('[data-form-popover-body]');
-    expect(body).toBeTruthy();
-    const tags = [...body.children].map((c) => c.tagName.toLowerCase());
-    expect(tags).toEqual(['check-ui', 'divider-ui', 'input-ui']);
-    // the popover skeleton is NOT part of the adopted fragment
-    expect(el.querySelector(':scope > popover-ui')).toBeTruthy();
-  });
-
-  it('summary counts checked check-ui: "N selected" / "N total"', () => {
-    const el = mount(`<form-popover-ui label="Option items">
-      <check-ui label="a" checked></check-ui>
-      <check-ui label="b"></check-ui>
-      <check-ui label="c" checked></check-ui>
-    </form-popover>`);
-    const trigger = el.querySelector('[data-form-popover-trigger]');
-    expect(trigger.getAttribute('text')).toBe('Option items · 2 selected');
-    expect(el.summary).toEqual({ selected: 2, total: 3 });
-    // uncheck everything → falls back to total
-    for (const box of el.querySelectorAll('check-ui')) box.removeAttribute('checked');
-    el.dispatchEvent(new Event('change', { bubbles: true }));
-    expect(trigger.getAttribute('text')).toBe('Option items · 3 total');
-  });
-
-  it('renders the bare label when the fragment has no check-ui', () => {
-    const el = mount(`<form-popover-ui label="Rename">
-      <input-ui placeholder="name"></input-ui>
-    </form-popover>`);
-    expect(el.querySelector('[data-form-popover-trigger]').getAttribute('text')).toBe('Rename');
-  });
-
-  it('[heading] renders and clears', async () => {
-    const el = mount(`<form-popover-ui label="x" heading="Select options"><check-ui label="a"></check-ui></form-popover>`);
-    expect(el.querySelector('[data-form-popover-heading]').textContent).toBe('Select options');
-    el.heading = '';
-    await Promise.resolve();
-    expect(el.querySelector('[data-form-popover-heading]')).toBeNull();
-  });
-
-  it('emits summary-change with detail', () => {
-    const el = mount(`<form-popover-ui label="x"><check-ui label="a"></check-ui></form-popover>`);
-    let detail = null;
-    el.addEventListener('summary-change', (e) => { detail = e.detail; });
-    el.querySelector('check-ui').setAttribute('checked', '');
-    el.dispatchEvent(new Event('change', { bubbles: true }));
-    expect(detail).toEqual({ selected: 1, total: 1 });
-  });
-
-  it('falls back to "Options" with no label and no checkboxes (a11y guard)', () => {
-    const el = mount(`<form-popover-ui><input-ui placeholder="name"></input-ui></form-popover-ui>`);
-    expect(el.querySelector('[data-form-popover-trigger]').getAttribute('text')).toBe('Options');
-  });
-
-  it('passes [placement] through to the internal popover, including updates', async () => {
-    const el = mount(`<form-popover-ui label="x" placement="top"><check-ui label="a"></check-ui></form-popover-ui>`);
-    expect(el.querySelector(':scope > popover-ui').getAttribute('placement')).toBe('top');
-    el.placement = 'bottom-end';
-    await Promise.resolve();
-    expect(el.querySelector(':scope > popover-ui').getAttribute('placement')).toBe('bottom-end');
-  });
-
-  it('[label] updates re-render the summary reactively', async () => {
-    const el = mount(`<form-popover-ui label="Old"><check-ui label="a" checked></check-ui></form-popover-ui>`);
-    el.label = 'New';
-    await Promise.resolve();
-    expect(el.querySelector('[data-form-popover-trigger]').getAttribute('text')).toBe('New · 1 selected');
-  });
-
-  it('disconnect removes the summary listener (no stale updates after removal)', () => {
-    const el = mount(`<form-popover-ui label="x"><check-ui label="a"></check-ui></form-popover-ui>`);
-    const trigger = el.querySelector('[data-form-popover-trigger]');
-    el.remove();
-    el.querySelector('check-ui').setAttribute('checked', '');
-    el.dispatchEvent(new Event('change', { bubbles: true }));
-    expect(trigger.getAttribute('text')).toBe('x · 1 total');
-  });
-});