TreeGrid RovingTabIndex doesn't allow tabIndex to be changed from outside the component #48337
Labels
[Feature] List View
Menu item in the top toolbar to select blocks from a list of links.
[Focus] Accessibility (a11y)
Changes that impact accessibility and need corresponding review (e.g. markup changes).
The problem
While working on improvements to the List View accessibility in #45135, an issue was encountered surrounding odd focusing behaviour in the List View. The List View incorporates roving tab index behaviour (via TreeGrid) that sets the taxIndex to the last focused element. This way, if a user tabs between the List View and other elements of the editor, they will find their way back to the element they were last working on.
However, if a user navigates to the editor canvas and changes which block is currently selected, when they tab back to the List View they will likely expect to land on the currently selected block within the List View. With the current behaviour, this doesn't happen. Instead of the currently selected block receiving focus, the tabIndex is still set on the last block within the list view that had focus.
Desired fix
To fix this, it would be good for the roving tab index within the tree grid to be able to be controlled or updated in some way from outside of the component. For example, if the user changes the selection within the editor canvas, then the tabIndex within the list view should probably be updated so that the currently selected block is the one with tabIndex set. This might require refactoring how the roving tab index works.
Kudos @alexstine for figuring out the cause of the issue.
The text was updated successfully, but these errors were encountered: