-
Bug
-
Resolution: Duplicate
-
Low
-
None
-
4.20.0
-
Severity 3 - Minor
-
Issue Summary
The element is not accessible by keyboard alone and there is no conforming accessible version of the same functionality reachable from the non-conforming page.
Elements name:
- Paragraph, Bold, Italic, Underlined, ..... etc.
Location of the elements: Buttons, in the "Rich text editor", in the "Comments" tab section content, in the main content.
Tested URL
Steps to Reproduce
- Step 1
Actual Results
Actual results
Expected Results
Fix Information
RULE :
The reading and navigation order MUST be logical and intuitive.
HOW TO FIX:
Fix this issue by using JavaScript to ensure the following keyboard interaction:
1.Tab key:
a.Moves focus to the next focusable element inside the dialog.
b.If focus is on the last focusable element inside the dialog, moves focus to the first focusable element inside the dialog.
2.Shift + Tab keys:
a.Moves focus to the previous focusable element inside the dialog.
b.If focus is on the first focusable element inside the dialog, moves focus to the last focusable element inside the dialog.
3.Escape key (best practice): Closes the dialog and returns focus to the triggering element or other logical element if the triggering element no longer exists.
REFERENCE:
Deque University: https://dequeuniversity.com/class/input-methods2/keyboard-input/tab-order
BACKGROUND:
Modal dialogs overlay page content and prevent users from interacting with the content behind the modal dialog until it is dismissed. If sighted keyboard users or screen reader users can tab to content behind a modal dialog window, they may become disoriented or confused. Both keyboard focus and screen reader focus must be trapped within a modal dialog until it is dismissed. When both keyboard focus and browsing are trapped within a modal dialog, screen reader users are able to interact with it as intended.
Screenshot
Screen Recording
screen recording
Workaround
workaround
Bug Ref: 746933
Bulldog Ref:
- is detailed by
-
JSDSERVER-11467 Asset View : Button in the comment section does not have a label and has missing keyboard support.
-
- Ready for Development
-
[JSDSERVER-12073] Asset View : Inaccessible by keyboard and no conforming alternative.
Labels | Original: 2.1.1 Accessibility WCAG21 ax-at-NVDA ax-bug ax-dev-ready ax-high-priority ax-jsm ax-platform-dc ax-qa ax-qa-prioritised ax-vpat-critical | New: 2.1.1 Accessibility WCAG21 ax-at-NVDA ax-bug ax-critical ax-critical-priority ax-dev-ready ax-high-priority ax-jsm ax-platform-dc ax-qa ax-qa-prioritised ax-vpat-critical |
Labels | Original: 2.1.1 Accessibility WCAG21 ax-at-NVDA ax-bug ax-dev-ready ax-high-priority ax-jsm ax-platform-dc ax-qa-prioritised ax-vpat-critical | New: 2.1.1 Accessibility WCAG21 ax-at-NVDA ax-bug ax-dev-ready ax-high-priority ax-jsm ax-platform-dc ax-qa ax-qa-prioritised ax-vpat-critical |
Resolution | New: Duplicate [ 3 ] | |
Status | Original: In Progress [ 3 ] | New: Closed [ 6 ] |
Story Points | New: 1 |
Rank | New: Ranked higher |
Sprint | New: JSM Sprint 1 [ 6985 ] |
Status | Original: Ready for Development [ 10049 ] | New: In Progress [ 3 ] |
Assignee | New: Oleksandr Stoliar [ a955dc6cda19 ] |
Link | New: This issue is detailed by JSDSERVER-11467 [ JSDSERVER-11467 ] |
Status | Original: Needs Triage [ 10030 ] | New: Ready for Development [ 10049 ] |