horizontal snap does not work in react-native version 0.64, 0.65

[heekyu-pu]

Is this a bug report, a feature request, or a question?

Bug report

Have you followed the required steps before opening a bug report?

(Check the step you've followed - put an x character between the square brackets ([]).)

• [x] I have read the guidelines regarding bug report.
• [x] I have reviewed the documentation in its entirety, including the dedicated documentations :books:.
• [x] I have searched for existing issues and made sure that the problem hasn't already been reported.
• [x] I am using the latest plugin version.
• [x] I am following the issue template closely in order to produce a useful bug report.

Have you made sure that it wasn't a React Native bug?

Yes, It worked in react-native version 0.63.2 but does not work in 0.64.0, 0.65.0

Is the bug specific to iOS or Android? Or can it be reproduced on both platforms?

Android only

Is the bug reproductible in a production environment (not a debug one)?

Yes, it's production build

Environment

Environment: React: 17.0.2 React native: 0.65.1 react-native-snap-carousel: 3.9.1

Expected Behavior

Horizontal snap work

Actual Behavior

Horizontal snap does not work

Reproducible Demo

This problem only occurs in latest react-native versions. skip demo

Steps to Reproduce

1. problem occurs always in android devices

[kyo504]

@heekyu-pu This also may be related to this issue. Internally, scrollTo is called inside onScrollDragEnd but it does not work on Android since 0.64.x.

[jbolter]

We're currently running into this on RN 0.64. The scrollTo bug that was linked seems to only affect Android but I am seeing this on iOS also.

[dohooo]

@heekyu-pu Sorry, please allow me to advertise for my open source library! ~ I think this library react-native-reanimated-carousel will solve your problem. It is a high performance and very simple component, complete with React-Native reanimated 2

[27leaves]

I'm facing the problem right now that I updated Xcode and need react-native > 0.64 for the new tooling (0.63 uses deprecated Xcode tools that won't work with the new Xcode version), but as my app heavily relies on this library I can't use it. So this is pretty high-priority for me. Did anyone already do some research on that? Does this really rely on the onScrollDragEnd like @kyo504 suggested?

Edit: Oh now that I see your comment @jbolter I guess it's not related to the issue above. I'm also facing this on iOS as well.

[27leaves]

OK guys I have some news. For me it worked now after updating the lib from 0.65.0 to 0.65.1. So I'm sorry but that probably won't help you @heekyu-pu. What could help is that I debugged a bit and discovered that - at least in my case - it stopped in the function Carousel._getWrappedRef.

If you change this

    _getWrappedRef () {
        if (this._carouselRef && (
            (this._needsScrollView() && this._carouselRef.scrollTo) ||
            (!this._needsScrollView() && this._carouselRef.scrollToOffset)
        )) {
            return this._carouselRef;
        }
        // https://github.com/facebook/react-native/issues/10635
        // https://stackoverflow.com/a/48786374/8412141
        return this._carouselRef && this._carouselRef.getNode && this._carouselRef.getNode();
    }

to just

    _getWrappedRef () {
        return this._carouselRef;
    }

it worked for me. Not sure though if you can safely do that for all cases.

[jonathanm-tkf]

Same here, thanks

[penumbra23]

Issue confirmed also on 0.66

[poulou0]

Setting the decelerationRate={2} (any value >=2) makes the behavior a bit more predictable. Still not ideal but at least it always snaps in place, in my case.