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

paper-input character counter #709

Open
uxdesignz opened this issue Oct 22, 2020 · 1 comment
Open

paper-input character counter #709

uxdesignz opened this issue Oct 22, 2020 · 1 comment

Comments

@uxdesignz
Copy link

Actual Result:
Findable Added Content: Some of the input text fields uses a dynamically changed character counter. Screen reader users may not be notified when the value of the counter changes while others are notified on every keystroke which may be confusing.
Note: The text input is difficult to read/review because it is not all visible on the page because a textbox is used for the form field. Users with low vision or cognitive impairments may have difficulty reviewing/editing the text input. It is recommended to use a textarea element instead of the current form input.

Expected Results
Currently, the character counter is associated with the form field using aria-describedby however this is causing the change to be announced on every keystroke for some screen reader users. Remove the aria-describedby reference to the character counter when users are typing and use the method below to communicate the change while text is being entered.
Use WAI-ARIA aria-live="polite" to notify screen reader users of a content change without a change in focus on the page.
To provide support across browsers:
• The element aria-live="polite" should be present on page load, (when the form is first displayed)
• The message text should be injected dynamically into this element as its immediate child element.
• Toggle aria-live between "off" and "polite" once every 50 characters. This way the screen reader will only announce changes once every 50 characters instead of with every keystroke.

@uxdesignz uxdesignz changed the title paper-input-container character counter paper-input character counter Oct 22, 2020
@uxdesignz
Copy link
Author

Any update on this?

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

No branches or pull requests

1 participant