Feedback target page tabs are not keyboard accessible at all 👎🏽

[HRemonen]

It is currently impossible to change tabs using the keyboard only...

2.1.1 (AA) All functionality of the content is operable through a keyboard interface without requiring specific timings for individual keystrokes, except where the underlying function requires input that depends on the path of the user's movement and not just the endpoints. https://www.w3.org/WAI/WCAG21/Understanding/keyboard.html

Screen.Recording.2024-05-22.at.19.37.25.mov

[HRemonen]

This issue also persist for student users.

I have extracted the FeedbackTarget view Tab logic into own component in commit ae64d5d as the TabGroup was using the same Tabs as in RouterTabs. In order to fix the keyboard navigation issues on the RouterTab in commit f1d424e I had to make a change that broke the FeedbackTarget view tabs, hence the extraction in to own component.

Also it is better to work on the TabGroup component on their own separate from the RouterTabs, as it introduces the grouping which is not used in RouterTabs.

The grouping however breaks the native material UI Tabs element semantics as it expects the children to be elements. This I tried to fix quickly but was unable to get the keyboard navigation per ARIA recommendations.