Open 1Copenut opened 2 years ago
👋 Hey there. This issue hasn't had any activity for 180 days. We'll automatically close it if that trend continues for another week. If you feel this issue is still valid and needs attention please let us know with a comment.
Description
Our
EuiTable
component has a feature to include expanding rows. While testing this as part of the data grid expandable rows discussion #5638, I confirmed an issue @constancecchen noted where clicking a button to expand a row causes it to be removed from the screen reader cursor navigation flow.Steps to reproduce
Expand
button at the end of a rowCtrl + Opt + arrow key
Ctrl + Opt + UP_ARROW
Possible solution example
I mocked up a new direction based on Constance's feedback in the expandable rows discussion. My basic solution does not include React, just semantic HTML and basic CSS and JS to show how we could make expandable content into an accordion-like pattern in a single table cell: https://github.com/1Copenut/vanilla-accessibility-js/tree/main/table-expandable-content
Guidance