test(button): add tests for new aria attributes

ithaka · Dec 6, 2023 · 4affa69 · 4affa69
1 parent 6b216fc
commit 4affa69
Showing 1 changed file with 34 additions and 3 deletions.
diff --git a/packages/pharos/src/components/button/pharos-button.test.ts b/packages/pharos/src/components/button/pharos-button.test.ts
@@ -24,10 +24,14 @@ describe('pharos-button', () => {
       await expect(component).to.be.accessible();
     });
 
-    it('is accessible as an icon button', async () => {
-      component.icon = 'download';
-      component.a11yLabel = 'download';
+    it('is renders aria-label on button and is accessible', async () => {
+      const label = 'download';
+      component.icon = label;
+      component.a11yLabel = label;
       await component.updateComplete;
+      await expect(
+        component.renderRoot.querySelector('button')?.getAttribute('aria-label')
+      ).to.equal(label);
       await expect(component).to.be.accessible();
     });
 
@@ -37,6 +41,33 @@ describe('pharos-button', () => {
       await expect(component).to.be.accessible();
     });
 
+    it('is accessible when using aria-disabled', async () => {
+      component.a11yDisabled = 'true';
+      await component.updateComplete;
+      await expect(
+        component.renderRoot.querySelector('button')?.getAttribute('aria-disabled')
+      ).to.equal('true');
+      await expect(component).to.be.accessible();
+    });
+
+    it('is accessible when using aria-expanded', async () => {
+      component.a11yExpanded = 'true';
+      await component.updateComplete;
+      await expect(
+        component.renderRoot.querySelector('button')?.getAttribute('aria-expanded')
+      ).to.equal('true');
+      await expect(component).to.be.accessible();
+    });
+
+    it('is accessible when using aria-haspopup', async () => {
+      component.a11yHaspopup = 'menu';
+      await component.updateComplete;
+      await expect(
+        component.renderRoot.querySelector('button')?.getAttribute('aria-haspopup')
+      ).to.equal('menu');
+      await expect(component).to.be.accessible();
+    });
+
     it('is accessible as the secondary variant', async () => {
       component.variant = 'secondary';
       await component.updateComplete;