-
Bug
-
Resolution: Fixed
-
Low
-
10.3.0
-
Severity 3 - Minor
-
Issue Summary
The focus indicator of the mentioned buttons has an insufficient color contrast ratio.
Steps to Reproduce
- Open "JSM System Dashboard" page.
- Navigate to the "Projects" in the header section and choose any ITSM project from the options.
- Navigate to the "Raise a request" link in the side navigation and activate it.
- Navigate to the "Requests" button and select "All the request" option.
- Navigate and activate any request.
- Navigate to the "Escalate", "Resolve this issue" and "Cancel request" buttons and activate them.
- Navigate using 'Tab' key to the mentioned buttons in the modal dialogs.
- Observe that the focus indicator of the mentioned buttons has an insufficient color contrast.
Screenshot 1
Screenshot 2
Screenshot 3
Actual Results
The #388BFF focus indicator of “Escalate", "Resolve this issue" and "Cancel request" buttons present in the modal dialogs available after activating the “Escalate", "Resolve this issue" and "Cancel request" buttons respectively in the main content area has an insufficient color contrast ratio of 2:1 with #0055CC inner background.
Foreground: #388BFF
Background: #0055CC
Contrast ratio: 2:1
This will make it difficult for the people with low vision and color blindness to identify the focus indicator for the buttons that have insufficient color contrast.
Expected Results
The contrast ratio between the foreground color of the focus indicator and its inner background color should be sufficient. Ensure that the color contrast ratio of the focus indicator for all user interface controls is 3:1 with the foreground and background color.
Alternatively, set the CSS outline-offset property for the mentioned buttons to ensure that clear focus indication is available for users.
Workaround
Currently there is no known workaround for this behavior. A workaround will be added here when available.
Environment
MacBook Pro (16-inch, 2021)
macOs Sonoma 14.7
Chrome - Version 131.0.6778.86 (Official Build) (arm64)
Firefox- Version 92.0 (64-bit)
Safari- Version 17.0 (19616.1.27.211.1)
JAWS- Version 2023
NVDA- Version 2021.2
Voiceover - Version Latest
| Form Name | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
[JSDSERVER-15824] Help Center | View request: Insufficient color contrast for focus indicators of user interface controls.
| Resolution | New: Fixed [ 1 ] | |
| Status | Original: Waiting for Release [ 12075 ] | New: Closed [ 6 ] |
| Fix Version/s | Original: 10.6.1 [ 111293 ] | |
| Fix Version/s | New: 10.6.0 [ 110418 ] |
| Remote Link | New: This issue links to "A11Y-613 (JIRA Server (Bulldog))" [ 1009878 ] |
| Fix Version/s | New: 10.6.1 [ 111293 ] |
| Status | Original: In Progress [ 3 ] | New: Waiting for Release [ 12075 ] |
| Status | Original: Short Term Backlog [ 12074 ] | New: In Progress [ 3 ] |
| Assignee | New: Bohdan Hulovatyi [ 0e35c5b225a8 ] |
| Remote Link | Original: This issue links to "A11Y-598 (Bulldog)" [ 984505 ] | New: This issue links to "A11Y-598 (JIRA Server (Bulldog))" [ 984505 ] |
| Remote Link | New: This issue links to "A11Y-598 (Bulldog)" [ 984505 ] |
Closed by https://bulldog.internal.atlassian.com/browse/A11Y-598