software-mansion / software-mansion/react-native-screens
Swiping back while header search input is focused breaks navigation options
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 3.7k
- Forks
- 713
- Avg merge
- 2d 23h
- Merged PRs (30d)
- 71
Description
Description
When you navigate back with a swipe gesture, while the header search bar input is focused
- the header on the given screen disappears during the back navigation
- the header options of the screen that we navigate back to are reset. E.g. in this case,
(tabs)hasheaderShownset to false. However, if we navigate back from the search screen while the search input was focused, the header title is now incorrectly shown as "(tabs)".
Note that this issue only happens when the header search input is focused. If we navigate back using the native back button or if we swipe back when the input is not focused, the bug does not occur.
https://github.com/user-attachments/assets/fe3356eb-7a44-4357-8efd-8aeb3d2b7c19
Steps to reproduce
- Run the repro in Expo Go
- Press on "Go to search" on the first screen
- Focus the header search input
- While focused, apply the "go back" gesture by swiping right from the left edge of the screen
- During the swipe gesture, you'll notice that the header in the search screen disappears and the content jumps up
- Once the navigation is complete, you'll notice that the
(tabs)header title is shown, even though the(tabs)navigator options setheaderShownto false
Snack or a link to a repository
https://github.com/MaxAst/react-native-screens-search-repro
Screens version
4.11.1
React Native version
0.79.2
Platforms
iOS
JavaScript runtime
Hermes
Workflow
Expo managed workflow
Architecture
Fabric (New Architecture)
Build type
Debug mode
Device
Real device
Device model
iPhone 16 Pro Max
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 by running the linked Expo repro on iOS and follow the listed steps to reproduce the focused-header swipe-back behavior. Trace the navigation and header transition involved, then verify that the search header remains stable during the gesture and that the destination screen keeps its configured header options afterward.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react-native, typescript
- Domain
- mobile
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100