necolas/react-native-web · error · Error

findNodeHandle is not supported on web. Use the ref property

Error message

findNodeHandle is not supported on web. Use the ref property on the component instead.

What it means

findNodeHandle relies on native host component instances that don't exist in the DOM; react-native-web exports it as a stub that always throws. Developers should use refs (DOM nodes) directly. There is no path that returns a handle — any call fails.

Source

Thrown at packages/react-native-web/src/exports/findNodeHandle/index.js:12

/**
 * Copyright (c) Nicolas Gallagher.
 * Copyright (c) Meta Platforms, Inc. and affiliates.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 *
 * @noflow
 */

const findNodeHandle = (component) => {
  throw new Error(
    'findNodeHandle is not supported on web. ' +
      'Use the ref property on the component instead.'
  );
};

export default findNodeHandle;

View on GitHub (pinned to a9de220ba9)

Solutions

  1. Replace with the ref directly: ref.current is the DOM node on web — pass it where a node is needed.
  2. For measure-like needs, read node.getBoundingClientRect() / getComputedStyle instead of native measure.
  3. Guard library code: use Platform.OS checks or optional shims so findNodeHandle is only called on native.
  4. Set the DOM node via callback ref and store it for later use.

Example fix

// before
const handle = findNodeHandle(ref.current);
// after
const node = ref.current; // DOM element on web
const rect = node && node.getBoundingClientRect();
Defensive patterns

Strategy: fallback

Validate before calling

import { Platform } from 'react-native';
if (Platform.OS === 'web') {
  // never call findNodeHandle; use ref.current directly
}

Type guard

const isWeb = () => Platform.OS === 'web' || typeof document !== 'undefined';

Try / catch

function getNode(ref) {
  try { return findNodeHandle(ref.current); }
  catch (e) { if (/not supported on web/.test(e.message)) return ref.current; throw e; }
}

Prevention

When it happens

Trigger: Calling findNodeHandle(ref.current) (or importing the module and invoking it) anywhere in a react-native-web app.

Common situations: Porting RN libraries that use findNodeHandle for measure/accessibility/scroll APIs; copying native-only code (e.g. camera, animation libs) to web; RN's own docs examples using findNodeHandle.

Related errors


AI-assisted analysis of necolas/react-native-web@a9de220ba9 (2026-09-01). Data as JSON: /api/errors/999e170a34c13666. Report an issue: GitHub.