Update reanimated to v3

[elencho]

Description

After updating react native to 0.71.4 I had to update libraries also, After building app I get error : Cannot read property 'code' of undefined. This is because gesture-handler doesn't support reanimated v3 yet. see similar issue

P.S. it only occurs on Debug Mode

Steps to reproduce

1. Build app
2. add reanimated v3

Snack or a link to a repository

https://gist.github.com/elencho/01292c9e1a5c2099e7546207859b38db

Gesture Handler version

2.9.0

React Native version

0.71.4

Platforms

Android, iOS

JavaScript runtime

Hermes

Workflow

Expo managed workflow

Architecture

Fabric (New Architecture)

Build type

Debug mode

Device

iOS simulator

Device model

iPhone 12

Acknowledgements

Yes

[github-actions[bot]]

Hey! 👋

The issue doesn't seem to contain a minimal reproduction.

Could you provide a snack or a link to a GitHub repository under your username that reproduces the problem?

[j-piasecki]

Could you post more information about the error? Could you prepare a repository that would allow us to reproduce the error easily?

We've been testing Gesture Handler alongside Reanimated 3 pretty much since the beginning of its development, but it's possible we've missed some use cases.

[CMLCNL]

Could you please help me understand the cause of this error and how it can be resolved? Thank you!

System: OS: macOS 13.2 CPU: (10) arm64 Apple M1 Pro Memory: 79.42 MB / 16.00 GB Shell: 5.8.1 - /bin/zsh Binaries: Node: 14.17.4 - ~/.nvm/versions/node/v14.17.4/bin/node Yarn: Not Found npm: 6.14.14 - ~/.nvm/versions/node/v14.17.4/bin/npm Watchman: Not Found Managers: CocoaPods: 1.12.0 - /usr/local/bin/pod SDKs: iOS SDK: Platforms: DriverKit 22.2, iOS 16.2, macOS 13.1, tvOS 16.1, watchOS 9.1 Android SDK: Not Found IDEs: Android Studio: 2022.1 AI-221.6008.13.2211.9619390 Xcode: 14.2/14C18 - /usr/bin/xcodebuild Languages: Java: 11.0.16.1 - /usr/bin/javac npmPackages: @react-native-community/cli: Not Found react: 18.2.0 => 18.2.0 react-native: 0.71.6 => 0.71.6 react-native-macos: Not Found npmGlobalPackages: react-native: Not Found

[j-piasecki]

Have you tried resetting metro cache?

yarn start --reset-cache

or

npm start -- --reset-cache

[CHANDRAMOHANnegi]

Failed to print error: Cannot read properties of undefined (reading 'apply')

2023-05-11 19:26:31.595 31512-31512 ReactNative com.myapp I [GESTURE HANDLER] Tearing down gesture handler registered for root view com.facebook.react.ReactRootView{2b3512c V.E...... ......ID 0,0-1440,2420 #1}

App unresponsive on updating to reanimated 3

react-native : "0.69.7" "react-native-gesture-handler": "2.9.0" or "2.10.0" "react-native-reanimated": "^3.1.0"

[ShchipskiiYura]

I also have problem with reanimated 3

ReanimatedError: Cannot read property '__workletHash' of undefined, js engine: reanimated

"react-native": "0.73.0" "react-native-gesture-handler": "^2.14.0" "react-native-reanimated": "^3.6.1"

Please tell me when to expect an update?

[m-bert]

Hi!

@elencho do you still get this error? Have you tried solution mentioned here?

Beside that, have you tested that on newest versions of gesture handler (2.14.0) and reanimated (3.6.1)? If so, have you followed installation steps? Make sure to run yarn and pod install after updating reanimated. Starting with --reset-cache should help. If not, you can also try to reinstall your app.

If the issue still occurs after going through all the above steps, please prepare a reproduction - this way it will be easier for us to see what causes this issue.

[sansavision]

I also have problem with reanimated 3

ReanimatedError: Cannot read property '__workletHash' of undefined, js engine: reanimated

"react-native": "0.73.0" "react-native-gesture-handler": "^2.14.0" "react-native-reanimated": "^3.6.1"

Please tell me when to expect an update?

I believe you're facing this problem because of the order of your functions, put your worklet function below the function you're trying to run.

[nabzmohd]

I also have problem with reanimated 3

ReanimatedError: Cannot read property '__workletHash' of undefined, js engine: reanimated

"react-native": "0.73.0" "react-native-gesture-handler": "^2.14.0" "react-native-reanimated": "^3.6.1"

Please tell me when to expect an update?

did u get any update for this problem?

[WCW0310]

I also have problem with reanimated 3 ReanimatedError: Cannot read property '__workletHash' of undefined, js engine: reanimated "react-native": "0.73.0" "react-native-gesture-handler": "^2.14.0" "react-native-reanimated": "^3.6.1" Please tell me when to expect an update?

did u get any update for this problem?

follow @sansavision 's reply create a function wrap what you want to do then call it in 'worklet' function this work for me

const wrapperFun = () => {
    ...what you want to do...
  }

  return (
    <Reanimated.View
      entering={SlideInDown}
      exiting={SlideOutDown.withCallback(finished => {
        'worklet'
        if (finished) {
          runOnJS(wrapperFun)()
        }
      })}
...