ACM-42794: Ensure typeahead inputs disable browser autocomplete

frontend/packages/react-form-wizard/src/inputs/InputSelect.tsx

@@ -225,10 +225,10 @@ export const InputSelect = ({
           onClick={onInputClick}
           onChange={onTextInputChange}
           onKeyDown={onInputKeyDown}
-          autoComplete="off"
           innerRef={textInputRef}
           placeholder={placeholder}
           isExpanded={open}
+          inputProps={{ autoComplete: 'off' }}
           style={isMultiSelect && Array.isArray(value) && value.length > 0 ? { overflow: 'auto' } : undefined}
         >
           {Array.isArray(value) && (

frontend/src/components/AcmSelectBase.tsx

@@ -232,6 +232,7 @@ export function AcmSelectBase(props: AcmSelectBaseProps) {
   } = props
 
   const resolvedInputProps = {
+    autoComplete: 'off',
     ...inputProps,
     ...(id && { id }),
   }
@@ -722,7 +723,6 @@ export function AcmSelectBase(props: AcmSelectBaseProps) {
               commitTypeaheadInput(event.currentTarget.value)
             }
           }}
-          autoComplete="off"
           innerRef={textInputRef}
           placeholder={placeholder}
           inputId={id}

frontend/src/components/TemplateEditor/controls/__snapshots__/ControlPanelMultiSelect.test.js.snap

@@ -73,7 +73,6 @@ exports[`ControlPanelMultiSelect component renders as expected 1`] = `
               class="pf-v6-c-text-input-group pf-m-plain"
             >
               <div
-                autocomplete="off"
                 class="pf-v6-c-text-input-group__main"
               >
                 <span
@@ -83,6 +82,7 @@ exports[`ControlPanelMultiSelect component renders as expected 1`] = `
                     aria-controls="select-multi-typeahead-listbox"
                     aria-expanded="false"
                     aria-label="Options menu"
+                    autocomplete="off"
                     class="pf-v6-c-text-input-group__text-input"
                     data-testid="multi-controlId"
                     placeholder="None"

frontend/src/components/TemplateEditor/controls/__snapshots__/ControlPanelSingleSelect.test.js.snap

@@ -78,7 +78,6 @@ exports[`ControlPanelSingleSelect component renders as expected 1`] = `
               >
                 <div
                   aria-labelledby="controlId-label"
-                  autocomplete="off"
                   class="pf-v6-c-text-input-group__main"
                 >
                   <span
@@ -88,6 +87,7 @@ exports[`ControlPanelSingleSelect component renders as expected 1`] = `
                       aria-controls="select-multi-typeahead-listbox"
                       aria-expanded="false"
                       aria-label="Type to filter"
+                      autocomplete="off"
                       class="pf-v6-c-text-input-group__text-input"
                       data-testid="select-controlId"
                       id="controlId"

frontend/src/ui-components/AcmSelect/AcmSelect.test.tsx

@@ -71,6 +71,28 @@ describe('AcmSelect', () => {
     expect(getByPlaceholderText('Select one')).toBeInTheDocument()
   })
 
+  test('typeahead variant disables browser autocomplete on the input (ACM-42794)', async () => {
+    const TypeaheadSelect = () => {
+      const [value, setValue] = useState<string>()
+      return (
+        <AcmSelect
+          variant={SelectVariant.typeahead}
+          id="acm-select"
+          label="ACM select"
+          value={value}
+          onChange={setValue}
+          placeholder="Select one"
+        >
+          <SelectOption key="red" value="red">
+            Red
+          </SelectOption>
+        </AcmSelect>
+      )
+    }
+    const { getByPlaceholderText } = render(<TypeaheadSelect />)
+    expect(getByPlaceholderText('Select one')).toHaveAttribute('autocomplete', 'off')
+  })
+
   test('validates required input', async () => {
     const Component = () => {
       const [value, setValue] = useState<string | undefined>(undefined)