Skip to content

Commit 48d674b

Browse files
authored
Do not check for worklets if babel plugin was not used (#4107)
## Description In some environments babel plugin is not used (e.g. it can be omitted when using `Next.js`). Our detector checks if callbacks are `worklets` by checking `__workletHash` field. However, if plugin wasn't used, this will be `undefined`. In that case, our warning will wrongly suggest to use `runOnJS`. This may be misleading, if plugin was skipped on `web`, but used on native platforms. In this PR, we check if plugin was applied by checking empty worklet function. If it has `__workletHash` field it means that plugin was used. If it wasn't, we won't suggest using `runOnJS`. ## Test plan Confirmed by the original reporter
1 parent 118775a commit 48d674b

1 file changed

Lines changed: 11 additions & 1 deletion

File tree

  • packages/react-native-gesture-handler/src/handlers/gestures/GestureDetector

packages/react-native-gesture-handler/src/handlers/gestures/GestureDetector/utils.ts

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,16 @@ export const ALLOWED_PROPS = [
3636
...nativeViewGestureHandlerProps,
3737
];
3838

39+
// In some environments (e.g. `Next.js`) Reanimated Babel plugin might not be used.
40+
// In that case we would wrongly suggest to add `runOnJS` to gesture configuration, even if the user doesn't use worklets at all.
41+
// To prevent this, we check whether the plugin is enabled by defining a worklet and checking if the `__workletHash` property is available.
42+
function emptyWorklet() {
43+
'worklet';
44+
}
45+
46+
// @ts-expect-error if `emptyWorklet` is a worklet, `__workletHash` will be available, if not then the check will return false.
47+
const wasBabelPluginEnabled = emptyWorklet.__workletHash !== undefined;
48+
3949
function convertToHandlerTag(ref: GestureRef): number {
4050
if (typeof ref === 'number') {
4151
return ref;
@@ -105,7 +115,7 @@ export function checkGestureCallbacksForWorklets(gesture: GestureType) {
105115
const areAllNotWorklets = !areSomeWorklets && areSomeNotWorklets;
106116
// If none of the callbacks are worklets and the gesture is not explicitly marked with
107117
// `.runOnJS(true)` show a warning
108-
if (areAllNotWorklets && !isTestEnv()) {
118+
if (areAllNotWorklets && wasBabelPluginEnabled && !isTestEnv()) {
109119
console.warn(
110120
tagMessage(
111121
`None of the callbacks in the gesture are worklets. If you wish to run them on the JS thread use '.runOnJS(true)' modifier on the gesture to make this explicit. Otherwise, mark the callbacks as 'worklet' to run them on the UI thread.`

0 commit comments

Comments
 (0)