Issue Description

Missing explicit association for the “Search” input field. The 'for' and 'id' association is missing between the visual label and the form control.

Steps to Reproduce

1. Open the home page.

1. Navigate to the “User” link and activate it.

1. Navigate to the "Serch" input field and observe the screen reader announcement.

Screenshot

Actual Behaviour

The explicit association of the “for” and “id” attribute is missing for the "Search" input field. In case of missing explicit association, the element will not be compatible with screen reader software. Thus it will be difficult for screen reader users to interact with it effectively.

Expected Result

The label for the mentioned field should get announced by the screen reader software when the user navigates through it.

The text “Search” should be explicitly associated with the form control by providing an identical value that is unique from other IDs to the "for" and "id" attribute to ensure that assistive technologies identify the label for the form control correctly.

Code snippet:

<label class="Field__Label-vqybw1-1 ghWQGY" id="Search-uid1-label" for="Search-uid1">Search</label>
(...)
<input id="Search-uid1" data-test="search-filter" name="search" class="css-k60tcv" value="">

Workaround

Not Available

Bug Ref: 359885