iOS crash when starting to drag

[rousseau634]

I got this crash

libc++abi: terminating due to uncaught exception of type folly::ConversionError: Loss of precision during arithmetic conversion: (long long) 99.46

    <Carousel
      data={data}
      height={100}
      pagingEnabled={true}
      snapEnabled={true}
      width={Constants.DeviceWidth - 2 * 24}
      style={{
        marginTop: 24,
        alignItems: 'center',
        justifyContent: 'center',
        width: '100%',
        height: 160
      }}
      mode={'vertical-stack'}
      modeConfig={{
        snapDirection: 'left',
        stackInterval: 10
      }}
      customConfig={() => ({ type: 'positive', viewCount: 1 })}
      renderItem={InsightCarouselCell}
    />

Versions (please complete the following information):

• react: 18.3.1

• react-native: 0.76.0

• react-native-reanimated: 3.16.1

• react-native-reanimated-carousel: 4.0.0-canary.22

• react-native-gesture-handler: 2.21.2

• Device: iPhone16 Pro

• OS: iOS18.1

[dosubot]

Hey @rousseau634, I'm here to help you with your bug! I'm a bot designed to assist with bug fixes, answer questions, and guide you on your journey to becoming a contributor. Let's tackle this issue together!

The crash you're experiencing is due to a folly::ConversionError, which indicates a loss of precision during an arithmetic conversion. This type of error can occur when a value is being converted to a type that cannot accurately represent it, such as converting a floating-point number to an integer.

In the context of react-native-reanimated-carousel, this might be related to how drag events are handled, particularly in the arithmetic operations that calculate translations and velocities during gestures. The onGestureUpdate and onGestureEnd functions in the ScrollViewGesture component perform several arithmetic operations that could potentially lead to precision issues if not handled correctly ^[1].

To address this issue, you might want to:

1. Check if there are any recent updates or patches for the react-native-reanimated-carousel that address precision issues, especially in the version you are using (4.0.0-canary.22).
2. Review the code handling drag events to ensure that all arithmetic operations involving conversions are correctly managed, possibly by using functions that handle precision more robustly.
3. Consider logging the values involved in these operations to identify where the precision loss might be occurring.

If the issue persists, you may need to look into the specific arithmetic operations in your implementation or the library's code to ensure they are not causing precision errors.

To continue talking to Dosu, mention @dosu.

---

^{Help Dosu learn! Give it feedback: Great Response | Irrelevant Answer | Incorrect Sources | Too Verbose | Hallucination | Other}

[satnamSandhu2001]

Same issue in android also

"react-native-reanimated" : "^3.16.6"
"react-native-reanimated-carousel" : "^3.5.1"

[chinhfyb12]

same issue in expo also. I realized this bug was related to updating panOffset value in onGestureStart function which is implemented in ScrollViewGesture.tsx.

"react-native-reanimated": "~3.16.1"
"react-native-reanimated-carousel": "4.0.0-canary.19"

[satnamSandhu2001]

Only happens when using "mode"

[luimont]

Same issue with:

• "react": "18.3.1",
• "react-native": "0.76.5",
• "react-native-reanimated": "^3.16.1",
• "react-native-reanimated-carousel": "^3.5.1",
• "react-native-gesture-handler": "~2.20.2",

I was solve the issue with the next changes:

Replace the zIndex variable in node_modules/react-native-reanimated-carousel/src/layouts/parallax.ts
with this:

const zIndex = Math.round(interpolate(value, [-1, 0, 1], [0, size, 0]));

REFERENCE: #712 (comment)

[mustafasenturk]

Loss of precision during arithmetic conversion: (long long)

works, thanks