diff --git a/docs/resources/changelog.md b/docs/resources/changelog.md index 0536fe8bf..de32286c2 100644 --- a/docs/resources/changelog.md +++ b/docs/resources/changelog.md @@ -13,6 +13,7 @@ _During the beta period, these restrictions may be relaxed in the event of a mis - Added `button--checked` to `` and `control--checked` to `` to style just the checked state [#933](https://github.com/shoelace-style/shoelace/pull/933) - Fixed a bug in `` that prevented the border radius to apply correctly to the header [#934](https://github.com/shoelace-style/shoelace/pull/934) - Improved `` so it renders relative to the current font size and improved padding +- Added tests for `` and `` [#935](https://github.com/shoelace-style/shoelace/pull/935) ## 2.0.0-beta.83 diff --git a/src/components/menu-item/menu-item.test.ts b/src/components/menu-item/menu-item.test.ts new file mode 100644 index 000000000..588ae1a46 --- /dev/null +++ b/src/components/menu-item/menu-item.test.ts @@ -0,0 +1,50 @@ +import { expect, fixture, html, waitUntil, aTimeout } from '@open-wc/testing'; +import sinon from 'sinon'; +import type SlMenuItem from './menu-item'; + +describe('', () => { + it('passes accessibility test', async () => { + const el = await fixture(html` + + Test + + `); + await expect(el).to.be.accessible(); + }); + + it('default properties', async () => { + const el = await fixture(html` Test `); + + expect(el.checked).to.be.false; + expect(el.getAttribute('aria-checked')).to.equal('false'); + expect(el.value).to.equal(''); + expect(el.disabled).to.be.false; + expect(el.getAttribute('aria-disabled')).to.equal('false'); + }); + + it('changes aria attributes', async () => { + const el = await fixture(html` Test `); + + el.checked = true; + await aTimeout(100); + expect(el.getAttribute('aria-checked')).to.equal('true'); + el.disabled = true; + await aTimeout(100); + expect(el.getAttribute('aria-disabled')).to.equal('true'); + }); + + it('get text label', async () => { + const el = await fixture(html` Test `); + expect(el.getTextLabel()).to.equal('Test'); + }); + + it('emit sl-label-change event on label change', async () => { + const el = await fixture(html` Test `); + + const labelChangeHandler = sinon.spy(); + el.textContent = 'New Text'; + el.addEventListener('sl-label-change', labelChangeHandler); + await waitUntil(() => labelChangeHandler.calledOnce); + expect(labelChangeHandler).to.have.been.calledOnce; + }); +}); diff --git a/src/components/menu-label/menu-label.test.ts b/src/components/menu-label/menu-label.test.ts new file mode 100644 index 000000000..fd7d66479 --- /dev/null +++ b/src/components/menu-label/menu-label.test.ts @@ -0,0 +1,9 @@ +import { expect, fixture, html } from '@open-wc/testing'; +import type SlMenuLabel from './menu-label'; + +describe('', () => { + it('passes accessibility test', async () => { + const el = await fixture(html` Test `); + await expect(el).to.be.accessible(); + }); +});