openspacelabs / react-native-zoomable-view

A view component for react-native with pinch to zoom, tap to move and double tap to zoom capability.
MIT License
191 stars 58 forks source link

Android production crash #48

Open yuri-lomashko-itechart opened 1 year ago

yuri-lomashko-itechart commented 1 year ago

Description

Hello, I received few crashes from Crashlytics. They appears only in production and I can't reproduce it locally. Probably stacktrace may be useful here

Stacktrace

Fatal Exception: com.facebook.react.common.JavascriptException: TypeError: Cannot read property 'x' of null, js engine: hermes, stack:
./node_modules/@openspacelabs/react-native-zoomable-view/src/ReactNativeZoomableView.tsx:603:_handlePinching
./node_modules/@openspacelabs/react-native-zoomable-view/src/ReactNativeZoomableView.tsx:537:ReactNativeZoomableView
./node_modules/react-native/Libraries/Interaction/PanResponder.js:522:panHandlers.onResponderMove
./node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js:22:invokeGuardedCallbackImpl
./node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js:40:invokeGuardedCallback
./node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js:53:invokeGuardedCallbackAndCatchFirstError
./node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js:73:executeDispatch
./node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js:1125:executeDispatchesAndReleaseTopLevel
./node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js:361:forEachAccumulated
./node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js:1160:batchedUpdates$argument_0
./node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js:8427:batchedUpdatesImpl
./node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js:1106:batchedUpdates
./node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js:1137:_receiveRootNodeIDEvent
./node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js:1209:ReactNativePrivateInterface.RCTEventEmitter.register$argument_0.receiveTouches
./node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:423:__callFunction
./node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:113:__guard$argument_0
./node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:368:__guard
./node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:112:callFunctionReturnFlushedQueue

Environment

elliottkember commented 1 year ago

The line in question

I think the right solution here might just be to do something like:

if (!gestureCenterPoint) return;

right after that line, because gestureCenturePoint can be falsy. Would you mind making a pull request for that change?

thomasttvo commented 1 year ago

Seems like that function returns a null but isn't getting type-checked properly. This indicates a problem with the typescript setup

ndekross commented 1 month ago

We experienced a similar issue in our production app on Android device:

Stack trace as reported to Sentry:

TypeError Cannot read property 'x' of null

/node_modules/@openspacelabs/react-native-zoomable-view/src/ReactNativeZoomableView.tsx in _handlePinching at line 603:28
    }
    const gestureCenterPoint = calcGestureCenterPoint(e, gestureState);
    const zoomCenter = {
      x: gestureCenterPoint.x - this.state.originalPageX,
      y: gestureCenterPoint.y - this.state.originalPageY,
    };
    // Uncomment to debug
    this.props.debug && this._setPinchDebugPoints(e, zoomCenter);

/node_modules/@openspacelabs/react-native-zoomable-view/src/ReactNativeZoomableView.tsx in anonymous at line 513:27
/node_modules/react-native/Libraries/Interaction/PanResponder.js in onResponderMove at line 522:36
/node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js in invokeGuardedCallbackImpl at line 22:15
/node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js in invokeGuardedCallback at line 40:34
/node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js in invokeGuardedCallbackAndCatchFirstError at line 53:30
/node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js in executeDispatch at line 73:42
/node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js in executeDispatchesAndReleaseTopLevel at line 1125:24
/node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js in forEachAccumulated at line 361:35
/node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js in anonymous at line 1160:25
/node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js in batchedUpdatesImpl at line 8457:14
/node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js in batchedUpdates at line 1106:30
/node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js in _receiveRootNodeIDEvent at line 1137:17
/node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-prod.js in receiveTouches at line 1209:30
/node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js in __callFunction at line 433:34
/node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js in anonymous at line 113:26
/node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js in __guard at line 368:11
/node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js in callFunctionReturnFlushedQueue at line 112:17