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.51k stars 263 forks source link

[SF_ACC] [Input] Clear icon is being read as "Decline" #7600

Closed bonniegso closed 11 months ago

bonniegso commented 1 year ago

Bug Description

The clear icon on an Input component with show-clear-icon defined is being read as "Decline" by screen readers which is misleading to users since the button is meant for clearing the field. This is because the aria-label set on the close icon svg is set to "Decline". This can be resolved by either setting the aria-label to "Clear" or allowing this aria-label to be customizable by consumers.

Affected Component

Input

Expected Behaviour

The expected behavior is for the button to announce "Clear" on focus.

Isolated Example

https://lgww49.csb.app/

Steps to Reproduce

  1. Turn on JAWS Screenreader
  2. Open example in a browser
  3. Type something into the input field
  4. Using your keyboard navigate to the "x" button in the input field
  5. Observe that "Decline" is read

Log Output, Stack Trace or Screenshots

No response

Priority

Medium

UI5 Web Components Version

1.14.5

Browser

Chrome

Operating System

MacOS 13.5.2

Additional Context

No response

Organization

SAP SuccessFactors

Declaration

plamenivanov91 commented 1 year ago

Hello @bonniegso ,

How exactly do you navigate to the clear button since it can't be focused?

Regards, Plamen

bonniegso commented 1 year ago

Hi @plamenivanov91 ,

You can navigate to the button using virtual cursor mode on JAWS. You can toggle the virtual cursor by pressing Insert + Z. If using VoiceOver, you can access it via the Control + Option + Left/Right Key.

Best, Bonnie

elenastoyanovaa commented 1 year ago

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

The accessible name of the clear icon should be changed to "Clear". Also the icon role should be changed to button.

Kind Regards, Elena