fix(icon): update a11yHidden false logic

ithaka · Dec 8, 2023 · 75e4c75 · 75e4c75
1 parent df421ca
commit 75e4c75
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 11 deletions.
diff --git a/packages/pharos/src/components/icon/pharos-icon.test.ts b/packages/pharos/src/components/icon/pharos-icon.test.ts
@@ -39,7 +39,7 @@ describe('pharos-icon', () => {
     expect(svg?.getAttribute('width')).to.equal('16');
   });
 
-  it('sets the svg aria-hidden property when a11y-hidden is set to true', async () => {
+  it('sets the svg aria-hidden property when a11y-hidden is set', async () => {
     component.a11yHidden = 'true';
     await component.updateComplete;
     const svg = component.renderRoot.querySelector('svg');
@@ -66,15 +66,6 @@ describe('pharos-icon', () => {
     expect(svg?.getAttribute('aria-hidden')).not.to.exist;
   });
 
-  it('does not add an aria-hidden attribute when a11y-hidden is set to false', async () => {
-    const labelText = 'This is a test title';
-    component.a11yTitle = labelText;
-    component.a11yHidden = 'false';
-    await component.updateComplete;
-    const svg = component.renderRoot.querySelector('svg');
-    expect(svg?.getAttribute('aria-hidden')).not.to.exist;
-  });
-
   it('sets the svg title properly when a11y-title is set', async () => {
     const labelText = 'This is a test title';
     component.a11yTitle = labelText;

diff --git a/packages/pharos/src/components/icon/pharos-icon.ts b/packages/pharos/src/components/icon/pharos-icon.ts
@@ -85,8 +85,11 @@ export class PharosIcon extends PharosElement {
   protected override render(): TemplateResult {
     const size = this._getIconSize();
     const accessibilityLabel = this.a11yTitle || this.description;
+    let hideIcon = this.a11yHidden;
     // Check accessibilityLabel length for backwards compatibility until description is removed
-    const hideIcon = this.a11yHidden === 'true' || accessibilityLabel === '';
+    if (hideIcon !== 'true' && accessibilityLabel.length === 0) {
+      hideIcon = 'true';
+    }
     return html`
       <svg
         xmlns="http://www.w3.org/2000/svg"