Various more intricate controls have serious accessibility issues
#31,012 opened on 2021年6月16日
説明
- I have searched the issues of this repository and believe that this is not a duplicate.
Reproduction link
https://ant.design/components/tree/
Steps to reproduce
This is just one of many broken components, but it's a very representative one. Try using the keyboard to navigate the treeview on this page, with a screenreader loaded. Notice how the screenreader does not announce anything whatsoever.
What is expected?
The screenreader should be aware of where the user is in the treeview, if the current node is collapsed or expanded. The treeview should be using the correct ARIA markup to make this possible.
What is actually happening?
Nothing whatsoever. None of the elements within the tree have a proper role, this is extremely non-standard HTML and breaks every WCAG audit in the book. Any interface that uses these components will get disabled people fired because of how bad this currently is.
| Environment | Info |
|---|---|
| antd | 4.16.3 |
| React | latest |
| System | windows 10 build 2004 |
| Browser | Chrome Canary, Firefox , it really doesn't matterhttps://ant.design/components/tree/ |
The main issue here is that divs were augmented with JavaScript to emulate a treeview rather than actually using a treeview. There's plenty of examples that do this better, e.g.: https://www.npmjs.com/package/react-accessible-treeview https://morioh.com/p/98b506190f6d (first example)
Please do better. People who want to do better accessibility-wise and want to rely on your UI library are getting hit by this, and as a result, so are their users.