SAP / fundamental-ngx

Fundamental Library for Angular is SAP Design System Angular component library
https://sap.github.io/fundamental-ngx
Apache License 2.0
263 stars 126 forks source link

[Sourcing-2][Accessibility: ACC-264.4][WIP] Error message not conveyed. #11288

Open JyotiKumari1507 opened 7 months ago

JyotiKumari1507 commented 7 months ago

Is this a bug, enhancement, or feature request?

Bug

Describe your proposal.

Component having issue: https://sap.github.io/fundamental-ngx/#/core/textarea and https://sap.github.io/fundamental-ngx/#/core/input Textarea State: Error and Input State: Error On Error , We get error message alert only on clicking on iput/textarea field. error message should conveyed with clicking also. Due to this reason error message isn't readable by screen reader

Can you handle that on the application side

No

Which versions of Angular and Fundamental Library for Angular are affected? Please, specify the exact version. (If this is a feature request, use current version.)

All latest version

If this is a bug, please provide steps for reproducing it; the exact components you are using;

Using Screen reader can check by implementing similar case. Just use input or textarea with error state. Screen reader will not able to read any error message without click on input field

Please provide relevant source code (if applicable).

Please provide stackblitz example(s).

In case this is Accessibility related topic, did you consult with an accessibility expert? If not, please do so and share their recommendations.

Yes we have got this bug from Accessibility expert only.

Did you check the documentation and the API?

Yes

Did you search for similar issues?

Is there anything else we should know?

droshev commented 7 months ago

@JyotiKumari1507 Can you provide more information

JyotiKumari1507 commented 7 months ago

@droshev Error message Alert in input/Texterror only come on putting cursor. Its highlight only otherwise. This concern is raised by Accessibility team. We can have more discussion in next call

droshev commented 7 months ago

@JyotiKumari1507 we need the input written so it will be easier to process

JyotiKumari1507 commented 7 months ago

@droshev As Error message Alert in input/Texterror only come on putting cursor. Its highlight only otherwise. This concern is raised by Accessibility team. Please refer attachment

image
droshev commented 6 months ago

Most of the fields are not filled.

JyotiKumari1507 commented 5 months ago

@droshev please let us know what fields are pending to fill from our side

divyamalhotra488 commented 5 months ago

@droshev Please find a video recording for the issue: here CC: @JyotiKumari1507

droshev commented 5 months ago

@nikolay-kolarov I think there is no issue here as the validation is performed when the user clicks on the button and then the error is set. What do you think?

nikolay-kolarov commented 5 months ago

Hi @droshev,

Yes, the error is visually set, but when you go back with the keyboard back in the field the error state message is not announced and the user does not understand what is the problem. It is reproducible in the samples: https://sap.github.io/fundamental-ngx/#/core/textarea On focus the state of the input and the text clarifiyng the value state needs to be announced. Also the aria-invalid attribute has to be set for the error state.

Please check and follow the implementation here: https://ui5.sap.com/#/entity/sap.m.Input/sample/sap.m.sample.InputValueState

Best Regards, Nikolay