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

[material-ui][Autocomplete] Issues with clearOnEscape when using screen reader on Windows #43458

Open
austin-reed-iseatz opened this issue Aug 26, 2024 · 1 comment
Assignees
Labels
accessibility a11y component: autocomplete This is the name of the generic UI component, not the React module!

Comments

@austin-reed-iseatz
Copy link

austin-reed-iseatz commented Aug 26, 2024

Steps to reproduce

Link to live example: https://codesandbox.io/p/sandbox/hungry-northcutt-d3nr68?file=%2Fsrc%2FDemo.tsx

Steps:

  1. The issue can be seen from even the default demo on the component's page.
  2. While using a screen reader like NVDA or JAWS, interact with the autocomplete and then try to use the escape key.
  3. Observe

Current behavior

While the escape key does clear the input field, the focus on the input seems to be lost.

Videos:

https://drive.google.com/file/d/15xjifFiumDYm7X7Eztf5f33-aB5qPozs/view?usp=sharing

https://drive.google.com/file/d/1cFjOo6-xZA-Su9qYCWAmHo4Ka_O6M8Mx/view?usp=sharing

Expected behavior

When using the escape key, the input will stay focused and the user will continue to be able to interact with the element.

Context

Ensure that users have the ability to interact with the autocomplete component when using screen readers on Windows.

Your environment

npx @mui/envinfo
  System:
    OS: Windows 10
  Binaries:
    Node: 20.12.0 - ~/.nvm/versions/node/v20.12.0/bin/node
    npm: 10.5.0 - ~/.nvm/versions/node/v20.12.0/bin/npm
    pnpm: Not Found
  Browsers:
    Chrome: 127.0.6533.122
    Edge: Not Found
    Safari: 17.4.1
  npmPackages:
    @emotion/react: 11.13.3 => 11.13.3 
    @emotion/styled: 11.13.0 => 11.13.0 
    @mui/core-downloads-tracker:  5.16.7 
    @mui/material: 5.16.7 => 5.16.7 
    @mui/private-theming:  5.16.6 
    @mui/styled-engine:  5.16.6 
    @mui/system:  5.16.6 
    @mui/types:  7.2.15 
    @mui/utils:  5.16.6 
    @mui/x-data-grid: 7.12.1 => 7.12.1 
    @mui/x-date-pickers: 7.12.1 => 7.12.1 
    @mui/x-internals:  7.12.0 
    @types/react: 18.3.3 => 18.3.3 
    react: 18.3.1 => 18.3.1 
    react-dom: 18.3.1 => 18.3.1 
    typescript: 5.5.4 => 5.5.4 

Search keywords: clearOnEscape

@austin-reed-iseatz austin-reed-iseatz added the status: waiting for maintainer These issues haven't been looked at yet by a maintainer label Aug 26, 2024
@mj12albert mj12albert added accessibility a11y component: autocomplete This is the name of the generic UI component, not the React module! labels Aug 27, 2024
@mj12albert mj12albert self-assigned this Aug 27, 2024
@ZeeshanTamboli
Copy link
Member

The input appears focused but doesn't register typed values. I can only reproduce this only with a screen reader, not without it. I use NVDA on Windows.

@ZeeshanTamboli ZeeshanTamboli removed the status: waiting for maintainer These issues haven't been looked at yet by a maintainer label Aug 30, 2024
@ZeeshanTamboli ZeeshanTamboli changed the title [Material-UI] [Autocomplete] Issues with clearOnEscape when using screen reader on Windows [material-ui] [Autocomplete] Issues with clearOnEscape when using screen reader on Windows Aug 30, 2024
@ZeeshanTamboli ZeeshanTamboli changed the title [material-ui] [Autocomplete] Issues with clearOnEscape when using screen reader on Windows [material-ui][Autocomplete] Issues with clearOnEscape when using screen reader on Windows Aug 30, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
accessibility a11y component: autocomplete This is the name of the generic UI component, not the React module!
Projects
None yet
Development

No branches or pull requests

8 participants
@mj12albert @ZeeshanTamboli @austin-reed-iseatz and others