bug: table is not accessible via VoiceOver

[borisdiakur]

Prerequisites

• I know how to contribute a proper bug report.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

Liquid version

5.13.0

Framework bindings

no bindings

Current behavior

The Web Component version of ld-table is not accessible via VoiceOver.

• VoiceOver doesn't find the table when using the find next table command.
• Navigating cells within the table doesn't work using Command+Option+Arrow key combinations.

Expected behavior

The Web Component version of ld-table is accessible via VoiceOver.

• VoiceOver finds the table when using the find next table command.
• Navigating cells within the table works using Command+Option+Arrow key combinations.

Steps to reproduce

1. Navigate to https://liquid.merck.design/liquid/components/ld-table/
2. Start VoiceOver using Command+Fn+F5
3. Press Control+Option+Command+T (find next table)

If Web Component examples are activated, VoiceOver will not find any table. If CSS Components are activated VoiceOver will find the next table.

Also, experiment with Command+Option+Arrow key combinations in the CSS Component table and the Web Component version. You will notice that you can navigate from cell to cell in the "ordinary" table while it doesn't work in the Web Component.

Code reproduction URL

https://liquid.merck.design/liquid/components/ld-table/

Additional information

I think we should change the implementation of the Web Component so that it acts as a wrapper component around a table (effectively consuming a table in a slot), enhancing it with sorting, selection etc. This would be a breaking change though. 😬