facebook/react · error · Error

544

544

Error message

Found a pair with an auto name. This is a bug in React.

What it means

During View Transition pairing, commitAppearingPairViewTransitions() walks a newly placed subtree looking for <ViewTransition> boundaries flagged (ViewTransitionNamedStatic) as paired with a deleted boundary of the same name. A paired boundary must carry an explicit name; auto-named boundaries never qualify for pairing. Finding instance.paired with name null or 'auto' means the pairing pass marked a boundary that the naming pass did not.

Source

Thrown at packages/react-reconciler/src/ReactFiberCommitViewTransitions.js:295

  if ((placement.subtreeFlags & ViewTransitionNamedStatic) === NoFlags) {
    // This has no named view transitions in its subtree.
    return;
  }
  let child = placement.child;
  while (child !== null) {
    if (child.tag === OffscreenComponent && child.memoizedState !== null) {
      // This tree was already hidden so we skip it.
    } else {
      commitAppearingPairViewTransitions(child);
      if (
        child.tag === ViewTransitionComponent &&
        (child.flags & ViewTransitionNamedStatic) !== NoFlags
      ) {
        const instance: ViewTransitionState = child.stateNode;
        if (instance.paired) {
          const props: ViewTransitionProps = child.memoizedProps;
          if (props.name == null || props.name === 'auto') {
            throw new Error(
              'Found a pair with an auto name. This is a bug in React.',
            );
          }
          const name = props.name;
          const className: ?string = getViewTransitionClassName(
            props.default,
            props.share,
          );
          if (className !== 'none') {
            // We found a new appearing view transition with the same name as this deletion.
            // We'll transition between them.
            const inViewport = applyViewTransitionToHostInstances(
              child,
              name,
              className,
              null,
              false,
            );

View on GitHub (pinned to eafeac097b)

Solutions

  1. Update the experimental/canary build - ViewTransition pairing logic changes frequently
  2. Give boundaries that enter/exit stable explicit names instead of the default auto name
  3. Avoid deleting and re-adding the same-named boundary in one update; key it and update in place
  4. File an issue with the enter/exit repro if it persists on the latest experimental build

Example fix

// before - default (auto) name on a boundary that pairs
<ViewTransition>{item && <Row id={1} />}</ViewTransition>

// after - stable explicit name for boundaries that enter/exit
<ViewTransition name="row-1">{item && <Row id={1} />}</ViewTransition>
Defensive patterns

Strategy: try-catch

Try / catch

Commit-phase invariant: not catchable by ErrorBoundaries. Capture via onUncaughtError including the names of the ViewTransition boundaries involved, report to the experimental channel thread or issue tracker, and remount.

Prevention

When it happens

Trigger: Rendering experimental <ViewTransition> components where an enter animation must pair with an exit of the same name, under a canary build whose pairing algorithm is inconsistent; updates that delete and re-insert named view-transition subtrees in a single commit.

Common situations: Prototyping with the experimental ViewTransition API (canary/experimental channel); lists whose items enter and leave in one update; gesture transitions layered on top of ViewTransition.

Related errors


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