Skip to content

Commit 7c115be

Browse files
authored
fix(worklet): fix workletization of touch event gesture callbacks (#2715)
## Description Workletized touch event gesture callbacks were causing Reanimated errors to be thrown in RN 73 (Expo 50 beta). Not sure if this is a bug in RNGH or Reanimated, but moving the function definition outside of the object seems to fix the issue (sounds like a bug in the reanimated babel plugin if nested functions should be able to be workiletized?) Fixes software-mansion/react-native-reanimated#5555 This case was previously broken: ```tsx function Demo() { const panGesture = Gesture.Pan() panGesture.onTouchesMove((evt, mgr) => { 'worklet' console.log('move!!') }) return ( <GestureHandlerRootView style={{ flex: 1, backgroundColor: 'seashell' }}> <GestureDetector gesture={panGesture}> <Animated.View style={{ flex: 1 }} /> </GestureDetector> </GestureHandlerRootView> ) } ```
1 parent 6563265 commit 7c115be

File tree

1 file changed

+42
-40
lines changed

1 file changed

+42
-40
lines changed

src/handlers/gestures/gestureStateManager.ts

Lines changed: 42 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -18,45 +18,47 @@ const warningMessage = tagMessage(
1818
const REANIMATED_AVAILABLE = Reanimated?.useSharedValue !== undefined;
1919
const setGestureState = Reanimated?.setGestureState;
2020

21+
function create(handlerTag: number): GestureStateManagerType {
22+
'worklet';
23+
return {
24+
begin: () => {
25+
'worklet';
26+
if (REANIMATED_AVAILABLE) {
27+
setGestureState(handlerTag, State.BEGAN);
28+
} else {
29+
console.warn(warningMessage);
30+
}
31+
},
32+
33+
activate: () => {
34+
'worklet';
35+
if (REANIMATED_AVAILABLE) {
36+
setGestureState(handlerTag, State.ACTIVE);
37+
} else {
38+
console.warn(warningMessage);
39+
}
40+
},
41+
42+
fail: () => {
43+
'worklet';
44+
if (REANIMATED_AVAILABLE) {
45+
setGestureState(handlerTag, State.FAILED);
46+
} else {
47+
console.warn(warningMessage);
48+
}
49+
},
50+
51+
end: () => {
52+
'worklet';
53+
if (REANIMATED_AVAILABLE) {
54+
setGestureState(handlerTag, State.END);
55+
} else {
56+
console.warn(warningMessage);
57+
}
58+
},
59+
};
60+
}
61+
2162
export const GestureStateManager = {
22-
create(handlerTag: number): GestureStateManagerType {
23-
'worklet';
24-
return {
25-
begin: () => {
26-
'worklet';
27-
if (REANIMATED_AVAILABLE) {
28-
setGestureState(handlerTag, State.BEGAN);
29-
} else {
30-
console.warn(warningMessage);
31-
}
32-
},
33-
34-
activate: () => {
35-
'worklet';
36-
if (REANIMATED_AVAILABLE) {
37-
setGestureState(handlerTag, State.ACTIVE);
38-
} else {
39-
console.warn(warningMessage);
40-
}
41-
},
42-
43-
fail: () => {
44-
'worklet';
45-
if (REANIMATED_AVAILABLE) {
46-
setGestureState(handlerTag, State.FAILED);
47-
} else {
48-
console.warn(warningMessage);
49-
}
50-
},
51-
52-
end: () => {
53-
'worklet';
54-
if (REANIMATED_AVAILABLE) {
55-
setGestureState(handlerTag, State.END);
56-
} else {
57-
console.warn(warningMessage);
58-
}
59-
},
60-
};
61-
},
63+
create,
6264
};

0 commit comments

Comments
 (0)