[A11y][ui5-list]: Checkbox accessible names are not unique and do no match label

[caroline-ferri]

Bug Description

This issue has previously been brought up in #6861

For a list that has select mode set to multiple the checkboxes accessible names are not unique and do not match the physical labels on the list. This is in violation of ACC264.3

Affected Component

UI5-List

Expected Behaviour

When using AT like JAWS we expect the checkboxes to be announced with unique accessible names. Additionally, these names should match the visual label used to label the checkbox.

Isolated Example

https://sap.github.io/ui5-webcomponents-react/v2/?path=/docs/data-display-list--docs

Steps to Reproduce

1. Using JAWS navigate to https://sap.github.io/ui5-webcomponents-react/v2/?path=/docs/data-display-list--docs
2. set selection mode to "Multiple"
3. tab to the list items
4. notice that announcement for the checkboxes lack description and clarity
   ...

Log Output, Stack Trace or Screenshots

No response

Priority

None

UI5 Web Components Version

latest

Browser

Chrome

Operating System

Mac OS

Additional Context

This issue has already been discussed in #6861 which has been closed. However, important information has been added to the issue since it has been closed. Hence, I am opening this issue. Please refer to original issue's conversation for additional context which is pertinent to the issue at hand.

Organization

No response

Declaration

• I’m not disclosing any internal or sensitive information.

[petyabegovska]

Hello @yanaminkova, @dobrinyonkov,

Please check the latest two comments from @judith9209 in the linked issue: #6861 and provide your advice.

Best regards,
Petya

[caroline-ferri]

@petyabegovska as an addition to this issue, I want to note that this issue also persists for radio buttons in a ui5-list. When we set selection mode to "Single Start" and use the JAWS key combo "INSERT + CNTRL + A" a list on identical names are provided for both radio buttons and checkboxes. This is still occurring in latest version (2.9.0). See image below for identical radio button names.

[nikolay-kolarov]

Hello @caroline-ferri,

As communicated by @yanaminkova in #6861 (comment) this is the actual guidance and feedback that we received after the discussions with UX and Acc teams.

According to the design requirements, if you want this to be changed and further checked, this item needs to go through the InnerSource process. Please submit a feature request to the SAP Design System via the InnerSource process and share the E1 reference number here. Thanks!

Let me know if you have any questions!

@judith9209 - FYI

Best regards,
Nikolay

[judith9209]

These are the inner source tickets, complains from big customers are linked:
FIORITECHE1-8933
FIORITECHP1-33005
WCAG has confirmed validity with w3c/wcag#4190 and even than your designers set this to obsolete. This is so frustrating and I am disappointed that such issues are still not acknowledged from UI5.

[nikolay-kolarov]

Hello @judith9209,

Thanks for linking the items. As said, we had intense and detailed discussions and this is what we got as guidance from UX and the Acc teams. It is not about acknowledging this from UI5 side, but about receiving guidance and specs in case this needs to be changed.

Best Regards,
Nikolay