-
Bug
-
Resolution: Obsolete
-
Low
-
None
-
4.22.3
-
Severity 2 - Major
-
Issue Summary
The "Search "element in the header section appears and functions like a Combobox but is missing required ARIA role(s) and/or attribute(s).
Tested URL
https://instenv-21072-japp.instenv.internal.atlassian.com/secure/Dashboard.jspa
Steps to Reproduce
- Launch the URL
- In the header section for the page, navigate to the "Search" input field keeping the screen reader on and try to search for something.
Actual Results
The form fields "Search" for all the pages in the header section do not have a form label. The screen reader announces the input field as "Edit text", which does not clearly convey the functionality associated with it. As a result, users with visual impairments who use a screen reader will not be able to understand the purpose of the form fields.
Additionally, the element has a functionality of an autocomplete Combobox and thus has a missing role for Combobox.
Expected Results
Provide a unique and descriptive label for the discussed form field using the 'title" attribute such as "Search". This will help screen reader users to understand the purpose of the form field.
Additionally, the element should have the functionality of a Combobox. Apply the following to make the input Combobox element more accessible:
- A role="combobox" could be added to the <div> element.
- The dropdown menu should announce the label it is associated with.
- For this case, when the users focus to enter the Dropdown menu, it should announce content such as "Search combobox, Search for items on Jira". This will help the assistive technology user to understand the relation between the label and the dropdown menu.
- A working example for accessible Autocomplete Combobox could be found at: https://www.w3.org/WAI/ARIA/apg/example-index/combobox/combobox-autocomplete-list.html
Screenshot
Screen Recording
Screen Recording 2022-05-31 at 11.48.31 AM.mov
Workaround
Currently, there is no known workaround for this behaviour. A workaround will be added here when available.
Bug Ref: 745606
Bulldog Ref:
| Form Name | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
[JSDSERVER-11440] Jira Header : Search Input field type combobox is missing appropriate roles.
| Labels | Original: 4.1.2 Accessibility WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-dev-ready ax-high-priority ax-jsm ax-macos-safari ax-platform-dc ax-qa ax-qa-prioritised ax-vpat-critical ax-windows-chrome ax-windows-firefox | New: 4.1.2 Accessibility WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-critical ax-critical-priority ax-dev-ready ax-high-priority ax-jsm ax-macos-safari ax-platform-dc ax-qa ax-qa-prioritised ax-vpat-critical ax-windows-chrome ax-windows-firefox |
| Labels | Original: 4.1.2 Accessibility WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-dev-ready ax-high-priority ax-jsm ax-macos-safari ax-platform-dc ax-qa-prioritised ax-vpat-critical ax-windows-chrome ax-windows-firefox | New: 4.1.2 Accessibility WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-dev-ready ax-high-priority ax-jsm ax-macos-safari ax-platform-dc ax-qa ax-qa-prioritised ax-vpat-critical ax-windows-chrome ax-windows-firefox |
| Story Points | New: 1 |
| Resolution | New: Obsolete [ 11 ] | |
| Status | Original: In Progress [ 3 ] | New: Closed [ 6 ] |
| Status | Original: Ready for Development [ 10049 ] | New: In Progress [ 3 ] |
| Rank | New: Ranked lower |
| Sprint | New: JSM Sprint 7 [ 7069 ] |
| Assignee | New: Denys Serhiienko [ dserhiienko ] |
| Status | Original: Needs Triage [ 10030 ] | New: Ready for Development [ 10049 ] |
| Labels | Original: 4.1.2 Accessibility WCAG21 ax-at-NVDA ax-bug ax-high-priority ax-jsm ax-platform-dc ax-qa-prioritised ax-vpat-critical | New: 4.1.2 Accessibility WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-dev-ready ax-high-priority ax-jsm ax-macos-safari ax-platform-dc ax-qa-prioritised ax-vpat-critical ax-windows-chrome ax-windows-firefox |