Details
-
Bug
-
Resolution: Fixed
-
Low
-
9.7.0
-
9.07
-
Severity 3 - Minor
-
Description
Issue Summary
Missing keyboard support for the "Board name", "Administrators", "Saved Filter" and "Kanban board sub-filter" input fields. Currently, this element is executable with a mouse only.
Note- Similar issue has been observed on the "Backlog" page for the search input fields. Please refer to screenshot 2.
Steps to Reproduce
- Navigate to the “Boards” menu pop-up link and activate it.
- Navigate to the “Configure” link and activate it.
- Try to access mentioned interactive element with the Keyboard.
- Observe it is missing keyboard support.
Screenshot 1
Screenshot 2
Actual Result
When the user tries to navigate to the mentioned input fields using the keyboard it was not possible. This is because the mentioned element is lacking <button> markup or role=”button”.
If an interactive element is missing a role or has an incorrect aria-attribute then it becomes incompatible with the screen reader. As a result, screen readers and keyboard-only users will miss out on important functionality associated with it.
Expected Result
The mentioned input fields should receive keyboard support when the user navigates through them using the TAB key.
For this interactive element should be coded as a button with type=” button” or role=”button”. Also, it should announce an accessible name for this button via aria-label attribute as associated input fields
Note: If using role="button" instead of the semantic <button> or <input type="button"> elements, you will need to make the element focusable and define event handlers for click and keydown events. This includes handling the Enter and Space keypresses in order to process all forms of user input.
Code snippet 1: Using <button>
<button aria-label="board name edit field" id="ghx-field-viewname" class="ghx-editable">(..)</button>
Code snippet 2: Using role=”button”
<span role="button" aria-label="board name edit field" id="ghx-field-viewname" class="ghx-editable">KAB board</span>
Workaround
Currently, there is no known workaround for this behaviour. A workaround will be added here when available
Environment
MacBook Pro (14-inch, 2021)
macOs Ventura 13.2.1
Chrome - Version 110.0.5481.100 (Official Build) (64-bit)
Firefox- Version 92.0 (64-bit)
Safari- Version 16.2 (18614.3.7.1.5)
JAWS- Version 2021
NVDA- Version 2021.2
Voiceover - Version Latest