IgniteUI
Slider accessibility issues
Description
The following accessibility issues are present in the component at the moment:
- it's missing
ariavalue-now -
tab-indexis 1 (it should be 0) - missing accessible name (it needs to be implemented by aria-labelledby
- all of the ARIA attributes are not on the focusable element (the thumb)
There has been no recent activity and this issue has been marked inactive.
![github-actions[bot] avatar](https://avatars.githubusercontent.com/in/15368?v=4 "Published by a pub.dev verified publisher"){kind=small}
@valadzhov , @georgianastasov , why should the tabindex be 1?
Yep, good question. I've missed to look at this initially. It does not make sense to make the value 1. Actually, it is not recommended to set any positive integer value (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
Apologies for the delayed reply, Outlook placed the email in the wrong folder.
@valadzhov , @georgianastasov , why should the tabindex be 1?
Yep, good question. I've missed to look at this initially. It does not make sense to make the value 1. Actually, it is not recommended to set any positive integer value (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
Corrected, should be 0
For the existing igx-thumb-label - that one is equivalent to the aria-valuenow and not needed to be added again as label. In the cases where the labels are overridden (weekdays sample) it's equivalent to the aria-valuetext attribute, so that's not directly usable as a label for the entire slider. That needs to come from elsewhere.
Also see https://www.w3.org/WAI/ARIA/apg/patterns/slider/ The WebComponents' Slider already implements all of these https://github.com/IgniteUI/igniteui-webcomponents/wiki/Slider-Specification#accessibility And implementation: https://igniteui.github.io/igniteui-webcomponents/?path=/story/slider--default