fix(LocaleSelector): Set aria-controls only when selector is open.

opentripplanner · Apr 19, 2023 · d90893a · d90893a
1 parent 603f12e
commit d90893a
Showing 1 changed file with 4 additions and 2 deletions.
diff --git a/lib/components/util/dropdown.tsx b/lib/components/util/dropdown.tsx
@@ -158,7 +158,9 @@ const Dropdown = ({
       style={{ float: pullRight ? 'right' : 'left' }}
     >
       <DropdownButton
-        aria-controls={id}
+        // Only set aria-controls when the dropdown is open
+        // (otherwise, assistive technologies may not announce the dropdown correctly).
+        aria-controls={open ? id : undefined}
         aria-expanded={open}
         aria-haspopup="listbox"
         aria-label={label}
@@ -175,7 +177,7 @@ const Dropdown = ({
       {open && (
         <DropdownMenu
           aria-label={listLabel}
-          aria-labelledby={listLabel ? '' : `${id}-label`}
+          aria-labelledby={listLabel ? undefined : `${id}-label`}
           id={id}
           onClick={toggleOpen}
           role="list"