-
-
Notifications
You must be signed in to change notification settings - Fork 532
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
fix(iOS, Paper): possibility of infinite loop when swiping back in ne…
…sted stack (#2223) ## Description In #2193 I've made a mistake - on Paper, when there is no touch handler held in `_touchHandler` field I've started lookup for touch handler in ancestor chain from `self` -> which leads to infinite loop when swiping back in nested-stack navigation scenario. ## Changes * Started lookup from superview. ## Test code and steps to reproduce `Test2223` 1. Navigate to NestedStack. 2. Navigate to NestedStack details screen. 3. Use swipe gesture to go-back W/o this PR the application will crash hitting infinite loop. Also test that this behaviour remains fixed: * #2131 ## Checklist - [x] Included code example that can be used to test this change - [x] Ensured that CI passes
- Loading branch information
Showing
3 changed files
with
90 additions
and
1 deletion.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,88 @@ | ||
import React from 'react'; | ||
import { View, Text, Button, Pressable, StyleSheet, Alert } from 'react-native'; | ||
import { NavigationContainer, useNavigation } from '@react-navigation/native'; | ||
import { createNativeStackNavigator } from '@react-navigation/native-stack'; | ||
|
||
const Stack = createNativeStackNavigator(); | ||
const NestedStack = createNativeStackNavigator(); | ||
|
||
export default function App() { | ||
return ( | ||
<NavigationContainer> | ||
<Stack.Navigator screenOptions={{ animation: 'slide_from_left' }}> | ||
<Stack.Screen name="Home" component={HomeScreen} /> | ||
<Stack.Screen name="DetailsStack" component={DetailsScreen} /> | ||
<Stack.Screen name="NestedStack" component={NestedStackScreen} /> | ||
</Stack.Navigator> | ||
</NavigationContainer> | ||
); | ||
} | ||
|
||
function NestedStackScreen() { | ||
return ( | ||
<NestedStack.Navigator> | ||
<NestedStack.Screen name="NSHome" component={HomeScreen} /> | ||
<NestedStack.Screen name="NSDetailsStack" component={DetailsScreen} /> | ||
</NestedStack.Navigator> | ||
); | ||
} | ||
|
||
function HomeScreen() { | ||
const navigation = useNavigation(); | ||
return ( | ||
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}> | ||
<Text>Home Screen</Text> | ||
<Button | ||
title="Go to Details" | ||
onPress={() => navigation.navigate('DetailsStack')} | ||
/> | ||
<Button | ||
title="Go to NestedStack" | ||
onPress={() => navigation.navigate('NestedStack')} | ||
/> | ||
<Button | ||
title="Go to NestedStack Details" | ||
onPress={() => navigation.navigate('NSDetailsStack')} | ||
/> | ||
</View> | ||
); | ||
} | ||
|
||
function DetailsScreen() { | ||
return ( | ||
<View style={{ flex: 1, alignItems: 'center' }}> | ||
{new Array(10).fill(0).map((_, i) => ( | ||
<Pressable | ||
key={i.toString()} | ||
onPress={() => { | ||
Alert.alert('Pressed!'); | ||
}} | ||
style={({ pressed }) => [ | ||
{ | ||
backgroundColor: pressed ? 'rgb(210, 230, 255)' : 'white', | ||
}, | ||
styles.wrapperCustom, | ||
]}> | ||
{({ pressed }) => ( | ||
<Text style={styles.text}>{pressed ? 'Pressed!' : 'Press Me'}</Text> | ||
)} | ||
</Pressable> | ||
))} | ||
</View> | ||
); | ||
} | ||
|
||
const styles = StyleSheet.create({ | ||
wrapperCustom: { | ||
width: '100%', | ||
height: 100, | ||
marginHorizontal: 30, | ||
borderRadius: 10, | ||
margin: 10, | ||
}, | ||
text: { | ||
fontSize: 20, | ||
color: 'black', | ||
}, | ||
}); | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters