fix(input-field): ensure aria-controls get ids of both helper text …

…& portal
Lundalogik · Apr 4, 2024 · 26d26ac · 26d26ac
1 parent c29a64f
commit 26d26ac
Showing 1 changed file with 15 additions and 1 deletion.
diff --git a/src/components/input-field/input-field.tsx b/src/components/input-field/input-field.tsx
@@ -299,11 +299,25 @@ export class InputField {
         properties.readonly = this.readonly;
         properties.disabled = this.disabled || this.readonly;
 
+        let ariaControls = '';
+
         if (this.hasHelperText()) {
-            properties['aria-controls'] = this.helperTextId;
+            ariaControls += this.helperTextId;
             properties['aria-describedby'] = this.helperTextId;
         }
 
+        if (this.renderAutocompleteList()) {
+            if (ariaControls) {
+                ariaControls += ' ';
+            }
+
+            ariaControls += this.portalId;
+        }
+
+        if (ariaControls) {
+            properties['aria-controls'] = ariaControls;
+        }
+
         return [
             <label class={this.getContainerClassList()}>
                 <span class="mdc-notched-outline" tabindex="-1">