search

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.56k stars 267 forks source link

ui5-messagestrip close button aria label reads "Decline" instead of "Close" #5386

Closed ee92 closed 2 years ago

ee92 commented 2 years ago

Bug Description

The close button of the message strip reads "Decline" instead of "Close" which can cause confusion for non-sighted users, since the name doesn't reflect the action. The "Decline" message is also read out twice.

Expected Behavior

Expect the message strip close button to have aria label with "Close" instead of "Decline" like the one in UI5: https://sapui5.hana.ondemand.com/#/entity/sap.m.MessageStrip/sample/sap.m.sample.MessageStrip

Steps to Reproduce

  1. Using a screen reader (JAWS or NVDA)
  2. Go to https://sap.github.io/ui5-webcomponents/playground/components/MessageStrip/
  3. Tab to the close button of the first message strip
  4. Notice the screen reader outputs: "Information Bar Closable Information MessageStrip Decline Note" "Decline Button"

Context

Priority

Stakeholder Info

tsanislavgatev commented 2 years ago

Hello colleagues,

Can you please take a look at this case? @SAP/ui5-webcomponents-topic-rl

I see that the icon root has a aria-label="Decline" and this might cause the addition of the "Decline" to the information read out.

Best Regards, Tsani

ivoplashkov commented 2 years ago

Hello,

The issue seems to be caused by the ui5-button, since when a tooltip is set, the button is setting role="img" to the icon which is incorrect, also aria-label should not be present in this case. Тhis leads to incorrect speech output of the icon’s aria-label “Decline” instead of the tooltip of the Button. In UI5, when an icon only button has a title, the icon is rendered with role presentation and no aria-label.

Best regards, Ivaylo