React-native-draggable-flatlist: flatlistRef.scrollToOffset is not a function

[canpoyrazoglu]

Describe the bug
When I drag an item to edge of the screen to activate scrolling to drag beyond the visible bounds, I get the following error:

TypeError: flatlistRef.scrollToOffset is not a function

The error originates along the lines:

     _this.scrollToAsync = function (offset) {
        return new Promise(function (resolve) {
          _this.resolveAutoscroll = resolve;

This used to work a few weeks ago. I've updated my package.json to latest versions of all packages and this error started appearing. But I don't know updating/changing what really broke this as I realized it today.

To Reproduce
Have a draggable flat list with items exceeding screen height. Try to drag an item to activate scroll threshold. It should normally start dragging the list up/down to drag the currently item anywhere on screen. Instead, it gives the warning above and doesn't scroll the list.

Platform & Dependencies
Please list any applicable dependencies in addition to those below (react-navigation etc).

• Platform: iOS 14.5
• React Native or Expo version: React Native 0.64
• Reanimated version: 1.13.2
• React Native Gesture Handler version: 1.10.3

Additional context
This wasn't the issue before and it used to scroll correctly before. It happened within a few weeks where I've updated many dependencies (and I don't know at which exact point this got broken as we weren't testing this part of the app).

[canpoyrazoglu]

I've also tried https://github.com/facebook/react-native/issues/27864#issuecomment-808058477 (after trying the original line I've went ahead and also tried replacing other occurrences too) but no avail.

[jonathancherry]

Also having this exact issue!

[shwethadn]

facing the same issue. any solution?

[krizpoon]

According to this SO answer, we could use flatlistRef.getNode() to get the underlying component. So as a quick fix (before the official fix), we could update

node_modules/react-native-draggable-flatlist/lib/index.js

if (flatlistRef)
  flatlistRef.scrollToOffset({ offset: offset });

to this:

if (flatlistRef) {
    if (flatlistRef.scrollToOffset) {
        flatlistRef.scrollToOffset({ offset: offset });
    } else if (flatlistRef.getNode) {
        flatlistRef.getNode().scrollToOffset({ offset: offset });
    }
}

Then preserve the patch with:

npx patch-package react-native-draggable-flatlist

[rhysdoliver]

@krizpoon that solution works for me, thanks!

[canpoyrazoglu]

Thanks for the workaround. Though, I'm keeping this open as we still need an official fix.

[computerjazz]

fixed in 2.6.2 https://github.com/computerjazz/react-native-draggable-flatlist/releases/tag/v2.6.2