Issue Summary

On repositories page, the date inputs present under "Last changed" filter are not Accessible for screen reader users.

Steps to Reproduce

1. Navigate to the BitBucket homepage.
2. Navigate to "Administration" link in header section & activate it.
3. Navigate to "Repositories" link in the sidebar & activate it.
4. Navigate to the "Last changed" popup button & activate it.
5. Navigate to "From" & "To" input field to access the calendar component.

Actual Results

While navigating with Keyboard & screen reader following issues were observed for calendar component.

• Labels such as "From" & "To" are not announced when the input fields receives keyboard focus.
• Format of the date is not provided on the page.

This makes screen reader & Keyboard users difficult to access the Calendar component effectively.

Expected Results

The Calendar component should be accessible for keyboard as well as screen reader users.

Apply following fixes.

• Associate the labels such as "From" & "To" with respective <input> elements via for/id attributes.
• Provide the correct format of the date for the users to understand on the page. For Example : DD/MM/YYYY

Please refer to following page to understand more on Calendar component accessibility.

https://hello.atlassian.net/wiki/spaces/A11Y/pages/1527386018/Datepickers

Screenshot

Screen Recording

Screen Recording 2022-04-28 at 3.12.39 PM.mov

Workaround

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

Bug Ref: 741941