diff --git a/test/auro-button.test.js b/test/auro-button.test.js index 68bf597..e741515 100644 --- a/test/auro-button.test.js +++ b/test/auro-button.test.js @@ -5,7 +5,9 @@ /* eslint-disable lit/attribute-value-entities */ /* eslint-disable one-var */ /* eslint-disable no-undef */ -import { fixture, html, expect } from '@open-wc/testing'; +import { fixture, html, expect, elementUpdated } from '@open-wc/testing'; +import { AuroButton } from '../src/auro-button.js'; +import { registerComponent } from '../index.js'; import '../index.js'; describe('auro-button', () => { @@ -30,6 +32,12 @@ describe('auro-button', () => { expect(classList.includes('auro-button')).to.be.true; }); + it('successfully registers custom component', async () => { + registerComponent('test-button'); + + expect(typeof customElements.get('test-button')).to.equal(typeof AuroButton); + }); + it('tests setting autofocus', async () => { const el = await fixture(html` Click Me! @@ -203,4 +211,22 @@ describe('auro-button', () => { await expect(el).to.be.true; }); + + it('toggleText attribute toggles value of iconOnly attribute', async () => { + const el = await fixture(html` + + Primary + + + `); + + await expect(el.iconOnly).to.be.true; + + const mouseoverEvent = new MouseEvent('mouseover', { bubbles: true }); + el.dispatchEvent(mouseoverEvent); + + await elementUpdated(el); + + await expect(el.iconOnly).to.be.false; + }); });