Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[Bug]: sp-help-text error message suppressed when continue typing #3377

Open
1 task done
jnurthen opened this issue Jun 27, 2023 · 5 comments · May be fixed by #4210
Open
1 task done

[Bug]: sp-help-text error message suppressed when continue typing #3377

jnurthen opened this issue Jun 27, 2023 · 5 comments · May be fixed by #4210
Labels
a11y Issues related to accessibility bug Something isn't working Component: Help Text Discovery

Comments

@jnurthen
Copy link
Member

Code of conduct

  • I agree to follow this project's code of conduct.

Impacted component(s)

sp-help-text

Expected behavior

When sp-help-text is used in the negative-help-text slot it is expected that the error message will be read to the user. This works great if the user simply presses a single keypress but when the user types more info into the field the error message is supressed.

Actual behavior

The error message doesn't get read as it its reading is suppressed by the next keypress.

Screenshots

No response

What browsers are you seeing the problem in?

Firefox, Chrome, Microsoft Edge

How can we reproduce this issue?

  1. Start JAWS or NVDA
  2. Go to https://studio.webcomponents.dev/preview/Tea8IMwcfLarfCQwSnxa/src?branch=Textfield-invalid-text@7fBWg9Y3wmUwOKofZzrLDd2SRAr2&p=stories
  3. Click on the first name field
  4. Type 3
  5. Note the error message is read
  6. Delete the number and type some letters into the field
  7. Type 33 into the field
  8. Note the error message is not read.

Sample code that illustrates the problem

No response

Logs taken while reproducing problem

No response
@jnurthen jnurthen added bug Something isn't working triage An issue needing triage labels Jun 27, 2023
@jnurthen
Copy link
Member Author

note this works fine with Safari+VO

@jnurthen jnurthen added the a11y Issues related to accessibility label Jun 27, 2023
@Westbrook
Copy link
Collaborator

Do you find this to be something that would benefit from the aria-live attribute and one of its values?

@jnurthen
Copy link
Member Author

@Westbrook not sure - are you doing anything special to make this get read at the moment or is it merely a consequence of setting invalid which makes the message get read?

@Westbrook
Copy link
Collaborator

We're not doing much special here, no. I think it's mainly because it's associated to the focused element via aria-describedby. So, maybe something more insistent would be useful.

@jnurthen
Copy link
Member Author

A live region of some sort could also solve the issue on iOS where the error message is not read at all (until you refocus into the field anyway)
It is certainly worth investigating although I'd love to solve this in a more standards compliant way.

FYI react-spectrum has the same issue but I didn't pick it up in their audit due to their documentation testcases for errors not allowing more than a single digit. I'd like all of us to converge on the same solution.

@najikahalsema najikahalsema added Discovery Component: Help Text and removed triage An issue needing triage labels Oct 12, 2023
@Westbrook Westbrook linked a pull request Mar 22, 2024 that will close this issue
Draft
9 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
a11y Issues related to accessibility bug Something isn't working Component: Help Text Discovery
Projects
None yet
Milestone
No milestone
3 participants
@Westbrook @jnurthen @najikahalsema