The tooltip React Carbon component has been tested against the latest W3C Web Content Accessibility Guidelines (WCAG) 2.1 Level A and AA success criteria and violations have been identified as high priority issues. This document will be updated when these accessibility issues are resolved.
- After the tooltip opens, initial focus should be set on the first focusable element in the tooltip. See WAI-ARIA Authoring Practices Modal Dialog Example, Accessibility Features section for best practices on setting focus. Note: This does not apply to the tooltip icon or tooltip defintion components.
- After the tooltip closes, focus should retain the user’s point of regard and return to the element that invoked it. Note: This does not apply to the tooltip icon or tooltip defintion components where focus never leaves the element that invokes it.
- The tooltip component’s focus must not move outside the modal until it is closed. Note: This does not apply to the tooltip icon or tooltip defintion components, as noted above, focus never leaves the element that invokes it.
- The tooltip component has the same accessibility considerations as outlined in the modal component documentation.
- For the tooltip icon and tooltip definition: Be sure the tooltip is
- W3C WAI-ARIA Authoring Practices Tooltip Design Pattern covers the usage of ARIA names, state and roles, as well as the expected keyboard intractions.
- ARIA1: Using the aria-describedby property to provide a descriptive label for user interface controls
- IBM Accessibility Checklist Checkpoint:
Automated, manual and screen reader accessibility verification test has been performed on the tooltip React Carbon component. WCAG 2.1 Level A and AA success criteria issues have been identified and the list of open accessibility violations is available in the Carbon Component GitHub repository.
- Chrome version 77.0.3865.90
- Dynamic Assessment Plugin (DAP) version 22.214.171.124 - IBM Accessibility WCAG 2.1 Sept. 2019 Ruleset
- Carbon React version 7.7.1
- No violations