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.47k stars 254 forks source link

[SF][A11y][ui5-shellbar] Shellbar menu button accessibility #6826

Open ee92 opened 1 year ago

ee92 commented 1 year ago

Bug Description

The shellbar menu button is read by screenreaders as <primary-title>, menu pop up collapsed, button

For SuccessFactors the menu button uses the page title as the primary-title and it can be confusing the the screenreader users because the button has the same purpose but is read differently on different pages.

Affected Component

ui5-shellbar

Expected Behaviour

Our accessibility expert suggests the menu button be labelled by something like Navigation, menu pop up collapsed, <primary-title> currently selected

It may not be the ideal label for every use case, so an additional property can be provided to set the aria-label of the menu button, like menu-button-label

Isolated Example

https://sap.github.io/ui5-webcomponents/playground/components/ShellBar/

Steps to Reproduce

  1. Using a screenreader tab to the menu button
  2. Notice it reads "Corporate Portal, menu pop up collapsed, button"

Log Output, Stack Trace or Screenshots

No response

Priority

None

UI5 Web Components Version

1.11.0

Browser

Chrome

Operating System

No response

Additional Context

SuccessFactors accessibility

Declaration

unazko commented 1 year ago

Hello "@SAP/ui5-webcomponents-topic-p,

The ui5-button announcement in the sample with JAWS 2023 is as follows: "Corporate Portal, button, menu".

Not sure what should be the proper announcement in this case and if aria-labelledby or aria-describedby references could be added via accessibleName/accessibleNameRef APIs, in order to improve the announcements at application side.

Could you please have a look.

Best regards, Boyan