@aquera/nile-elements 0.1.36-beta-1.2 → 0.1.36-beta-1.4

package/src/nile-tooltip/nile-tooltip.test.ts

@@ -1,168 +0,0 @@
-import { fixture, html, assert, oneEvent, waitUntil } from '@open-wc/testing';
-import './nile-tooltip';
-import { NileTooltip } from './nile-tooltip';
-
-describe('NileTooltip', () => {
-
-  it('renders with default properties', async () => {
-    const el = await fixture<NileTooltip>(html`<nile-tooltip content="Hello"><button>Hover me</button></nile-tooltip>`);
-    assert.equal(el.content, 'Hello');
-    assert.equal(el.placement, 'top');
-    assert.equal(el.disabled, false);
-    assert.equal(el.open, false);
-  });
-
-  it('renders text content when no slot is used', async () => {
-    const el = await fixture<NileTooltip>(html`<nile-tooltip content="Fallback"><button>Trigger</button></nile-tooltip>`);
-    const content = el.shadowRoot!.querySelector('.tooltip-content')!;
-    assert.include(content.textContent!, 'Fallback');
-  });
-
-  it('uses slotted content when provided', async () => {
-    const el = await fixture<NileTooltip>(html`
-      <nile-tooltip>
-        <div slot="content">Slot Content</div>
-        <button>Trigger</button>
-      </nile-tooltip>
-    `);
-
-    const slot = el.shadowRoot!.querySelector('slot[name="content"]') as HTMLSlotElement;
-    const assigned = slot.assignedNodes({ flatten: true });
-    assert.isAbove(assigned.length, 0);
-    assert.include(assigned[0].textContent ?? '', 'Slot Content');
-  });
-
-  it('shows tooltip on hover when trigger includes "hover"', async () => {
-    const el = await fixture<NileTooltip>(html`
-      <nile-tooltip content="Tooltip" trigger="hover">
-        <button>Hover me</button>
-      </nile-tooltip>
-    `);
-    const trigger = el.shadowRoot!.querySelector('.trigger-container')!;
-    trigger.dispatchEvent(new Event('mouseover', { bubbles: true }));
-    await waitUntil(() => el.open === true);
-    assert.isTrue(el.open);
-  });
-
-  it('hides tooltip on mouseout when trigger includes "hover"', async () => {
-    const el = await fixture<NileTooltip>(html`
-      <nile-tooltip content="Tooltip" trigger="hover">
-        <button>Hover me</button>
-      </nile-tooltip>
-    `);
-    const trigger = el.shadowRoot!.querySelector('.trigger-container')!;
-    trigger.dispatchEvent(new Event('mouseover', { bubbles: true }));
-    await waitUntil(() => el.open === true);
-    trigger.dispatchEvent(new Event('mouseout', { bubbles: true }));
-    await waitUntil(() => el.open === false);
-  });
-
-  it('toggles tooltip on click when trigger includes "click"', async () => {
-    const el = await fixture<NileTooltip>(html`
-      <nile-tooltip content="Click me" trigger="click">
-        <button>Click</button>
-      </nile-tooltip>
-    `);
-    const trigger = el.shadowRoot!.querySelector('.trigger-container') as HTMLElement;
-    trigger.click();
-    await waitUntil(() => el.open === true);
-    trigger.click();
-    await waitUntil(() => el.open === false);
-  });
-
-  it('shows and hides tooltip on focus/blur when trigger includes "focus"', async () => {
-    const el = await fixture<NileTooltip>(html`
-      <nile-tooltip content="Focus" trigger="focus">
-        <button>Focus</button>
-      </nile-tooltip>
-    `);
-    const trigger = el.shadowRoot!.querySelector('.trigger-container')!;
-    trigger.dispatchEvent(new Event('focusin'));
-    await waitUntil(() => el.open === true);
-    trigger.dispatchEvent(new Event('focusout'));
-    await waitUntil(() => el.open === false);
-  });
-
-  it('does not show tooltip when disabled', async () => {
-    const el = await fixture<NileTooltip>(html`
-      <nile-tooltip content="Disabled" disabled trigger="hover">
-        <button>Hover me</button>
-      </nile-tooltip>
-    `);
-    const trigger = el.shadowRoot!.querySelector('.trigger-container')!;
-    trigger.dispatchEvent(new Event('mouseover'));
-    await new Promise(resolve => setTimeout(resolve, 200));
-    assert.isFalse(el.open);
-  });
-
-
-  it('emits nile-show and nile-after-show events', async () => {
-    const el = await fixture<NileTooltip>(html`
-      <nile-tooltip content="Event test" trigger="click">
-        <button>Click</button>
-      </nile-tooltip>
-    `);
-    const trigger = el.shadowRoot!.querySelector('.trigger-container') as HTMLElement;
-    setTimeout(() => trigger.click());
-    const showEvent = await oneEvent(el, 'nile-show');
-    assert.ok(showEvent);
-    const afterShow = await oneEvent(el, 'nile-after-show');
-    assert.ok(afterShow);
-  });
-
-  it('emits nile-hide and nile-after-hide events', async () => {
-    const el = await fixture<NileTooltip>(html`
-      <nile-tooltip content="Event test" trigger="click">
-        <button>Click</button>
-      </nile-tooltip>
-    `);
-    const trigger = el.shadowRoot!.querySelector('.trigger-container') as HTMLElement;
-    trigger.click();
-    await waitUntil(() => el.open === true);
-    setTimeout(() => trigger.click());
-    const hideEvent = await oneEvent(el, 'nile-hide');
-    assert.ok(hideEvent);
-    const afterHide = await oneEvent(el, 'nile-after-hide');
-    assert.ok(afterHide);
-  });
-
-  it('defaults to "bottom" placement when given invalid value', async () => {
-    const el = await fixture<NileTooltip>(html`
-      <nile-tooltip content="Fallback" placement=${'invalid' as unknown as NileTooltip['placement']} >
-        <button>Trigger</button>
-      </nile-tooltip>
-    `);
-    await el.updateComplete;
-    assert.equal(el.placement, 'top');
-  });
-
-
-  it('updates hasTooltipSlot on slot change', async () => {
-    const el = await fixture<NileTooltip>(html`
-      <nile-tooltip>
-        <div slot="content">Initial slot</div>
-        <button>Trigger</button>
-      </nile-tooltip>
-    `);
-
-    const slot = el.shadowRoot!.querySelector('slot[name="content"]') as HTMLSlotElement;
-    const newSlotNode = document.createElement('div');
-    newSlotNode.slot = 'content';
-    newSlotNode.textContent = 'Updated slot';
-    el.appendChild(newSlotNode);
-
-    slot.dispatchEvent(new Event('slotchange'));
-    await el.updateComplete;
-
-    assert.isTrue((el as any).hasTooltipSlot);
-  });
-
-  it('respects hoist attribute', async () => {
-    const el = await fixture<NileTooltip>(html`
-      <nile-tooltip hoist content="Hoisted">
-        <button>Hoist</button>
-      </nile-tooltip>
-    `);
-    assert.isTrue(el.hoist);
-  });
-});