v15.3.canary-0 with `viewTransitions` enabled breaks re-ordering components

[mhornbacher]

Link to the code that reproduces this issue

https://github.com/mhornbacher/nextjs-view-transitions-bug

To Reproduce

1. Start the application in dev mode (next dev)
2. Visit the application at localhost:3000 (or whatever port it starts up on
3. Press on any header row to change the sorting order (either the column or descending)
4. See the error (see below for details)
5. Change experimental.viewTransition to false in next.config.ts
6. Try again and see the behavior is gone

Current vs. Expected behavior

It should sort the list correctly like it does with viewTransition disabled.

Currently it throws the following exception since the 15.3.0-canary.0 release (here is the commit diff of the breaking version)

error-boundary-callbacks.js:85 Uncaught TypeError: parentInstance.moveBefore is not a function
    at appendChild (react-dom-client.development.js:23281:26)
    at insertOrAppendPlacementNode (react-dom-client.development.js:13478:13)
    at insertOrAppendPlacementNode (react-dom-client.development.js:13491:11)
    at commitPlacement (react-dom-client.development.js:13549:11)
    at runWithFiberInDEV (react-dom-client.development.js:885:30)
    at commitReconciliationEffects (react-dom-client.development.js:15477:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:14939:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:15152:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:14938:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:15441:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:15441:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:15239:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:14938:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:15441:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:14938:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:15441:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:15441:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:15441:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:15152:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:14938:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:14938:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:14938:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:14938:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:15441:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:15441:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:14938:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:14954:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
    at commitMutationEffectsOnFiber (react-dom-client.development.js:14938:11)
    at recursivelyTraverseMutationEffects (react-dom-client.development.js:14924:11)
appendChild @ react-dom-client.development.js:23281
insertOrAppendPlacementNode @ react-dom-client.development.js:13478
insertOrAppendPlacementNode @ react-dom-client.development.js:13491
commitPlacement @ react-dom-client.development.js:13549
runWithFiberInDEV @ react-dom-client.development.js:885
commitReconciliationEffects @ react-dom-client.development.js:15477
commitMutationEffectsOnFiber @ react-dom-client.development.js:14939
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15152
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15441
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15441
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15239
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15441
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15441
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15441
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15441
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15152
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15441
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15441
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14954
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14954
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14954
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15441
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15137
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15137
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15441
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14954
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14954
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14954
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15441
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15441
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15441
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15441
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15441
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15441
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14954
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15441
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:14938
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15441
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15441
recursivelyTraverseMutationEffects @ react-dom-client.development.js:14924
commitMutationEffectsOnFiber @ react-dom-client.development.js:15212
flushMutationEffects @ react-dom-client.development.js:18822
commitRoot @ react-dom-client.development.js:18779
commitRootWhenReady @ react-dom-client.development.js:17815
performWorkOnRoot @ react-dom-client.development.js:17714
performSyncWorkOnRoot @ react-dom-client.development.js:19951
flushSyncWorkAcrossRoots_impl @ react-dom-client.development.js:19791
processRootScheduleInMicrotask @ react-dom-client.development.js:19834
eval @ react-dom-client.development.js:19970

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 24.4.0: Fri Apr 11 18:32:50 PDT 2025; root:xnu-11417.101.15~117/RELEASE_ARM64_T6041
  Available memory (MB): 49152
  Available CPU cores: 14
Binaries:
  Node: 23.11.0
  npm: 10.9.2
  Yarn: N/A
  pnpm: 10.10.0
Relevant Packages:
  next: 15.4.0-canary.31 // Latest available version is detected (15.4.0-canary.31).
  eslint-config-next: N/A
  react: 19.1.0
  react-dom: 19.1.0
  typescript: 5.8.3
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

Not sure

Which stage(s) are affected? (Select all that apply)

next dev (local), next build (local), next start (local)

Additional context

I am using the react-aria-components library as an easy example as the nested way to trigger this is most evident using this library. But it can be anything that re-organizes the elements on the page based on complex state logic.

[devongovett]

This is a React or React Aria Components issue, not a Next.js one. I opened a PR for React here: facebook/react#33177.

[Hiraqui]

Hi, I was having the same issue with the https://github.com/rjsf-team/react-jsonschema-form lib.

Are you sure @devongovett?

In nextjs v15.2.0 the transitions are working and the reorder as well, this started happening after v15.3.

Here's a repro with canary (same result with ^15.3):
https://codesandbox.io/p/devbox/serene-hypatia-4xhp8s

And here is the working code where I only changed nextjs version to 15.2.0
https://codesandbox.io/p/devbox/json-schema-bug-forked-wd437y?workspaceId=ws_F4Ucu8TTaRzzm76X1xr7Se

As you can see the react version is the same (19.1.0)

[devongovett]

I'm not seeing the same issue in your example. It is not crashing with the above error for me. Both examples seem to be working the same way.

[Hiraqui]

It's not crashing with the error above you are right, but in the first example, after reordering, the buttons are not updated and stop working.

Broken:

broken.schema.array.mp4

Working:

working.schema.array.mp4

Also I opened the repo from @mhornbacher in codesandbox, downgraded to v15.2.0 and it does not break anymore:

https://codesandbox.io/p/devbox/sleepy-tree-hs58tg?workspaceId=ws_F4Ucu8TTaRzzm76X1xr7Se

That's why I think they might be related, but I could open a new PR if necessary for my scenario.

[mhornbacher]

@devongovett I raised an issue there as well but it seems to be a viewTransition issue was without the flag it works just fine and the crash occurs within the ReactJS dev runtime.

[ztanner]

This is a React or React Aria Components issue, not a Next.js one. I opened a PR for React here: facebook/react#33177.

This is correct, and it'll be best to track the issue there for now.

When using App Router, Next.js automatically bundles a version of React that is most compatible with React APIs that are needed for Next.js to function, regardless of what you specify in package.json. We regularly sync React into Next.js when builds are published.

Toggling on particular experimental flags, such as viewTransition or PPR, opts into the experimental builds of React where more bleeding edge changes are tested. In this case, it opts into the moveBefore flag (ref)

[mhornbacher]

@ztanner thank you for the detailed and thoughtful explanation of where the error is and thank you @devongovett for opening an issue with the React team :)

[github-actions]

This closed issue has been automatically locked because it had no new activity for 2 weeks. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.