software-mansion / software-mansion/react-native-screens
[iOS] Keyboard goes outside screen bounds when navigation back via navigation.goBack()
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 3.7k
- Forks
- 714
- Avg merge
- 2d 23h
- Merged PRs (30d)
- 71
Description
Description
When navigating back via navigation.goBack() from a custom back button, the keyboard goes outside the screen bounds during the transition.
However, when navigating back using the native header back button, the keyboard stays within the screen bounds and behaves correctly.
Expected behavior: The keyboard should stay within the screen bounds when going back via navigation.goBack(), same as when using the native header back button.
Current behavior: The keyboard visually exits the screen frame when going back via navigation.goBack().
Screenshot 1
This behavior occurs when navigating back via navigation.goBack().
Screenshot 2
This behavior does NOT occur when navigating back via the native header back button.
Video
https://github.com/user-attachments/assets/1342eceb-a471-4216-b0fa-2cc59e6bc448
This issue occurs in both React Native and Expo, across all versions.
Steps to reproduce
- Open a screen that has a TextInput
- Tap on the TextInput so the keyboard appears
- Tap the custom back button that calls
navigation.goBack() - The keyboard goes outside the screen bounds during the transition
Snack or a link to a repository
https://snack.expo.dev/@zo_hayk/keyboard-goes-outside-screen
Environment
| package | version |
|---|---|
| @react-navigation/native | 7.2.1 |
| @react-navigation/native-stack | 7.14.9 |
| @react-navigation/stack | 7.8.8 |
| react | 19.2.3 |
| react-native-screens | 4.24.0 |
| react-native | 0.84.1 |
| react-native-safe-area-context | 5.7.0 |
Screens version
4.24.0
React Native version
0.84.1
Platforms
iOS
Acknowledgements
Yes
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the linked Expo Snack and reproduce the transition using a TextInput, a custom button calling navigation.goBack(), and the native header back button for comparison. Trace the navigation.goBack() and native header paths in react-native-screens, then verify that the keyboard remains within the screen bounds during the custom-back transition on iOS.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- ios, react-native, typescript
- Domain
- mobile
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100