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.

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

[Bug]: TextInput with no helper text uses invalid aria-describedby #10107

Closed
2 tasks done
dcwarwick opened this issue Nov 12, 2021 · 0 comments · Fixed by #10108
Closed
2 tasks done

[Bug]: TextInput with no helper text uses invalid aria-describedby #10107

dcwarwick opened this issue Nov 12, 2021 · 0 comments · Fixed by #10108

Comments

@dcwarwick
Copy link
Contributor

dcwarwick commented Nov 12, 2021

Package

carbon-components-react

Package version

7.47.2

Description

With #9873, created by @dakahn to address #9630, an aria-describedby has been added to the TextInput generated DOM, set to the id of a helper text DIV. However, the helper text DIV is only generated if the helperText prop has been set. This means that when the helperText prop is NOT set the generated DOM includes an aria-describedby which contains an id that doesn't exist.

When aria-describedby contains an id that doesn't exist, this is an error, and causes accessibility testing tools to report violations whenever TextInput components without helperText set are used. For example, accessibility-checker v3.1.11 reports violations as follows:
image
The above example is from the ExportModal test suite of @carbon/ibm-cloud-cognitive. This test has been temporarily skipped in order to allow us to continue work until this issue is fixed.

Code of Conduct

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant