Attempting to swipe back but not actually swiping back causes undesirable blank view while text input is focused

[itsramiel]

• How did you link to the library (autolinking, manual, rn link, cocoapods)? I used eas build from expo
• What version of React Native? 0.64.3
• What version of the library? 6.5.4-4
• iOS version? 14.4
• Did the problem happen after updating React Native? nope
• Are you using the library for the first time? yes
• It's a bug? Provide a link to a minimal reproduction case. The repro is in a private project. The setup just requires two screen(ScreenA, ScreenB) in a stack navigator. Navigate to ScreenB and let there be a textinput and focus on it, then partially swipe back but then give up swiping back, there should be a blank space. If you are not able to reproduce it. I will definitely provide a minimal repro.

https://user-images.githubusercontent.com/80689446/160818446-082d47ad-19ae-460b-bd5e-71fd51bb7933.mp4

https://user-images.githubusercontent.com/80689446/160818617-ffcfb84d-9dbb-4b6c-8a66-f7449ecc2985.mp4

I understand that this package depends on IQKeyboardManager, and this issue was opened a long time in https://github.com/hackiftekhar/IQKeyboardManager/issues/1361. It was mentioned that it was resolved but it doesnt seem to be.

Can you please confirm the bug and if possible suggest a solution if any?

[douglasjunior]

I've never encountered this problem in the projects I've worked on.

This seems to be a conflict related to the navigation library. Are you using React Navigation? react-native-screens? Because in React Navigation we have just one native screen, and then the internal screens are simulated with "Views" and animation.

Can you share a reproducible example with these libraries together?

[itsramiel]

sure. I will work one a reproducable demo compiled using eas build and share the result and the repo link. And yes I am using react navigation and react-native-screens

[itsramiel]

Same results with the following minimal repo:

https://user-images.githubusercontent.com/80689446/160873297-10bf5e3b-fb2d-4196-938f-d1eeb60f847b.mp4

https://user-images.githubusercontent.com/80689446/160873325-bd061fc5-b150-4dd5-81bb-6732fa47aead.mp4

[douglasjunior]

Bingo, the problem is related to "@react-navigation/native-stack". Replacing to "@react-navigation/stack" the problem dont happens.

I will report to IQKeyboardManager and make myself available to help if necessary.

Let's follow the thread https://github.com/hackiftekhar/IQKeyboardManager/issues/1361 and https://github.com/hackiftekhar/IQKeyboardManager/issues/1422

[douglasjunior]

I created a native iOS Xcode project, with Storyboards and Navigation Controllers, and problem don't happen.

This make me think that the "react-native-screens" uses some strategy to do a "native navigation" that's breaking the IQKeyboardManager.

Possible related issues: https://github.com/software-mansion/react-native-screens/issues?q=is%3Aissue+blank+ios

[itsramiel]

yes confirmed that the bug is not there when using stack instead of native stack. thank you!!

[hirbod]

@ramiel1999 maybe worth an issue report at react-native-screens.

[landabaso]

For the moment, I think it's better to disable gestures when using the native-stack.

      <NativeStack.Navigator
        screenOptions={{
          //Disable goBack with gesture to prevent this issue:
          //https://github.com/douglasjunior/react-native-keyboard-manager/issues/89
          ...(Platform.OS === 'ios' ? { gestureEnabled: false } : {}),
        }}
      >

[itsramiel]

For the moment, I think it's better to disable gestures when using the native-stack.

      <NativeStack.Navigator
        screenOptions={{
          //Disable goBack with gesture to prevent this issue:
          //https://github.com/douglasjunior/react-native-keyboard-manager/issues/89
          ...(Platform.OS === 'ios' ? { gestureEnabled: false } : {}),
        }}
      >

That's a behavior almost all ios user rely on. Definitely not a good solution. A solution I found was to use scrollviews instead of views for the parent component of the screen if possible because then it doesnt happen

[landabaso]

That's a behavior almost all ios user rely on. Definitely not a good solution. A solution I found was to use scrollviews instead of views for the parent component of the screen if possible because then it doesn't happen

It's a bad solution. However, when the bug occurs then the App gets broken in my case, which is even worse. I am already using <ScrollView> as the parent component of all the Screens. The bug shows up after the TextInput is blurred in my case.