[v4] BottomSheetModal content not accessible by screen reader on iOS

[gracjandotdev]

Bug

Contents of the BottomSheetModal component (also BottomSheet) are not accessible by screen reader on iOS.

Environment info

Library	Version
@gorhom/bottom-sheet	4.0.2
react-native	0.63.3
react-native-reanimated	2.2.0
react-native-gesture-handler	1.10.2

Steps To Reproduce

1. Turn on voice over in iOS accessibility settings
2. Navigate to the application
3. Open Bottom Sheet Modal
4. Try to tap on elements inside. It will focus only the wrapper, but not contents

Describe what you expected to happen:

1. Expect screen reader to focus and announce items contained within a Bottom Sheet.

Reproducible sample code

https://snack.expo.dev/@jangsoori/ashamed-kiwi

[gorhom]

thanks @jangsoori for reporting this issue, it should be resolved with v4.0.3 👏

[thienautran]

@gorhom I'm using this on v4.6.1, and Voice over only announces "Bottom Sheet" when focus is placed over the bottom sheet. Even with elements inside the bottom sheet, the child elements cannot be accessed by Voice Over. Any idea what has regressed?

[nbarkoch]

@thienautran
in version v4.5.1 it still works, need to check within those last updates..

[kkureli]

In 4.5.1 it also as @thienautran said only announces "Bottom Sheet" when focus is placed over the bottom sheet, Even with elements inside the bottom sheet, the child elements cannot be accessed by Voice Over.

But it works in v4.0.3

[rafahlobo]

To solve this problem, simply pass the property "accessible={false}".

I tested it on version "@gorhom/bottom-sheet": "^4.6.1",

For example:

<BottomSheet
      accessible={false}      
      ....       
      />