software-mansion / react-native-reanimated

React Native's Animated library reimplemented
https://docs.swmansion.com/react-native-reanimated/
MIT License
8.83k stars 1.29k forks source link

Attempted to use private field on non-instance #6422

Open konstantinrachev opened 3 weeks ago

konstantinrachev commented 3 weeks ago

Description

I am getting the following error:

` ERROR TypeError: attempted to use private field on non-instance

This error is located at: in GestureDetector (created by BottomSheetDraggableViewComponent) in BottomSheetDraggableViewComponent (created by BottomSheet) in RCTView (created by View) in View (created by AnimatedComponent(View)) in AnimatedComponent(View) in Unknown (created by BottomSheet) in RCTView (created by View) in View (created by AnimatedComponent(View)) in AnimatedComponent(View) in Unknown (created by BottomSheet) in RCTView (created by View) in View (created by BottomSheetContainerComponent) in BottomSheetContainerComponent (created by BottomSheet) in BottomSheetGestureHandlersProvider (created by BottomSheet) in BottomSheet (created by BottomSheet) in RCTView (created by View) in View (created by SingleRecipe) in PortalProviderComponent (created by BottomSheetModalProviderWrapper) in BottomSheetModalProviderWrapper (created by SingleRecipe) in SingleRecipe (created by SceneView) in StaticContainer in EnsureSingleNavigator (created by SceneView) in SceneView (created by SceneView) in RCTView (created by View) in View (created by DebugContainer) in DebugContainer (created by MaybeNestedStack) in MaybeNestedStack (created by SceneView) in RCTView (created by View) in View (created by SceneView) in RNSScreen (created by Animated(Anonymous)) in Animated(Anonymous) in Suspender (created by Freeze) in Suspense (created by Freeze) in Freeze (created by DelayedFreeze) in DelayedFreeze in InnerScreen (created by Screen) in Screen (created by SceneView) in SceneView (created by NativeStackViewInner) in Suspender (created by Freeze) in Suspense (created by Freeze) in Freeze (created by DelayedFreeze) in DelayedFreeze (created by ScreenStack) in RNSScreenStack (created by ScreenStack) in ScreenStack (created by NativeStackViewInner) in NativeStackViewInner (created by NativeStackView) in RCTView (created by View) in View (created by SafeAreaProviderCompat) in SafeAreaProviderCompat (created by NativeStackView) in NativeStackView (created by NativeStackNavigator) in PreventRemoveProvider (created by NavigationContent) in NavigationContent in Unknown (created by NativeStackNavigator) in NativeStackNavigator (created by App) in EnsureSingleNavigator in BaseNavigationContainer in ThemeProvider in NavigationContainerInner (created by App) in RNCSafeAreaProvider (created by SafeAreaProvider) in SafeAreaProvider (created by App) in RCTView (created by View) in View (created by GestureHandlerRootView) in GestureHandlerRootView (created by App) in App in RCTView (created by View) in View (created by AppContainer) in RCTView (created by View) in View (created by AppContainer) in AppContainer in Manager(RootComponent), js engine: hermes`

The issue is presented when using @gorhom/bottom-sheet suddenly and without any updates done. As I tried with the latest version that is 100% compatible with both Reanimated v3, nothing positive happened.

Steps to reproduce

  1. Install @gorhom/bottom-sheet
  2. Use BottomSheetModal.

Snack or a link to a repository

https://snack.expo.dev/KtLghhenAFD1Wy99EmJ16

Reanimated version

3.15.0

React Native version

0.74.2

Platforms

Android, iOS, macOS

JavaScript runtime

Hermes

Workflow

React Native

Architecture

Fabric (New Architecture)

Build type

Debug app & dev bundle

Device

iOS simulator

Device model

No response

Acknowledgements

Yes

MatiPl01 commented 2 weeks ago

Hey!

Could you please provide a repro?

I tested on a clean project (old and new architecture) and everything seems to work fine. My versions of dependencies:

"dependencies": {
    "@gorhom/bottom-sheet": "^4.6.4",
    "react": "18.2.0",
    "react-native": "0.74.2",
    "react-native-gesture-handler": "^2.18.1",
    "react-native-reanimated": "^3.15.0"
  }

Example recording

https://github.com/user-attachments/assets/945841af-06a3-44f1-9b16-61728c064a11

Code I used for testing ```tsx import { BottomSheetModal, BottomSheetModalProvider, BottomSheetView, } from '@gorhom/bottom-sheet'; import {useEffect, useRef, useState} from 'react'; import {Button, SafeAreaView, Text, View} from 'react-native'; import {GestureHandlerRootView} from 'react-native-gesture-handler'; export default function App() { const [isOpen, setIsOpen] = useState(false); const modalRef = useRef(null); useEffect(() => { if (modalRef.current) { if (isOpen) { modalRef.current.present(); } else { modalRef.current.dismiss(); } } }, [isOpen]); return (