import { expect, fixture, html } from '@open-wc/testing'; import './nile-command-menu-group'; import '../nile-command-menu-item/nile-command-menu-item'; import type { NileCommandMenuGroup } from './nile-command-menu-group'; describe('NileCommandMenuGroup', () => { it('1. renders', async () => { const el = await fixture(html``); expect(el).to.exist; }); it('2. shadow root', async () => { const el = await fixture(html``); expect(el.shadowRoot).to.not.be.null; }); it('3. tag name', async () => { const el = await fixture(html``); expect(el.tagName.toLowerCase()).to.equal('nile-command-menu-group'); }); it('4. heading defaults empty', async () => { const el = await fixture(html``); expect(el.heading).to.equal(''); }); it('5. set heading', async () => { const el = await fixture(html``); expect(el.heading).to.equal('Actions'); }); it('6. role group', async () => { const el = await fixture(html``); expect(el.getAttribute('role')).to.equal('group'); }); it('7. base part', async () => { const el = await fixture(html``); expect(el.shadowRoot!.querySelector('[part="base"]')).to.exist; }); it('8. heading part', async () => { const el = await fixture(html``); expect(el.shadowRoot!.querySelector('[part="heading"]')).to.exist; }); it('9. items slot', async () => { const el = await fixture(html``); expect(el.shadowRoot!.querySelector('slot[part="items"]')).to.exist; }); it('10. heading slot', async () => { const el = await fixture(html``); expect(el.shadowRoot!.querySelector('slot[name="heading"]')).to.exist; }); it('11. heading text rendered', async () => { const el = await fixture(html``); await el.updateComplete; expect(el.shadowRoot!.querySelector('[part="heading"]')!.textContent).to.contain('Pages'); }); it('12. heading hidden when empty', async () => { const el = await fixture(html``); await el.updateComplete; expect(el.shadowRoot!.querySelector('.group__heading--empty')).to.exist; }); it('13. heading visible when set', async () => { const el = await fixture(html``); await el.updateComplete; expect(el.shadowRoot!.querySelector('.group__heading--empty')).to.be.null; }); it('14. holds items', async () => { const el = await fixture(html`One`); expect(el.querySelectorAll('nile-command-menu-item').length).to.equal(1); }); it('15. dynamic heading', async () => { const el = await fixture(html``); el.heading = 'New'; await el.updateComplete; expect(el.shadowRoot!.querySelector('[part="heading"]')!.textContent).to.contain('New'); }); it('16. is defined', async () => { expect(customElements.get('nile-command-menu-group')).to.exist; }); });