Issue Summary

The "Search" input field and the "Search" button in the header section have similar functionality.

Steps to Reproduce

1. Navigate onto the above mentioned page.
2. Navigate onto the "Search" input field and type any character into it.
3. Observe that a search dialog gets opened automatically.
4. Navigate onto the "Search" button now and activate it.
5. Observe that this button also opens a "Search" dialog.

Screen Recording

Screen Recording 2023-08-17 at 4.48.55 PM.mov

Actual Results

There is a "Search" input field in the header section. When any character is typed into this input field, a "Search" dialog gets opened automatically. Input fields are ideally meant for entering a data. It does not usually trigger a change of context. This unusual and non-standard behaviour might confuse the users of assistive technologies. That the input field is triggering a change of context may mislead them.

Expected Results

Input fields should not ideally trigger a change in context. In this scenario, since the "Search" button adjacent to the input field also performs the same function, we would recommend you to hide this input field with CSS display: none for all users.

If this is not possible due to any constrains and you must use this input field, then make sure that this input field is hidden for screen reader users with aria-hidden="true".

For more information, you can refer https://developer.mozilla.org/en-US/docs/Web/CSS/display  and https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-hidden .

Also remove "aria-controls" attribute from the button & input elements.

Workaround

Currently there is no known workaround for this behavior. A workaround will be added here when available

Environment

MacBook Pro (16-inch, 2021)
macOS Monterey Version 12.4
Chrome - Version 103.0.5060.134 (Official Build) (arm64)
Firefox- Version 93.0 (32-bit)
Safari- Version 15.5 (17613.2.7.1.8)
JAWS- Version 2023
NVDA- Version 2023.3
Voiceover - Version Latest