Weird behaviour using screen readers on our table grid

[Febakke]

Description of the bug

• [ ] This issue might be coming from the design system. Will check there as well

We got in a report on some weird behavior on our grid component when using screen reader. (Tested with VoiceOver on multiple browsers)

Chrome

Form mode (tabbing) Seems correct

Element to element (control-option-arrows) Goes wild with column header and reads it out 4 times total.

Also true when just reading the heading

Firefox

Form mode (tabbing) Reads out headers correct

Element to element (control-option-arrows) Reads the column header twice

Edge

Form mode (tabbing) Seems correct

Element to element (control-option-arrows) Goes bananas with the column headers. This is also true when just reading the column header.

Steps To Reproduce

1. Go to a form with a table
2. Try to read it going element to element

Additional Information

Seems like VOiceOver reading double headers is a known issue in Chrome. But we should still try to avvoid it being read 4 times!

[tvs-brreg]

I have identical results using NVDA on Windows

[adamhaeger]

Tested today on chrome and firefox, could not reproduce.

@Febakke and @tvs-brreg could you please test again on the same app running the latest version of frontend and backend, and report if the bug is still present?