feat(a11y): change role structure to tree/treeitems

AnyRoad / react-json-view-lite

Lightweight Json view component for React

MIT License

161 stars 17 forks source link

feat(a11y): change role structure to tree/treeitems #32

Closed bvandercar-vt closed 1 month ago

bvandercar-vt commented 2 months ago

Fix current a11y failures by changing role structure to tree/treeitems. Change keypress actions to match what should occur on a tree using this example: https://www.w3.org/WAI/ARIA/apg/patterns/treeview/examples/treeview-1a/

[X] Update tests
[X] Manually tested

AnyRoad commented 1 month ago

Hi! Thank you for the PR, I'm not so much familiar with a11y but definitely would like to follow the standards. The only one concern for the PR is performance. Parts like getting button elements with querySelectorAll and setTabbableButton can significantly slow down rendering process.

I've tried component with 300kb JSON and doesn't feel much slower.

Even though I consider such changes to be part of the major version upgrade along with the https://github.com/AnyRoad/react-json-view-lite/issues/20 React 16/17 deprecation.

bvandercar-vt commented 1 month ago

@AnyRoad I don't think you'd ever notice a loss in performance at a human level.

However I did make some changes that would theoretically improve performance slightly: https://github.com/AnyRoad/react-json-view-lite/pull/32/commits/48565801c125ae7d0b483baaaf893b81b91e2cce , https://github.com/AnyRoad/react-json-view-lite/pull/32/commits/37c81f8034d6cb7c7b6f57e7c30b072d2dd6c197