react-navigation / react-navigation/react-navigation
Swiping back on iOS modal in nested navigator closes the parent navigator
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 24.5k
- Forks
- 5.1k
- Avg merge
- 1d 5h
- Merged PRs (30d)
- 18
Description
Current behavior
``When adding a screen with presentation: 'modal' on iOS, in a nested StackNavigator, the horizontal closing animation can not be prevented by gestureEnabled: false. It is still possible to trigger a horizontal closing animation by swiping from left to right.
This however does not only close the modal, but the entire stack, if the modal was opened in a nested stack. With below pseudo code this would be:
- Open Stack2 from Stack1
- Open A modal in Stack2
- Swiping RTL closes The Modal & Stack2
<Stack1>
<Stack2>
<Modal />
</ Stack2>
</Stack1>
It is possible to disable the closing of the modal, but there is no way to disable the swipe back animation. I would presume that gestureEnabled: false would take care of this.
Expected behavior
I expect either that this swipe gesture does not close the entire stack or that the gesture can be disabled with gestureEnabled: false
Reproduction
https://snack.expo.dev/@jef.vandooren/tactless-ice-cream
Platform
- Android
- iOS
- Web
- Windows
- MacOS
Packages
- @react-navigation/bottom-tabs
- @react-navigation/drawer
- @react-navigation/material-top-tabs
- @react-navigation/stack
- @react-navigation/native-stack
- react-native-tab-view
Environment
- [] I've removed the packages that I don't use
| package | version |
|---|---|
| @react-navigation/native | 6.1.4 |
| @react-navigation/stack | 6.3.14 |
| react-native-screens | |
| react-native-gesture-handler | |
| react-native | |
| expo | |
| node | |
| npm or yarn |
Contributor guide
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 Snack reproduction on iOS and reproduce the swipe from the modal in the nested StackNavigator. Read the @react-navigation/stack gesture and modal behavior described in the issue, using the listed package versions as context. Done means the swipe no longer closes the parent stack, or gestureEnabled: false reliably disables it.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, react-native, typescript
- Domain
- mobile
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100