You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Error messages or validation messages of forms are pointers that enable users identify the mistakes and rectify them. As a result, error messages should be accurate and descriptive so that users are able to provide correct information and submit the form without any problem.
Suggested resolution:
Add role="alert" attribute to the
having class="text-input-error" to ensure that the error message is announced by the screen reader.
Uh oh!
There was an error while loading. Please reload this page.
Action Performed:
Expected Result:
When focus lands on all text boxes then screen reader should read the error messages which are displayed on the screen.
Actual Result:
Screen reader is not read anything after select the save and continue button.
HTML Code -
div class="css-1dbjc4n r-13awgt0 r-1pi2tsx r-12vffkv r-1wyyakw" style="flex-direction: row; -webkit-box-orient: horizontal; -webkit-box-direction: normal;">
<input autocapitalize="sentences" autocomplete="on" autocorrect="on" dir="auto" spellcheck="true" type="date" class="css-11aywtz r-13awgt0 r-tz77pi r-13qz1uu expensify-datepicker" value="" max="2022-03-31" style="border-radius: 8px; border-width: 0px; box-shadow: none; color: rgb(11, 27, 52); font-family: GTAmericaExp-Regular; font-size: 15px; line-height: 20px; outline-width: 0px; padding: 23px 11px 8px;"
Note
Same issue repro on all pages/ application.
Other Occurrences:
Same issue repro on #8041, #8452, #7362, #8256, #8682, #8730, #8493, #8826, #8868, #8802, #8969, #8845, #8876, #8887
Same issue repro on #9486 for "Phone number" field.
Same issue repro on #9486 for form fields on Add a debit card page.
Workaround:
Yes
Area issue was found in:
Company Information
Failed WCAG checkpoints
3.3.1
User impact:
Error messages or validation messages of forms are pointers that enable users identify the mistakes and rectify them. As a result, error messages should be accurate and descriptive so that users are able to provide correct information and submit the form without any problem.
Suggested resolution:
Add role="alert" attribute to the
Refer to:
https://www.w3.org/TR/WCAG20-TECHS/ARIA19.html
Platform:
**Version Number:**v1.1.46-2
**Reproducible in staging?:**Yes
**Reproducible in production?:**Yes
Notes/Photos/Videos: Any additional supporting documentation
Issue reported by:
1876_Error.message.is.not.announced.by.the.screen.reader.mp4
The text was updated successfully, but these errors were encountered: