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

All bottom tab components load when a text input is pressed and the keyboard opens #7858

Open
1 task done
quiringk opened this issue Mar 11, 2024 · 0 comments
Open
1 task done

Comments

@quiringk
Copy link

quiringk commented Mar 11, 2024

What happened?

I've been using react-native and react-native-navigation for a long time. I recently updated all of my packages for the first time in 9 months, something I've done many times. After solving all the expected bugs that occur when doing so, I ran into a strange bug that I'm not sure how to solve and assume it has to do with react-native-navigation because of side effects.

I use bottom tabs in my app. Prior to this update, when I setRoot the first bottom tab component loads while the other bottom tabs don't load yet. When I click on another bottom tab the component loads, useEffects fire, etc. This is how it's worked for as long as I remember. But after this update I ran into this strange bug. When I click on any text input on my actual device on the first loaded component, the keyboard opens as you would expect and then all of bottom tab components load even though I haven't visited them. I see the logs fire from each component.

Something else that is strange is that I use the library react-native-tab-view, which is from react-navigation. react-native-tab-view is used in one of the other bottom tabs. What is happening is I click on a text input in the first component like I mentioned, the keyboard opens, and then the keyboard closes. After commenting out different parts of the components I noticed that when I commented out the react-native-tab-view code in the other bottom tab component, the keyboard didn't auto close. So here's my theory:

  • I press a text input, the keyboard opens, and for whatever reason all the bottom tab components load before actually visiting them (I'm assuming this related to how react-native-navigation interacts with react-native)
  • In one of the components react-native-tab-view code loads which automatically closes the keyboard. This is probably a react-native-tab-view issue where it auto closes an open keyboard when it loads, but I thought I'd include that here in case it is helpful. But the main issue is that the bottom tab components are unexpectedly loading when the keyboard opens.

Thanks!

What was the expected behaviour?

No response

Was it tested on latest react-native-navigation?

  • I have tested this issue on the latest react-native-navigation release and it still reproduces.

Help us reproduce this issue!

No response

In what environment did this happen?

React Native Navigation version: 7.38.3 (Including previous minor versions)
React Native version: 0.73.5
Has Fabric (React Native's new rendering system) enabled: (yes/no) I believe so because I'm using the latest version?
Node version: v20.11.1
Device model: iPhone 12 Pro
iOS version: 17.3.1

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant