-
Bug
-
Resolution: Fixed
-
Low
-
4.22.2
-
Severity 2 - Major
-
Issue Summary
The Input field for IQL search form control is not correctly associated with its visible label either explicitly or implicitly.
Steps to Reproduce
- Launch the URL
- In the header section Navigate to "Insights" and activate the link.
- Select the "Search objects" link from the insights menu.
- In the IQL search section, keeping the screen reader on, Add a search query.
Screenshot
Actual Results
The IQL search input field for the Search Object page does not have a label explicitly associated with it. The 'for' and 'id' association is missing between the label and the form control.
Labels need to be explicitly associated with their respective form controls for assistive technologies to identify the label accurately and convey the information to the users.
Expected Results
Associate the label explicitly with the form control by providing an identical value that is unique from other IDs to "for" and "id" attributes to ensure that assistive technologies identify the label for the form control correctly.
A visible label such as "Search Query” should be provided for the respective input field using the <label> element.
Note: Before implementing any visual label please connect with the content design team to take a suggestion/approval from them per business logic
<label for="search_que">Search Query</label> <textarea id="search_que" name="iql" autocomplete="off" spellcheck="false" data-lpignore="true" placeholder="Name LIKE "John Smith"" class="ruiTestInput js-iql-editor-input" style="height: 35px></textarea>
Refer to the below link for implementation:
https://www.w3.org/WAI/tutorials/forms/labels/
Workaround
Currently, there is no known workaround for this behavior. A workaround will be added here when available.
Bug Ref: 746808
Bulldog Ref:
| Form Name | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|