[TreeView] component is not accessible in Android Talkback

krv5vignesh commented 3 years ago

The Tree View component does not work in Android when used with Talkback enabled. When Talkback (screen reader for Android) is enabled, the nodes in the Tree View are not working.

[x] The issue is present in the latest release.
[x] I have searched the issues of this repository and believe that this is not a duplicate.

Current Behavior 😯

All the below list issues occur when Talkback is enabled.

When Talkback is enabled, the tree nodes get focused by the swipe right gesture. But when double tapped, it does not expand or collapsed and instead only announces the current state.
Similar issue occurs on node selection as well. With Talkback enabled and when we use the double-tap gesture to select the node, it does not get selected.
The name of the node is not announced when a node is focused

Expected Behavior 🤔

While using Talkback the nodes should expand or collapse when the double tap gesture is used.
Tree nodes should be selectable when double tag gesture is used
The name of the tree node should be announced when it is focused.

Steps to Reproduce 🕹

Enable Talkback on an Android mobile and try to interact with the Tree nodes give in the example page

Context 🔦

I am trying to use the Tree view component in Android.

Your Environment 🌎

`npx @material-ui/envinfo`

``` System: OS: macOS 10.15.7 Binaries: Node: 14.15.5 - /usr/local/bin/node Yarn: 1.22.10 - /usr/local/bin/yarn npm: 6.14.11 - /usr/local/bin/npm Browsers: Chrome: 90.0.4430.93 Edge: 90.0.818.49 Firefox: 88.0 Safari: 14.1 npmPackages: @material-ui/core: ^4.11.4 => 4.11.4 @material-ui/icons: ^4.11.2 => 4.11.2 @material-ui/lab: ^4.0.0-alpha.58 => 4.0.0-alpha.58 @material-ui/styles: 4.11.4 @material-ui/system: 4.11.3 @material-ui/types: 5.1.0 @material-ui/utils: 4.11.2 @types/react: 17.0.4 react: ^17.0.2 => 17.0.2 react-dom: ^17.0.2 => 17.0.2 ```

Search keywords:

oliviertassinari commented 3 years ago

Could you test https://next.material-ui.com/components/tree-view/ out? The focus is now handled with a aria-activedescendant mui/material-ui#21695 (however, it creates other issues mui/mui-x#9958)

krv5vignesh commented 3 years ago

@oliviertassinari Unfortunately that did not fix the issue. I am getting the same issues I originally reported.

Also I noticed something while testing this on two different devices. They are,

Device 1 - Android version 7.0

I am able to expand a tree node, select a child node without any issue.
Only issue is I am NOT able to collapse an already expanded node.

Device 2 - Android version 10

All the issues I originally reported are observed here.

Note: Both the above tests were done with Talkback (version 9.1) enabled and tested on both the main Material UI documentation site as well as next.material UI documentation site.

krv5vignesh commented 3 years ago

@oliviertassinari Any update on this? Could you point me where the issue might be occurring from so I can attempt a fix?

oliviertassinari commented 3 years ago

@krv5vignesh I don't have a single clue about what's going wrong. It's also unlikely this issue will be worked on before many months. If it's important for your organization, feel free to invest time in it.

eps1lon commented 3 years ago

Using Android 7.0 NRD90M on a Redmi Note 4 on https://6093d26ee081cf00074f9d5d--material-ui.netlify.app/components/tree-view#FileSystemNavigator.

Checked means working, unchecked means not working:

[x] announcing name when focused
[x] selection
[x] announcing selected state
[x] announcing expanded state
[x] expansion when double tapped
[ ] collapsing when double tapped

Same behavior with https://www.w3.org/TR/wai-aria-practices/examples/treeview/treeview-2/treeview-2a.html

Ignore the display :smile:

https://user-images.githubusercontent.com/12292047/117434150-98af9e00-af2c-11eb-8ab2-b3a13092baba.mp4

Will check if there are bug reports for Android 10. But I'd be surprised if this were an issue on our part.

mui / mui-x