Enhance Tests: button-toggle

Author: margaree

components/button/test/button-toggle.axe.js

@@ -1,6 +1,6 @@
 import '../button-icon.js';
 import '../button-toggle.js';
-import { expect, fixture, html } from '@brightspace-ui/testing';
+import { expect, fixture, focusElem, html } from '@brightspace-ui/testing';
 
 describe('d2l-button-toggle', () => {
 
@@ -23,4 +23,40 @@ describe('d2l-button-toggle', () => {
 		await expect(el).to.be.accessible();
 	});
 
+	it('disabled', async() => {
+		const el = await fixture(html`
+			<d2l-button-toggle>
+				<d2l-button-icon slot="not-pressed" disabled icon="tier1:pin-hollow" text="Unpinned, click to pin."></d2l-button-icon>
+				<d2l-button-icon slot="pressed" disabled icon="tier1:pin-filled" text="Pinned, click to unpin."></d2l-button-icon>
+			</d2l-button-toggle>
+		`);
+		await expect(el).to.be.accessible();
+	});
+
+	describe('focus management', () => {
+
+		it('focused not-pressed button', async() => {
+			const el = await fixture(html`
+				<d2l-button-toggle>
+					<d2l-button-icon slot="not-pressed" icon="tier1:pin-hollow" text="Unpinned, click to pin."></d2l-button-icon>
+					<d2l-button-icon slot="pressed" icon="tier1:pin-filled" text="Pinned, click to unpin."></d2l-button-icon>
+				</d2l-button-toggle>
+			`);
+			await focusElem(el);
+			await expect(el).to.be.accessible();
+		});
+
+		it('focused pressed button', async() => {
+			const el = await fixture(html`
+				<d2l-button-toggle pressed>
+					<d2l-button-icon slot="not-pressed" icon="tier1:pin-hollow" text="Unpinned, click to pin."></d2l-button-icon>
+					<d2l-button-icon slot="pressed" icon="tier1:pin-filled" text="Pinned, click to unpin."></d2l-button-icon>
+				</d2l-button-toggle>
+			`);
+			await focusElem(el);
+			await expect(el).to.be.accessible();
+		});
+
+	});
+
 });

components/button/test/button-toggle.test.js

@@ -92,6 +92,21 @@ describe('d2l-button-toggle', () => {
 			const e = await oneEvent(el, 'd2l-button-toggle-change');
 			expect(e.target.pressed).to.equal(true);
 		});
+
+		it('d2l-button-toggle-before-change event has correct detail structure', async() => {
+			clickElem(el.querySelector('[slot="not-pressed"]'));
+			const e = await oneEvent(el, 'd2l-button-toggle-before-change');
+			expect(e.detail).to.have.property('update').that.is.a('function');
+		});
+	});
+
+	describe('focus', () => {
+
+		it('throws error when no button exists to focus', async() => {
+			const el = await fixture(html`<d2l-button-toggle></d2l-button-toggle>`);
+			expect(() => el.focus()).to.throw('d2l-button-toggle: no button to focus');
+		});
+
 	});
 
 });