[ToolbarButton]: a11y nvda screen reader does not announce label correctly
@unazko is already working on this.
Since Jan 16, 2025.
- Dominant language
- TypeScript
- Stars
- 1.8k
- Forks
- 285
- Avg merge
- 3d 2h
- Merged PRs (30d)
- 59
Description
Bug Description
https://sap.github.io/ui5-webcomponents/components/ToolbarButton/
upon pressing Enter on the icon, If accessibleName attribute is provided, nvda announces it twice. first, the value of accessibleName and then default value "Exit Full Screen" which is confusing to the user.
<ToolbarButton
key="exitFullScreen"
data-testid="exit-full-screen"
icon={"exit-full-screen"}
design={ButtonDesign.Transparent}
onClick={handleExitFullscreenButtonClick}
ref={exitFullscreenBtnRef}
accessibleName="Exit Full Screen"
/>
Also if you tab to the icon it announces: "Exit Full Screen button"
When you press Enter it announces: "Exit Full Screen"
Affected Component
ToolbarButton
Expected Behaviour
When accessibleName attribute has value, nvda should not announce the default value e.g. "Exit Full Screen". Also when user presses Enter on the icon announce 'button' as well after the text.
Correct behavior is already observed in SAP UI5 here:
https://sapui5.hana.ondemand.com/#/entity/sap.f.FlexibleColumnLayout/sample/sap.f.sample.FlexibleColumnLayoutWithTwoColumnStart
Also if accessibleName is not used nvda should announce the default button name on tabbing. It could be the same it shows on pressing Enter
Isolated Example
No response
Steps to Reproduce
...
Log Output, Stack Trace or Screenshots
Priority
Medium
UI5 Web Components Version
2.x
Browser
Chrome
Operating System
No response
Additional Context
No response
Organization
No response
Declaration
- I’m not disclosing any internal or sensitive information.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Assessment
This issue has not been assessed yet.