Skip to content

Support React 19 (Remove findNodeHandle) #22

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
NovaBG03 opened this issue May 29, 2025 · 0 comments
Open

Support React 19 (Remove findNodeHandle) #22

NovaBG03 opened this issue May 29, 2025 · 0 comments

Comments

@NovaBG03
Copy link

Hi ! 👋
Firstly, thanks for your work on this project! 🙂

📋 Description

When using React 19, RefreshControl.web.js currently attempts to access the element via React Native’s findNodeHandle, which no longer works. This patch replaces findNodeHandle with direct traversal (ref.current.firstChild), restoring compatibility with React 19+.

🐛 Steps to Reproduce

  1. Install React 19 in your project.
  2. Add react-native-web-refresh-control@1.1.2.
  3. Try pulling to refresh a scrollable container on the web.
  4. Observe that an error is thrown.

🤔 Expected Behavior

Pull-to-refresh should work as before: dragging down when the container is scrolled to the top should trigger the refresh indicator and the onRefresh callback.

🔧 Patch Diff

diff --git a/node_modules/react-native-web-refresh-control/src/RefreshControl.web.js b/node_modules/react-native-web-refresh-control/src/RefreshControl.web.js
index b2351e6..c638d23 100644
--- a/node_modules/react-native-web-refresh-control/src/RefreshControl.web.js
+++ b/node_modules/react-native-web-refresh-control/src/RefreshControl.web.js
@@ -1,5 +1,5 @@
 import React, { useRef, useEffect, useCallback, useMemo } from 'react'
-import { View, Text, PanResponder, Animated, ActivityIndicator, findNodeHandle } from 'react-native'
+import { View, Text, PanResponder, Animated, ActivityIndicator } from 'react-native'
 import PropTypes from 'prop-types'
 
 const arrowIcon =
@@ -77,9 +77,9 @@ export default function RefreshControl({
       onStartShouldSetPanResponderCapture: () => false,
       onMoveShouldSetPanResponder: (_, gestureState) => {
         if (!containerRef.current) return false
-        const containerDOM = findNodeHandle(containerRef.current)
-        if (!containerDOM) return false
-        return containerDOM.children[0].scrollTop === 0
+        const scrollContainer = containerRef.current?.firstChild
+        if (!scrollContainer) return false
+        return scrollContainer.scrollTop === 0
         && (Math.abs(gestureState.dy) > Math.abs(gestureState.dx) * 2
          && Math.abs(gestureState.vy) > Math.abs(gestureState.vx) * 2.5)
       },

💡 Additional Context

This issue body was partially generated by patch-package.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant