fix(number-field): added aria-hidden attribute for inc/dec buttons (#…

…4933) * fix(number-field): added aira-hidden attribute for inc/dec buttons * chore(number-field): removed a test * chore(number-field): added tests
adobe · Nov 20, 2024 · b16a839 · b16a839
1 parent bb53e32
commit b16a839
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 5 deletions.
diff --git a/packages/number-field/src/NumberField.ts b/packages/number-field/src/NumberField.ts
@@ -747,7 +747,7 @@ export class NumberField extends TextfieldBase {
                               inline="end"
                               block="start"
                               class="button step-up"
-                              aria-describedby=${this.helpTextId}
+                              aria-hidden="true"
                               label=${'Increase ' + this.appliedLabel}
                               size=${this.size}
                               tabindex="-1"
@@ -764,7 +764,7 @@ export class NumberField extends TextfieldBase {
                               inline="end"
                               block="end"
                               class="button step-down"
-                              aria-describedby=${this.helpTextId}
+                              aria-hidden="true"
                               label=${'Decrease ' + this.appliedLabel}
                               size=${this.size}
                               tabindex="-1"

diff --git a/packages/number-field/test/number-field.test.ts b/packages/number-field/test/number-field.test.ts
@@ -1753,7 +1753,7 @@ describe('NumberField', () => {
         });
     });
     describe('accessibility model', () => {
-        it('buttons have proper label', async () => {
+        it('increment and decrement buttons cannot receive keyboard focus', async () => {
             await fixture<HTMLDivElement>(html`
                 <div>
                     ${Default({
@@ -1777,15 +1777,15 @@ describe('NumberField', () => {
                     (node) => node.name === 'Increase Enter a number'
                 ),
                 '`name` is the label text'
-            ).to.not.be.null;
+            ).to.be.null;
 
             expect(
                 findAccessibilityNode<NamedNode>(
                     snapshot,
                     (node) => node.name === 'Decrease Enter a number'
                 ),
                 '`name` is the label text'
-            ).to.not.be.null;
+            ).to.be.null;
         });
     });
 });