Skip to content
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

chore: updated reanimated to v3 #1324

Merged
merged 3 commits into from
Mar 18, 2023
Merged

chore: updated reanimated to v3 #1324

merged 3 commits into from
Mar 18, 2023

Conversation

gorhom
Copy link
Owner

@gorhom gorhom commented Mar 18, 2023

Motivation

Part of the requirements for #1125 , i have updated reanimated to v3 and react native to 71.

Known Issues

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

this issue is triggered when calling Keyboard.dismiss on JS thread, seems related to software-mansion/react-native-reanimated#4201.

@gorhom gorhom added the v5 label Mar 18, 2023
@gorhom
Copy link
Owner Author

gorhom commented Mar 18, 2023

LGTM 🗿

@gorhom gorhom self-assigned this Mar 18, 2023
@gorhom gorhom merged commit 4829316 into v5 Mar 18, 2023
@gorhom gorhom deleted the chore/update-reanimated branch March 18, 2023 21:27
@YaoHuiJi
Copy link

hi, @gorhom , I've tried 5.0.0-alpha.0 , but the issue ERROR ReanimatedError: Cannot read property '__remoteFunction' of undefined, js engine: reanimated is still here. I have cleaned the cache and rebuilt the xcode project, but nothing works.

@gorhom
Copy link
Owner Author

gorhom commented Mar 20, 2023

@YaoHuiJi it is related to software-mansion/react-native-reanimated#4201, it only occurs in development

@YaoHuiJi
Copy link

YaoHuiJi commented Mar 21, 2023

hi @gorhom , I tried to run it in release mode, but the error still seems to be there, here is the xcode log:

libc++abi: terminating with uncaught exception of type facebook::jsi::JSError: Cannot read property '__remoteFunction' of undefined

TypeError: Cannot read property '__remoteFunction' of undefined
    at runOnJS (JavaScript:1:83)
    at handleOnEnd (JavaScript:1:1308)
    at anonymous (JavaScript:1:215)
    at apply (native)
    at runWorklet (JavaScript:1:207)
    at anonymous (JavaScript:1:886)
    at handleAndFlushImmediates (JavaScript:1:143)
dyld4 config: DYLD_LIBRARY_PATH=/usr/lib/system/introspection DYLD_INSERT_LIBRARIES=/Developer/usr/lib/libBacktraceRecording.dylib:/Developer/usr/lib/libMainThreadChecker.dylib:/Developer/Library/PrivateFrameworks/DTDDISupport.framework/libViewDebuggerSupport.dylib:/usr/lib/libMTLCapture.dylib
terminating with uncaught exception of type facebook::jsi::JSError: Cannot read property '__remoteFunction' of undefined

TypeError: Cannot read property '__remoteFunction' of undefined
    at runOnJS (JavaScript:1:83)
    at handleOnEnd (JavaScript:1:1308)
    at anonymous (JavaScript:1:215)
    at apply (native)
    at runWorklet (JavaScript:1:207)
    at anonymous (JavaScript:1:886)
    at handleAndFlushImmediates (JavaScript:1:143)

In my app, when the keyboard is open( a BottomSheetTextInput in bottom sheet modal has the focus), then If you drag the bottom sheet modal to resize it to another snap point, this error will occur.

@malikzype
Copy link

malikzype commented Mar 21, 2023

@gorhom We face a similar issue on Android and it usually occurs because of BackdropComponent with reanimated v3.0.2. Any plans of rolling v5 out soon?

@AfrazHussain
Copy link

I didn't get enough time to dig deep into this, but I can confirm that there seems to be issues with the Backdrop, BottomSheetFlatList Components only while using fabric. After I turn fabric off, everything seems to be okay.
While using fabric and BottomSheetFlatList, I get the error TypeError: Cannot read property 'stateNode' of undefined, which was also reported (not by me) in this reanimated issue software-mansion/react-native-reanimated#3534. If I use RN FlatList, then there seems to be no issues.

"react-native-maps": "^0.30.1",
"react-native-pager-view": "^5.4.24",
"react-native-reanimated": "~2.12.0",
"react-native-reanimated": "~2.14.4",
Copy link

@DalYoon DalYoon Mar 27, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi 👋, @gorhom I have a question
Isn't this PR for updating reanimated v3?
I'm wondering why the changed version is v2.14.4 of it.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, why is this using reanimated 2.14.4?

@levipro
Copy link

levipro commented Mar 28, 2023

@gorhom I have resolved the error ERROR ReanimatedError: Cannot read property '__remoteFunction' of undefined, js engine: reanimated by defining the callback for runOnJS with an arrow function:

diff --git a/node_modules/@gorhom/bottom-sheet/src/hooks/useGestureEventsHandlersDefault.tsx b/node_modules/@gorhom/bottom-sheet/src/hooks/useGestureEventsHandlersDefault.tsx
index b44bfa5..0b029d3 100644
--- a/node_modules/@gorhom/bottom-sheet/src/hooks/useGestureEventsHandlersDefault.tsx
+++ b/node_modules/@gorhom/bottom-sheet/src/hooks/useGestureEventsHandlersDefault.tsx
@@ -44,6 +44,10 @@ export const useGestureEventsHandlersDefault: GestureEventsHandlersHookType =
     } = useBottomSheetInternal();
     //#endregion
 
+    const dismissKeyboard = () => {
+      Keyboard.dismiss();
+    };
+
     //#region gesture methods
     const handleOnStart: GestureEventHandlerCallbackType<GestureEventContextType> =
       useWorkletCallback(
@@ -296,7 +300,7 @@ export const useGestureEventsHandlersDefault: GestureEventsHandlersHookType =
                 absoluteY > WINDOW_HEIGHT - animatedKeyboardHeight.value
               )
             ) {
-              runOnJS(Keyboard.dismiss)();
+              runOnJS(dismissKeyboard)();
             }
           }
 

@YaoHuiJi
Copy link

@levipro thank you! it works!

@fgagneten
Copy link

fgagneten commented Mar 30, 2023

I didn't get enough time to dig deep into this, but I can confirm that there seems to be issues with the Backdrop, BottomSheetFlatList Components only while using fabric. After I turn fabric off, everything seems to be okay. While using fabric and BottomSheetFlatList, I get the error TypeError: Cannot read property 'stateNode' of undefined, which was also reported (not by me) in this reanimated issue software-mansion/react-native-reanimated#3534. If I use RN FlatList, then there seems to be no issues.

Same issue using BottomSheetVirtualizedList + Fabric. Using just VirtualizedList from RN fixes the error, but the BottomSheet does not work as expected

@fgagneten
Copy link

@gorhom I also tested with the last 5.0.0-alpha0 version and same error

@francozini2
Copy link

francozini2 commented Mar 30, 2023

I didn't get enough time to dig deep into this, but I can confirm that there seems to be issues with the Backdrop, BottomSheetFlatList Components only while using fabric. After I turn fabric off, everything seems to be okay. While using fabric and BottomSheetFlatList, I get the error TypeError: Cannot read property 'stateNode' of undefined, which was also reported (not by me) in this reanimated issue software-mansion/react-native-reanimated#3534. If I use RN FlatList, then there seems to be no issues.

Same issue using BottomSheetVirtualizedList + Fabric. Using just VirtualizedList from RN fixes the error, but the BottomSheet does not work as expected

+1 Started having the same issue after enabling the new arch

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

9 participants