facebook/react · error · Error

161

161

Error message

Invalid host parent fiber. This error is likely caused by a bug in React. Please file an issue.

What it means

commitPlacement() found a host parent fiber whose tag matched no case in the placement switch - only HostSingleton, HostComponent, HostRoot, and HostPortal are handled. The set of tags the walker accepts (isHostParent) and the set the switch handles must agree; disagreement means the fiber came from React internals with a different feature set than the host config running the commit.

Source

Thrown at packages/react-reconciler/src/ReactFiberCommitHostEffects.js:538

        parent,
        parentFragmentInstances,
      );
      break;
    }
    case HostRoot:
    case HostPortal: {
      const parent: Container = hostParentFiber.stateNode.containerInfo;
      const before = getHostSibling(finishedWork);
      insertOrAppendPlacementNodeIntoContainer(
        finishedWork,
        before,
        parent,
        parentFragmentInstances,
      );
      break;
    }
    default:
      throw new Error(
        'Invalid host parent fiber. This error is likely caused by a bug ' +
          'in React. Please file an issue.',
      );
  }
}

function commitImmutablePlacementNodeToFragmentInstances(
  finishedWork: Fiber,
  parentFragmentInstances: null | Array<FragmentInstanceType>,
): void {
  if (!enableFragmentRefs) {
    return;
  }
  const isHost =
    finishedWork.tag === HostComponent ||
    // $FlowFixMe[constant-condition]
    (supportsSingletons ? finishedWork.tag === HostSingleton : false);
  if (isHost) {

View on GitHub (pinned to eafeac097b)

Solutions

Dedupe react, react-dom, and react-reconciler to one version using npm overrides/resolutions
Upgrade the custom renderer package so its reconciler matches your react version
Renderer maintainers: rebuild against the react-reconciler version you ship
If all versions align, file an issue with the fiber tag number from the component stack

Defensive patterns

Strategy: validation

Validate before calling

import {version} from 'react';
import * as reconciler from 'react-reconciler';
if (reconciler.version && reconciler.version.split('.')[0] !== version.split('.')[0]) {
  throw new Error(`react ${version} + react-reconciler ${reconciler.version}: align versions before rendering`);
}

Prevention

Keep react, react-dom, and every react-reconciler-based renderer on the same release
Verify host config feature flags (supportsSingletons, supportsMutation) match the environment you render into
Run npm ls react react-dom react-reconciler in CI and fail on duplicates

When it happens

Trigger: Version skew: a react-reconciler copy emitting newer host tags (for example HostSingleton) paired with an older renderer; a custom renderer built with supportsSingletons: false receiving HostSingleton fibers; host feature flags mismatched between reconciler and renderer packages.

Common situations: Custom renderers (ink, react-three-fiber, react-pdf) whose pinned react-reconciler resolves to a different version than the app's react; partially upgraded monorepos; bundler aliases resolving react-dom to an older copy.

Related errors

AI-assisted analysis of facebook/react@eafeac097b (2026-08-21). Data as JSON: /api/errors/6c7f95013c085178. Report an issue: GitHub.