-
Couldn't load subscription status.
- Fork 861
Open
Labels
Description
Description
To improve the usability of disabled buttons without breaking accessibility, we want to update EUI buttons to use the aria-disabled attribute instead of the native disabled attribute to indicate disabled button states.
aria-disabled will ensure the semantic markup while keeping the button element focusable. This comes with additional manual work though: We need to manually handle unsetting mouse/keyboard events to ensure a similar experience to the native disabled attribute.
Acceptance criteria
This task will implement the base setup for the required changes:
- provide re-useable functionality to apply
aria-disabledoverdisabled - implement a theme feature flag to support rolling out the changes as opt-in "Beta" changes
- update base button components to use the new disabled utility (
EuiButton,EuiButtonEmpty,EuiButtonIconand automatically any other component using these button components)- updates usages of
:disabledCSS selector where needed
- updates usages of
- provide test helpers to ensure we test for both
aria-disabledanddisabledattributes (jest, cypress, enzyme) - update tests for button components using the new test helpers
- test the changes against an example usage in Kibana and Cloud-UI