set aria-autocomplete to 'none' on the input element in react-select

openlattice · Sep 23, 2020 · 5eb7251 · 5eb7251
1 parent de70488
commit 5eb7251
Showing 1 changed file with 10 additions and 1 deletion.
diff --git a/src/containers/location/providers/LocationSearchBar.js b/src/containers/location/providers/LocationSearchBar.js
@@ -2,6 +2,7 @@
 
 import React, {
   useCallback,
+  useRef,
   useState
 } from 'react';
 
@@ -70,6 +71,14 @@ const SearchIcon = <FontAwesomeIcon icon={faSearch} fixedWidth />;
 
 const LocationsSearchBar = () => {
 
+  const refInput = useRef(null);
+  if (refInput.current) {
+    const inputElement :HTMLInputElement = refInput.current.querySelector('input');
+    if (inputElement && inputElement.ariaAutoComplete === 'list') {
+      inputElement.setAttribute('aria-autocomplete', 'none');
+    }
+  }
+
   const renderText = useSelector(getRenderTextFn);
   const currentLocationText = renderText(LABELS.CURRENT_LOCATION);
   const optionsFetchState = useSelector((store) => store.getIn([STATE.LOCATIONS, 'options', 'fetchState']));
@@ -129,7 +138,7 @@ const LocationsSearchBar = () => {
   }
 
   return (
-    <Wrapper>
+    <Wrapper ref={refInput}>
       <Select
           aria-label="address"
           components={{ GroupHeading }}