fix(StructuredList): add role attribute to StructuredListRow

[atikenny]

Relates to #4828

Fix the accessibility problem in the StrcuturedListRow.

Changelog

Changed

• added the row role to the StructuredListRow

Testing / Reviewing

Check the accessibility of the component in Storybook using the IBM Able Chrome plugin.

Note

Tried to fix the related issue about the missing role for the label but that invalidates another rule that labels cannot have roles specified.

[github-actions]

DCO Assistant Lite bot All contributors have signed the DCO.

[atikenny]

I have read the DCO document and I hereby sign the DCO.

[netlify]

✔️ Deploy Preview for carbon-elements ready!

🔨 Explore the source changes: 56c75a7

🔍 Inspect the deploy log: https://app.netlify.com/sites/carbon-elements/deploys/60ca5bf4bbf0a200074225f1

😎 Browse the preview: https://deploy-preview-8898--carbon-elements.netlify.app

[netlify]

✔️ Deploy Preview for carbon-components-react ready!
Built without sensitive environment variables

🔨 Explore the source changes: 56c75a7

🔍 Inspect the deploy log: https://app.netlify.com/sites/carbon-components-react/deploys/60ca5bf442a80c000807eab7

😎 Browse the preview: https://deploy-preview-8898--carbon-components-react.netlify.app/iframe

[tay1orjones]

Fix the accessibility problem in the StrcuturedListRow.

@atikenny could you clarify what the specific problem is that this change solves?

StructuredList was updated recently with some accessibility improvements #8172, though I believe they're all behind the v11 flag for now. @dakahn was this addressed as part of it - moving away from the table role to the grid role?

[atikenny]

Fix the accessibility problem in the StrcuturedListRow.

@atikenny could you clarify what the specific problem is that this change solves?

StructuredList was updated recently with some accessibility improvements #8172, though I believe they're all behind the v11 flag for now. @dakahn was this addressed as part of it - moving away from the table role to the grid role?

This PR fixes the original problem with the table role missing a row role in it.

[dakahn]

@tay1orjones we have a total accessibility overhaul behind our feature flags right now yeah. But as for fixing existing problems with v10 StructuredList I'm all for that. I still see 16 errors for role="row" in my Accessibility Checker though 👀

[atikenny]

@tay1orjones we have a total accessibility overhaul behind our feature flags right now yeah. But as for fixing existing problems with v10 StructuredList I'm all for that. I still see 16 errors for role="row" in my Accessibility Checker though 👀

I tried fixing those as well, but unfortunately, I wasn't able to (it used to be 20 problems now it's 16).
The problem is that instead of a table we use a collection of divs and labels. But we would also like to use a label as a row in that table. This is impossible with the table design, but we cannot ditch the label as then we would lose the selection use-case of this component.

[dakahn]

i mean i'm cool with this. It fixes four errors 🏄🏽

[tay1orjones]

Thanks for the input @dakahn!