Accessibility: Datagrid2

[Jsims398]

I am currently working on a project that requires tables to be accessible following the wcag 2.1 standards. The current structure of datagrid2 is that each row has a tabindex of -1. This needs to change to be 0 for all rows. It might be nice also to be able to change that when editing the datagrid2 under behavior tab.

[HedwigAR]

Hi! Thanks for your comment, I believe you're referring to the tabindex -1 of each cell? This is part of the roving tabindex, which is how we programatically implemented going through DataGrid 2 with they arrow keys.
The tabindex will be switched to 0 automatically, here's an example of the same kind of system by W3C: https://www.w3.org/WAI/ARIA/apg/patterns/radio/examples/radio/
Let me know if this is what you were referring to or if you meant something different.

[Jsims398]

Different issue

function fixDropdownAriaLabels() {
document
.querySelectorAll('.widget-dropdown-filter-menu[aria-label=""]')
.forEach(el => {
el.setAttribute("aria-label", "Filter options");
el.removeAttribute("aria-labelledby");
});
}

this fixes the broken aria label on datagrid2 drop_downFilter

ARIAUnordered listBroken ARIA reference

[HedwigAR]

Hi! Are you saying that the aria-labelledby attribute on the DataGrid2 dropdown is broken? If it's not then replacing an aria-labelledby with a hardcoded english aria-label wouldn't be a good option for all our users.