eui

eui copied to clipboard

Description

The EuiFormErrorText component has an aria-live="polite" attribute applied on line 25. This live region doesn't always announce to screen readers if the container is not added to the page on first render. Screen reader users might miss important context when consumers use this without a callout.

Suggested Change

I'm suggesting we switch the aria-live="polite" for role="alert"

! src/components/form/form_error_text/form_error_text.tsx#L25

return (
- <div className={classes} aria-live="polite" {...rest}>
+ <div className={classes} role="alert" {...rest}>
    {children}
  </div>
);

## Helpful Links
* https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alert_role
* https://www.w3.org/WAI/WCAG21/Understanding/error-identification.html

👋 Hey there. This issue hasn't had any activity for 180 days. We'll automatically close it if that trend continues for another week. If you feel this issue is still valid and needs attention please let us know with a comment.

Please keep this issue open.

@1Copenut I'd suggest going ahead and adding the skip-stale-issue label on these types of issues you don't want auto-closed.

My 2c from grooming: there's a lot of room for potential abuse/annoyance from consuming devs incorrectly flagging errors too quickly (e.g. clicking into an empty input and it yells about it being required before you even start typing).

To account for that, we should make the option to set role="alert" vs aria-live="polite" as a developer prop instead of as a default.

👋 Hi there - this issue hasn't had any activity in 6 months. If the EUI team has not explicitly expressed that this is something on our roadmap, it's unlikely that we'll pick this issue up. We would sincerely appreciate a PR/community contribution if this is something that matters to you! If not, and there is no further activity on this issue for another 6 months (i.e. it's stale for over a year), the issue will be auto-closed.

@1Copenut would this be something you'd be willing to grab this week (or next) as it seems like a pretty quick change?

Moving this to On hold for a minute. @cee-chen and I started a broader discussion about the way screen readers handle errors when consumers use EuiForm with the error callout (with or without individual errors) vs. when they just use individual EuiFormRow errors. There's nuance in what roles and focus states should be set to maximize usability for screen readers. I'm going to start with a simple spec doc and we can plan out work from there.

👋 Hi there - this issue hasn't had any activity in 6 months. If the EUI team has not explicitly expressed that this is something on our roadmap, it's unlikely that we'll pick this issue up. We would sincerely appreciate a PR/community contribution if this is something that matters to you! If not, and there is no further activity on this issue for another 6 months (i.e. it's stale for over a year), the issue will be auto-closed.