[v4] Open doesn't work correctly when no TextInput in modal

Open JamesHemery opened this issue 2 years ago • 11 comments

Bug

A rather strange bug, when on an Expo application (the bug is also present on the Expo example on the repo) if I disable bottom sheet logging, the modal does not open correctly. Except when there is an input inside, which is even more curious.

More info:

Problem isn't present in "Production mode"
Problem isn't present with enableLogging() or Remote Debugger
After call present(), sometimes in need to touch any area on the screen to see the bottom sheet
When I add a TextInput inside the bottom sheet, it's works correctly

https://user-images.githubusercontent.com/23323941/173965281-c2345167-3124-48ac-81c4-6bf64ab6b439.MP4

Environment info

Reproduced on Expo example of the repo, just yarn install & yarn start.

-> Dont forget to remove enableLogging(); in index.tsx in order to reproduce

Steps To Reproduce

clone the expo example
yarn instal
remove enableLogging();
yarn start
try open modal

Jun 16 '22 00:06 JamesHemery

@JamesHemery: hello! :wave:

This issue is being automatically closed because it does not follow the issue template.

Jun 16 '22 00:06 github-actions[bot]

@JamesHemery did you ever figure this out? I'm having the same issue, specifically

"After call present(), sometimes in need to touch any area on the screen to see the bottom sheet"

This happens probably 90% of the time, and the other 10% it will present itself normally, but visibly slower.

I'm also having other issues with the app fully crashing when .present() is called with other bottom sheets.

Jun 30 '22 18:06 jjrise

@jjrise We still have this problem where we have to touch the screen for the bottom sheet to appear. The temporary solution we found is to put a TextInput (hidden) in the bottom sheet, with this the problem disappear.

I'm also having other issues with the app fully crashing when .present() is called with other bottom sheets.

We do not have this problem today.

@gorhom any idea to solve this issue ? We've not found a long term fix.

Jun 30 '22 20:06 JamesHemery

@JamesHemery you are correct, this works as expected if you put a hidden textInput in... thanks for the tip!

Jul 01 '22 15:07 jjrise

We are having the same issue with BottomSheetModal and not BottomSheet on iOS but not on Android, while adding <TextInput style={{display: 'none'}} /> thanks to @JamesHemery tip or <Rating/> from react-native-rating solves the issue, the question is why other components (View,Text,Image,...) do not fix it ? With that being said, we are waiting for the long term fix.