SAP / ui5-webcomponents

UI5 Web Components - the enterprise-flavored sugar on top of native APIs! Build SAP Fiori user interfaces with the technology of your choice.
https://sap.github.io/ui5-webcomponents/
Apache License 2.0
1.5k stars 260 forks source link

[a11y][MultiComboBox] - Accessible name for toggle button is not getting announced on click of it for mobile #8060

Closed yoganjan closed 8 months ago

yoganjan commented 8 months ago

Bug Description

For mobile devices, The toggle button which is present in Multi Combo Box is not announcing the accisible name on click of it. It only announces as ticked or unticked .

Affected Component

MultiComboBox

Expected Behaviour

On click of toggle button in multicombobox it should announce the accessible name for toggle button

Isolated Example

No response

Steps to Reproduce

  1. Open https://sap.github.io/ui5-webcomponents-react/?path=/docs/inputs-multicombobox--docs
  2. Change to mobile mode from dev tools
  3. Open narrator
  4. Select the item from drop down which opens the options
  5. Try to click on the toggle button and observe that screen reader not announcing accessible name for toggle button . Only announces ticked or unticked ...

Log Output, Stack Trace or Screenshots

No response

Priority

None

UI5 Web Components Version

1.20.0

Browser

Chrome

Operating System

Iphone

Additional Context

No response

Organization

No response

Declaration

kgogov commented 8 months ago

Hello @yoganjan,

Thank you for reaching out to us. To assist further, could you please watch the short video attached below and confirm if this represents the issue you're encountering? As I understand it, you're saying that when the checkbox is checked or unchecked, the screen reader should announce both this action and the associated item. Have I understood this correctly?

Best regards, Konstantin

https://github.com/SAP/ui5-webcomponents/assets/68374332/9d14fd71-b0ad-44cd-9e18-387abefbf0c6

yoganjan commented 8 months ago

Hi @kgogov ,

Correct . When the checkbox is checked/unchecked the associated label also should get announced so that user get to know which is checked/unchecked

Thanks, Yoganjan

yoganjan commented 8 months ago

Hi @kgogov ,

The original issue is related to toggle button which is present . Proper accessible name is not getting announced for the button.

https://github.com/SAP/ui5-webcomponents/assets/16238780/44541f38-e4aa-4b83-a2f1-6f1217fcf8f9

Thanks, Yoganjan

kgogov commented 8 months ago

Hi @yoganjan,

Thanks for the video. It clearly shows the issue with the toggle button. We'll look into it.

Best, Konstantin

kgogov commented 8 months ago

Hello @SAP/ui5-webcomponents-topic-rl,

It seems there's an issue related to the accessibleName property value not being pronounced on mobile devices. Please refer to the last attached video above. Could you please check this?

Best regards, Konstantin