-
-
Notifications
You must be signed in to change notification settings - Fork 955
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
WEB/NATIVE inconsistent behaviour of pan gesture callbacks with manual activation. #2907
Labels
Platform: Android
This issue is specific to Android
Platform: iOS
This issue is specific to iOS
Platform: Web
Repro provided
A reproduction with a snack or repo is provided
Comments
github-actions
bot
added
Platform: Android
This issue is specific to Android
Platform: iOS
This issue is specific to iOS
Platform: Web
Repro provided
A reproduction with a snack or repo is provided
labels
May 13, 2024
Hi @pedrogarciyalopez! I've just created this PR, could you please check if it helps? |
m-bert
added a commit
that referenced
this issue
May 28, 2024
## Description As stated in #2907, web shows inconsistent behavior with native platforms when it comes to touch event callbacks. This PR unifies its behavior with `Android` by calling `sendTouchEvent` after handler goes to `BEGAN` state. Previously it wouldn't fail, because transition from `UNDETERMINED` into `FAIL` is not possible on web. Fixes #2907. ### `onBegin` and `onFinalize` We agreed with @j-piasecki that `onFinalize` should be called only when `onBegin` was called. However, in that specific case (i.e. snippet from issue) we are not sure if those callbacks should be triggered and it is still a thing for a discussion. ## Test plan <details> <summary> Tested on the following code from issue </summary> ```jsx import { View } from 'react-native'; import { Gesture, GestureDetector, GestureHandlerRootView } from 'react-native-gesture-handler'; export default function App() { const panGesture = Gesture.Pan() .manualActivation(true) .onTouchesDown((e, stateManager) => { stateManager.fail(); console.log('onTouchesDown, fail') }) .onTouchesUp(() => console.log('onTouchesUp')) .onTouchesMove(() => console.log('onTouchesMove')) .onBegin(() => console.log('onBegin')) .onChange(() => console.log('onChange')) .onTouchesCancelled(() => console.log('onTouchesCancelled')) .onFinalize(() => console.log('onFinalize')) .onStart(() => console.log('onStart')) .onUpdate(() => console.log('onUpdate')) .onEnd(() => console.log('onEnd')); return ( <GestureHandlerRootView style={{ flex: 1 }}> <GestureDetector gesture={panGesture}> <View style={{ flex: 1, backgroundColor: 'yellow' }} /> </GestureDetector> </GestureHandlerRootView> ) } ``` </details>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Labels
Platform: Android
This issue is specific to Android
Platform: iOS
This issue is specific to iOS
Platform: Web
Repro provided
A reproduction with a snack or repo is provided
Description
In the
onTouchesDown
callback,stateManager.fail()
is called. It works as expected in native, but in the web, callbacksonTouchesMove
,onTouchesUp
etc continue to trigger, which should not happen.Run the code below, swipe your finger across the screen, and watch the console.
In the web, you will see the following output:
In the native, you will see the following output:
It seems like this is an issue that hasn't been fully resolved #2869.
@m-bert what do you think?
Steps to reproduce
try it on Snack
Snack or a link to a repository
https://snack.expo.dev/DPDgCkZ0hbai5s51p3AcM
Gesture Handler version
2.16.2
React Native version
0.71.9
Platforms
Android, iOS, Web
JavaScript runtime
None
Workflow
None
Architecture
None
Build type
None
Device
None
Device model
No response
Acknowledgements
Yes
The text was updated successfully, but these errors were encountered: