import { describe, it, expect, beforeEach } from 'vitest';
import '../../core/element.js';
import './nav-group.js';

const tick = () => new Promise((r) => queueMicrotask(r));
function mount(html) {
  const w = document.createElement('div');
  w.innerHTML = html;
  document.body.appendChild(w);
  return w.firstElementChild;
}

describe('nav-group-ui — header stamp-if-absent (wrapper trap)', () => {
  beforeEach(() => { document.body.innerHTML = ''; });

  it('stamps a header when the consumer provides none', async () => {
    const el = mount('<nav-group-ui text="Reports"></nav-group-ui>');
    await tick();
    expect(el.querySelectorAll('[slot="header"]').length).toBe(1);
  });

  // Regression (audit-wrapper-trap arm 2): a `.map()`/conditional-interpolated
  // [slot="header"] arrives nested in a display:contents wrapper. The old
  // `:scope > [slot="header"]` absence check missed it and stamped a DUPLICATE.
  it('does NOT stamp a duplicate when a WRAPPED consumer header is present', async () => {
    const el = mount(`<nav-group-ui text="Reports"><span style="display:contents" role="presentation"><div slot="header" data-test="h">Custom</div></span></nav-group-ui>`);
    await tick();
    const headers = el.querySelectorAll('[slot="header"]');
    expect(headers.length).toBe(1);
    expect(headers[0].dataset.test).toBe('h');
  });
});
