import { expect, fixture, html } from '@open-wc/testing';
import './nile-button';
describe('NileButton', () => {
    // === RENDERING TESTS ===
    it('1. should render without errors', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        expect(el).to.exist;
    });
    it('2. should have a shadow root', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        expect(el.shadowRoot).to.not.be.null;
    });
    it('3. should render a button element by default', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.tagName).to.equal('BUTTON');
    });
    it('4. should render an anchor element when href is set', async () => {
        const el = await fixture(html `<nile-button href="https://example.com"></nile-button>`);
        const anchor = el.shadowRoot.querySelector('.button');
        expect(anchor.tagName).to.equal('A');
    });
    it('5. should render slot content', async () => {
        const el = await fixture(html `<nile-button>Click Me</nile-button>`);
        expect(el.textContent.trim()).to.equal('Click Me');
    });
    it('6. should render prefix slot', async () => {
        const el = await fixture(html `<nile-button><span slot="prefix">P</span>Label</nile-button>`);
        const prefixSlot = el.shadowRoot.querySelector('slot[name="prefix"]');
        expect(prefixSlot).to.exist;
    });
    it('7. should render suffix slot', async () => {
        const el = await fixture(html `<nile-button><span slot="suffix">S</span>Label</nile-button>`);
        const suffixSlot = el.shadowRoot.querySelector('slot[name="suffix"]');
        expect(suffixSlot).to.exist;
    });
    it('8. should render default slot for label', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        const labelSlot = el.shadowRoot.querySelector('slot:not([name])');
        expect(labelSlot).to.exist;
    });
    // === DEFAULT PROPERTIES ===
    it('9. should have variant default to primary', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        expect(el.variant).to.equal('primary');
    });
    it('10. should have size default to medium', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        expect(el.size).to.equal('medium');
    });
    it('11. should have type default to button', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        expect(el.type).to.equal('button');
    });
    it('12. should have disabled default to false', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        expect(el.disabled).to.be.false;
    });
    it('13. should have loading default to false', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        expect(el.loading).to.be.false;
    });
    it('14. should have caret default to false', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        expect(el.caret).to.be.false;
    });
    it('15. should have outline default to false', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        expect(el.outline).to.be.false;
    });
    it('16. should have pill default to false', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        expect(el.pill).to.be.false;
    });
    it('17. should have circle default to false', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        expect(el.circle).to.be.false;
    });
    it('18. should have name default to empty string', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        expect(el.name).to.equal('');
    });
    it('19. should have value default to empty string', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        expect(el.value).to.equal('');
    });
    it('20. should have href default to empty string', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        expect(el.href).to.equal('');
    });
    it('21. should have hideBorder default to false', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        expect(el.hideBorder).to.be.false;
    });
    it('22. should have title default to empty string', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        expect(el.title).to.equal('');
    });
    // === VARIANT TESTS ===
    it('23. should apply primary variant class', async () => {
        const el = await fixture(html `<nile-button variant="primary"></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--primary')).to.be.true;
    });
    it('24. should apply secondary variant class', async () => {
        const el = await fixture(html `<nile-button variant="secondary"></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--secondary')).to.be.true;
    });
    it('25. should apply tertiary variant class', async () => {
        const el = await fixture(html `<nile-button variant="tertiary"></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--tertiary')).to.be.true;
    });
    it('26. should apply caution variant class', async () => {
        const el = await fixture(html `<nile-button variant="caution"></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--caution')).to.be.true;
    });
    it('27. should apply ghost variant class', async () => {
        const el = await fixture(html `<nile-button variant="ghost"></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--ghost')).to.be.true;
    });
    it('28. should apply destructive variant class', async () => {
        const el = await fixture(html `<nile-button variant="destructive"></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--destructive')).to.be.true;
    });
    it('29. should apply secondary-grey variant class', async () => {
        const el = await fixture(html `<nile-button variant="secondary-grey"></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--secondary-grey')).to.be.true;
    });
    it('30. should apply secondary-blue variant class', async () => {
        const el = await fixture(html `<nile-button variant="secondary-blue"></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--secondary-blue')).to.be.true;
    });
    it('31. should reflect variant attribute', async () => {
        const el = await fixture(html `<nile-button variant="caution"></nile-button>`);
        expect(el.getAttribute('variant')).to.equal('caution');
    });
    // === DISABLED STATE ===
    it('32. should be disabled when disabled property is set', async () => {
        const el = await fixture(html `<nile-button disabled></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.hasAttribute('disabled')).to.be.true;
    });
    it('33. should have aria-disabled true when disabled', async () => {
        const el = await fixture(html `<nile-button disabled></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.getAttribute('aria-disabled')).to.equal('true');
    });
    it('34. should have aria-disabled false when not disabled', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.getAttribute('aria-disabled')).to.equal('false');
    });
    it('35. should apply disabled class when disabled', async () => {
        const el = await fixture(html `<nile-button disabled></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--disabled')).to.be.true;
    });
    it('36. should have tabindex -1 when disabled', async () => {
        const el = await fixture(html `<nile-button disabled></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.getAttribute('tabindex')).to.equal('-1');
    });
    it('37. should have tabindex 0 when not disabled', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.getAttribute('tabindex')).to.equal('0');
    });
    it('38. should prevent click events when disabled', async () => {
        const el = await fixture(html `<nile-button disabled></nile-button>`);
        let clicked = false;
        el.addEventListener('click', () => (clicked = true));
        el.click();
        expect(clicked).to.be.false;
    });
    it('39. should reflect disabled attribute', async () => {
        const el = await fixture(html `<nile-button disabled></nile-button>`);
        expect(el.hasAttribute('disabled')).to.be.true;
    });
    // === LOADING STATE ===
    it('40. should show spinner when loading', async () => {
        const el = await fixture(html `<nile-button loading></nile-button>`);
        const spinner = el.shadowRoot.querySelector('nile-spinner');
        expect(spinner).to.exist;
    });
    it('41. should not show spinner when not loading', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        const spinner = el.shadowRoot.querySelector('nile-spinner');
        expect(spinner).to.be.null;
    });
    it('42. should apply loading class when loading', async () => {
        const el = await fixture(html `<nile-button loading></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--loading')).to.be.true;
    });
    it('43. should prevent click when loading', async () => {
        const el = await fixture(html `<nile-button loading></nile-button>`);
        let clicked = false;
        el.addEventListener('click', () => (clicked = true));
        el.click();
        expect(clicked).to.be.false;
    });
    it('44. should reflect loading attribute', async () => {
        const el = await fixture(html `<nile-button loading></nile-button>`);
        expect(el.hasAttribute('loading')).to.be.true;
    });
    // === CARET ===
    it('45. should show caret icon when caret is true', async () => {
        const el = await fixture(html `<nile-button caret></nile-button>`);
        const caret = el.shadowRoot.querySelector('nile-icon[part="caret"]');
        expect(caret).to.exist;
    });
    it('46. should not show caret icon when caret is false', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        const caret = el.shadowRoot.querySelector('nile-icon[part="caret"]');
        expect(caret).to.be.null;
    });
    it('47. should apply caret class when caret is set', async () => {
        const el = await fixture(html `<nile-button caret></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--caret')).to.be.true;
    });
    // === PILL ===
    it('48. should apply pill class when pill is true', async () => {
        const el = await fixture(html `<nile-button pill></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--pill')).to.be.true;
    });
    it('49. should reflect pill attribute', async () => {
        const el = await fixture(html `<nile-button pill></nile-button>`);
        expect(el.hasAttribute('pill')).to.be.true;
    });
    // === CIRCLE ===
    it('50. should apply circle class when circle is true', async () => {
        const el = await fixture(html `<nile-button circle></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--circle')).to.be.true;
    });
    it('51. should reflect circle attribute', async () => {
        const el = await fixture(html `<nile-button circle></nile-button>`);
        expect(el.hasAttribute('circle')).to.be.true;
    });
    // === OUTLINE ===
    it('52. should apply outline class when outline is true', async () => {
        const el = await fixture(html `<nile-button outline></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--outline')).to.be.true;
    });
    it('53. should apply standard class when outline is false', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--standard')).to.be.true;
    });
    // === LINK MODE (href) ===
    it('54. should set href attribute on anchor', async () => {
        const el = await fixture(html `<nile-button href="https://example.com"></nile-button>`);
        const anchor = el.shadowRoot.querySelector('.button');
        expect(anchor.getAttribute('href')).to.equal('https://example.com');
    });
    it('55. should set target on anchor', async () => {
        const el = await fixture(html `<nile-button href="https://example.com" target="_blank"></nile-button>`);
        const anchor = el.shadowRoot.querySelector('.button');
        expect(anchor.getAttribute('target')).to.equal('_blank');
    });
    it('56. should set role=button on anchor', async () => {
        const el = await fixture(html `<nile-button href="https://example.com"></nile-button>`);
        const anchor = el.shadowRoot.querySelector('.button');
        expect(anchor.getAttribute('role')).to.equal('button');
    });
    it('57. should set rel attribute on anchor', async () => {
        const el = await fixture(html `<nile-button href="https://example.com"></nile-button>`);
        const anchor = el.shadowRoot.querySelector('.button');
        expect(anchor.getAttribute('rel')).to.equal('noreferrer noopener');
    });
    it('58. should set download attribute on anchor when provided', async () => {
        const el = await fixture(html `<nile-button href="https://example.com" download="file.pdf"></nile-button>`);
        const anchor = el.shadowRoot.querySelector('.button');
        expect(anchor.getAttribute('download')).to.equal('file.pdf');
    });
    // === BUTTON TYPE ===
    it('59. should set button type attribute', async () => {
        const el = await fixture(html `<nile-button type="submit"></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.getAttribute('type')).to.equal('submit');
    });
    it('60. should support type=reset', async () => {
        const el = await fixture(html `<nile-button type="reset"></nile-button>`);
        expect(el.type).to.equal('reset');
    });
    it('61. should set name attribute on button', async () => {
        const el = await fixture(html `<nile-button name="myButton"></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.getAttribute('name')).to.equal('myButton');
    });
    it('62. should set value attribute on button', async () => {
        const el = await fixture(html `<nile-button value="myValue"></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.getAttribute('value')).to.equal('myValue');
    });
    // === EVENTS ===
    it('63. should emit nile-focus when focused', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        let focusEmitted = false;
        el.addEventListener('nile-focus', () => (focusEmitted = true));
        button.dispatchEvent(new FocusEvent('focus'));
        expect(focusEmitted).to.be.true;
    });
    it('64. should emit nile-blur when blurred', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        let blurEmitted = false;
        el.addEventListener('nile-blur', () => (blurEmitted = true));
        button.dispatchEvent(new FocusEvent('blur'));
        expect(blurEmitted).to.be.true;
    });
    it('65. should emit nile-init on connectedCallback', async () => {
        let initEmitted = false;
        const container = await fixture(html `<div></div>`);
        const el = document.createElement('nile-button');
        el.addEventListener('nile-init', () => (initEmitted = true));
        container.appendChild(el);
        await el.updateComplete;
        expect(initEmitted).to.be.true;
    });
    it('66. should emit nile-destroy on disconnectedCallback', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        let destroyEmitted = false;
        el.addEventListener('nile-destroy', () => (destroyEmitted = true));
        el.remove();
        expect(destroyEmitted).to.be.true;
    });
    // === FOCUS/BLUR METHODS ===
    it('67. should focus programmatically', async () => {
        const el = await fixture(html `<nile-button>Test</nile-button>`);
        el.focus();
        await el.updateComplete;
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--focused')).to.be.true;
    });
    it('68. should blur programmatically', async () => {
        const el = await fixture(html `<nile-button>Test</nile-button>`);
        el.focus();
        await el.updateComplete;
        el.blur();
        await el.updateComplete;
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--focused')).to.be.false;
    });
    it('69. should click programmatically', async () => {
        const el = await fixture(html `<nile-button>Test</nile-button>`);
        let clicked = false;
        el.addEventListener('click', () => (clicked = true));
        el.click();
        expect(clicked).to.be.true;
    });
    // === VALIDATION ===
    it('70. should set custom validation message', async () => {
        const el = await fixture(html `<nile-button type="submit"></nile-button>`);
        const form = document.createElement('form');
        form.appendChild(el);
        document.body.appendChild(form);
        el.setCustomValidity('Invalid');
        expect(el.validationMessage).to.equal('Invalid');
        el.setCustomValidity('');
        expect(el.validationMessage).to.equal('');
        document.body.removeChild(form);
    });
    it('71. should check validity', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        expect(el.checkValidity()).to.be.true;
    });
    it('72. should report validity', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        expect(el.reportValidity()).to.be.true;
    });
    it('73. should get validity state', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        expect(el.validity).to.exist;
        expect(el.validity.valid).to.be.true;
    });
    // === FORM INTEGRATION ===
    it('74. should return null getForm when not in a form', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        expect(el.getForm()).to.be.null;
    });
    it('75. should set formAction property', async () => {
        const el = await fixture(html `<nile-button formaction="/submit"></nile-button>`);
        expect(el.formAction).to.equal('/submit');
    });
    it('76. should set formMethod property', async () => {
        const el = await fixture(html `<nile-button formmethod="post"></nile-button>`);
        expect(el.formMethod).to.equal('post');
    });
    it('77. should set formNoValidate property', async () => {
        const el = await fixture(html `<nile-button formnovalidate></nile-button>`);
        expect(el.formNoValidate).to.be.true;
    });
    it('78. should set formTarget property', async () => {
        const el = await fixture(html `<nile-button formtarget="_blank"></nile-button>`);
        expect(el.formTarget).to.equal('_blank');
    });
    it('79. should set formEnctype property', async () => {
        const el = await fixture(html `<nile-button formenctype="multipart/form-data"></nile-button>`);
        expect(el.formEnctype).to.equal('multipart/form-data');
    });
    // === HIDE BORDER ===
    it('80. should apply hideborder class when hide-border is set', async () => {
        const el = await fixture(html `<nile-button hide-border></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--hideborder')).to.be.true;
    });
    it('81. should reflect hide-border attribute', async () => {
        const el = await fixture(html `<nile-button hide-border></nile-button>`);
        expect(el.hasAttribute('hide-border')).to.be.true;
    });
    // === TITLE ===
    it('82. should set title on internal button', async () => {
        const el = await fixture(html `<nile-button title="My Title"></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.getAttribute('title')).to.equal('My Title');
    });
    // === DYNAMIC PROPERTY CHANGES ===
    it('83. should update variant dynamically', async () => {
        const el = await fixture(html `<nile-button variant="primary"></nile-button>`);
        el.variant = 'secondary';
        await el.updateComplete;
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--secondary')).to.be.true;
    });
    it('84. should update disabled dynamically', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        el.disabled = true;
        await el.updateComplete;
        const button = el.shadowRoot.querySelector('.button');
        expect(button.hasAttribute('disabled')).to.be.true;
    });
    it('85. should update loading dynamically', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        el.loading = true;
        await el.updateComplete;
        const spinner = el.shadowRoot.querySelector('nile-spinner');
        expect(spinner).to.exist;
    });
    it('86. should update caret dynamically', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        el.caret = true;
        await el.updateComplete;
        const caret = el.shadowRoot.querySelector('nile-icon[part="caret"]');
        expect(caret).to.exist;
    });
    it('87. should update pill dynamically', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        el.pill = true;
        await el.updateComplete;
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--pill')).to.be.true;
    });
    it('88. should update circle dynamically', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        el.circle = true;
        await el.updateComplete;
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--circle')).to.be.true;
    });
    it('89. should update outline dynamically', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        el.outline = true;
        await el.updateComplete;
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--outline')).to.be.true;
    });
    it('90. should switch from button to anchor when href is set dynamically', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        el.href = 'https://example.com';
        await el.updateComplete;
        const anchor = el.shadowRoot.querySelector('.button');
        expect(anchor.tagName).to.equal('A');
    });
    // === CSS PARTS ===
    it('91. should have base part on button', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        const button = el.shadowRoot.querySelector('[part~="base"]');
        expect(button).to.exist;
    });
    it('92. should have prefix part', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        const prefix = el.shadowRoot.querySelector('[part~="prefix"]');
        expect(prefix).to.exist;
    });
    it('93. should have label part', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        const label = el.shadowRoot.querySelector('[part~="label"]');
        expect(label).to.exist;
    });
    it('94. should have suffix part', async () => {
        const el = await fixture(html `<nile-button></nile-button>`);
        const suffix = el.shadowRoot.querySelector('[part~="suffix"]');
        expect(suffix).to.exist;
    });
    it('95. should have caret part when caret is set', async () => {
        const el = await fixture(html `<nile-button caret></nile-button>`);
        const caret = el.shadowRoot.querySelector('[part~="caret"]');
        expect(caret).to.exist;
    });
    // === COMBINED STATES ===
    it('96. should handle disabled and loading together', async () => {
        const el = await fixture(html `<nile-button disabled loading></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--disabled')).to.be.true;
        expect(button.classList.contains('button--loading')).to.be.true;
    });
    it('97. should handle pill and outline together', async () => {
        const el = await fixture(html `<nile-button pill outline></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--pill')).to.be.true;
        expect(button.classList.contains('button--outline')).to.be.true;
    });
    it('98. should show caret on link button', async () => {
        const el = await fixture(html `<nile-button href="https://example.com" caret></nile-button>`);
        const caret = el.shadowRoot.querySelector('nile-icon[part="caret"]');
        expect(caret).to.exist;
    });
    it('99. should show spinner on link button when loading', async () => {
        const el = await fixture(html `<nile-button href="https://example.com" loading></nile-button>`);
        const spinner = el.shadowRoot.querySelector('nile-spinner');
        expect(spinner).to.exist;
    });
    it('100. should handle all visual modifiers simultaneously', async () => {
        const el = await fixture(html `<nile-button variant="destructive" pill outline caret loading disabled></nile-button>`);
        const button = el.shadowRoot.querySelector('.button');
        expect(button.classList.contains('button--destructive')).to.be.true;
        expect(button.classList.contains('button--pill')).to.be.true;
        expect(button.classList.contains('button--outline')).to.be.true;
        expect(button.classList.contains('button--caret')).to.be.true;
        expect(button.classList.contains('button--loading')).to.be.true;
        expect(button.classList.contains('button--disabled')).to.be.true;
    });
});
//# sourceMappingURL=nile-button.test.js.map