Issue Summary

 Missing visual label for the “Find Files“ input field.

Steps to Reproduce

1. Navigate to the “Filter” button and activate it.
2. Navigate to the "Find Files" input field.
3. Inspect the code and observe that no visual label is available.

Screenshot

Actual Results

When a user activates the "Filter" button, the visual label is not available for the “Find Files” input field. As a result, screen reader users might not understand the purpose of the input field effectively.

Expected Results

Provide a unique and descriptive label for the discussed form field using the <label> element. This will help screen reader users understand the purpose of the form field.

If this solution is not feasible, then provide an appropriate aria-label such as "Find Files“.

Note: Before implementing the changes in a label, confirm this with your content design team.

Code snippet

<label for="select">Find Files</label>
<input type="text" autofocus="autofocus" maxlength="1000" id="select" size="30" class="filter-files" placeholder="Find files" style="display: inline-block;">

Workaround

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

Environment

MacBook Pro (16-inch, 2019)
macOs Ventura 13.5.1
Chrome - Version 113.0.5672.63 (Official Build) (x86_64)
Firefox- Version 92.0 (64-bit)
Safari- Version 16.4 (18615.1.26.110.1)
JAWS- Version 2022
NVDA- Version 2021.2
Voiceover - Version Latest