Lacking/unclear accessibility support in DataGrid

[Jon]

Hi.

We are using the grid as a base in two table components in our design system but has encountered som problems with meeting accessibility standards. It could be that we have not found the right way to adapt the component but in some cases we think that the problems comes from a lack of accessibility support in the grid.

Here are some of the things we have encountered:

• The table/grid is actually 2 tables, one with just header cells and one with just data cells.
  • Why not just have one table? It's a confusing and none valid HTML structure...
  • Here is how W3C has solved for example a sortable grid:
    https://www.w3.org/TR/wai-aria-practices/examples/grid/dataGrids.html#ex2_label
    
• Is there a way to set the caption for the table(s)?
  • The captions right now are something like "sfgridshhz5thuna2_header_table" and says nothing about the content of the tables. And they are completely hidden for screen readers with "display: none;"
• The "aria-sort" attribute on the column header does not change value when sorting the data , so there is no way for users with screen readers to know that anything has been done.
• Can the aria-labels for the data cells adapt to the language of the site somehow?
  • Right now we get our values in swedish but the "column header" text remains in english so we get a mixture of languages in the same string.
• The arrow that expands data in the Hierarchy DataGrid is just an empty div, it needs some sort of text for users with screen readers.
• It must also be clear for users with screen readers that the expanded section is on the next row, this is only visually obvious, not codewise.
  

Have you done some sort of user testing with visually impared users with this component?

[Renjith Singh Rajendran]

Hi Jon,

Greetings from Syncfusion support.

We are validating the reported problem from our side. We will update you further details within two business days. Until then we appreciate your patience.

Regards,

Renjith R

[Renjith Singh Rajendran]

Hi Jon,

Query 1 : The table/grid is actually 2 tables,

This is our default architecture of Grid. As we have inbuilt support for virtualscrolling and frozen design implementation, it is necessary to follow this architecture.

Query 2 & 3 & 4 & 5:

We have considered all the other queries related to accessibility as an usability improvement and logged an improvement task for the same. We have planned to implement this feature in our upcoming Volume 2, 2022 SP1 release. You can now track the current status of your request, review the proposed resolution timeline, and contact us for any further inquiries through the below link. Please follow up on the below link for future updates regarding this feature.

https://www.syncfusion.com/feedback/34987/need-to-provide-the-accessibilty-support-in-grid

Regards,

Renjith R

[Jon]

Hi Renjith.

Query 1:

That's too bad because it means that we have to replace the component in the main part of our organisation. You have not considered separate HTML rendering when activating "virtualscrolling" or "frozen design"? 

This could otherwise become a problem on the european market in the long run due to the upcoming European accessibility act.

Query 2 & 3 & 4 & 5:

Great! We will keep a lookout for the upcoming features.

Regards,

Jon

[Renjith Singh Rajendran]

Hi Jon,

Thanks for your update.

As informed in our previous update, we support inbuilt virtualscrolling and frozen design in grid. We will be supporting both grid content and header scrolling. So, for the calculations involved with virtual scrolling and content rendering, it is required to follow the two table structure.

If we try to enable this two table structure only if we enable the features in grid, then this kind of architecture will raise complexities and increase the component weightage. So it is difficult and complex to consider rendering this two table structure only when enabling the corresponding features.

As we are supporting the mentioned features it is required for us to have two table structure. But at the same time, we won’t compromise on web standards. So if you face any difficulties or issues related to this two table structure, then kindly share with us the details for us to further analyze the scenario.

Regards,                                                                                                                                       

Renjith R

[Jon]

Hi Renjith.

Thank you for clarifying why you need to keep the structure. And sorry for not replying until now. We will keep a lookout for the upcoming changes that you can do to the Grid component.

Have a nice day!

Regards,

Jon

[Naveen Palanivel]

Hi Jon,

We are glad to announce that, we have included fix for the usability improvement “Need to provide the accessibilty support in grid” in our release(20.2.0.43).  So please upgrade to our latest version of Syncfusion NuGet package to resolve the reported issue. Please find the Nuget package for latest fixes and features from below.

Nuget : https://www.nuget.org/packages/Syncfusion.Blazor.Grid

We thank you for your support and appreciate your patience in waiting for this release. Please get in touch with us if you need any further assistance. 

   

Regards,            

Naveen Palanivel

[Jon]

Hi Naveen.

Great, thank you for the information! I will let the team know that an update is available.

Ha a nice day!

Regards,

Jon

[Naveen Palanivel]

Hi Jon,

Welcome

We will wait to hear from you for the future query.

Please get back to us if you need further assistance.

Regards,

Naveen Palanivel.