nextjs - 💡(How to fix) Fix Form field hydration glitch with Turbopack in production build [12 comments, 5 participants]

Official PRs (…)
ON THIS PAGE

Recommended Tools

×6

Utilities matched from this issue’s tags and category — try them while you read without losing context.

GitHub issue graph ai analysis

Paste a GitHub issue URL. We fetch that issue, discover linked issues from bodies/comments/timeline, collect linked pull requests, and produce a structured English report.

The report is written in English Markdown for sharing and archival.

Helpful · Quick feedback

Loading…
GitHub stats
vercel/next.js#85782Fetched 2026-04-08 02:13:57
View on GitHub
Comments
12
Participants
5
Timeline
23
Reactions
0
Timeline (top)
commented ×12subscribed ×6mentioned ×3issue_type_added ×1

Error Message

This suggests that something went wrong with hydration, though oddly there's no console error.

Fix Action

Fix / Workaround

Since there doesn't appear to be an option to disable Turbopack, this is a blocker for me to upgrade to Next.js 16.

Code Example

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 24.6.0: Mon Aug 11 21:16:21 PDT 2025; root:xnu-11417.140.69.701.11~1/RELEASE_ARM64_T6000
  Available memory (MB): 32768
  Available CPU cores: 10
Binaries:
  Node: 22.17.1
  npm: 10.9.2
  Yarn: 1.22.22
  pnpm: 10.19.0
Relevant Packages:
  next: 16.0.2-canary.6 // There is a newer canary version (16.0.2-canary.7) available, please upgrade! 
  eslint-config-next: N/A
  react: 19.2.0
  react-dom: 19.2.0
  typescript: 5.9.3
RAW_BUFFERClick to expand / collapse

Link to the code that reproduces this issue

https://github.com/TrevorBurnham/next-turbopack-form-glitch-repro

To Reproduce

  1. Render an <input> on a page that has enough JavaScript to create a significant delay before rendering
  2. With Turbopack enabled (as is the default in the Next.js 16), run npm run build && npm run start. (The bug does not occur in dev mode.)
  3. Load the page and try typing in the <input> before hydration occurs.

This glitch occurs in both the Pages Router and the App Router.

Current vs. Expected behavior

When hydration occurs, whatever you typed in the <input> is lost.

This suggests that something went wrong with hydration, though oddly there's no console error.

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 24.6.0: Mon Aug 11 21:16:21 PDT 2025; root:xnu-11417.140.69.701.11~1/RELEASE_ARM64_T6000
  Available memory (MB): 32768
  Available CPU cores: 10
Binaries:
  Node: 22.17.1
  npm: 10.9.2
  Yarn: 1.22.22
  pnpm: 10.19.0
Relevant Packages:
  next: 16.0.2-canary.6 // There is a newer canary version (16.0.2-canary.7) available, please upgrade! 
  eslint-config-next: N/A
  react: 19.2.0
  react-dom: 19.2.0
  typescript: 5.9.3

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

Turbopack

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

next start (local)

Additional context

I originally observed this issue when I tried enabling Turbopack in Next.js 15.4.1. At the time, I attributed this to Turbopack's experimental status, but I saw the same bug when upgrading to Next.js 16.

Since there doesn't appear to be an option to disable Turbopack, this is a blocker for me to upgrade to Next.js 16.

extent analysis

TL;DR

Upgrading to the latest Next.js canary version may resolve the input loss issue during hydration with Turbopack enabled.

Guidance

  • The issue seems to be related to Turbopack in Next.js 16, and there's a newer canary version (16.0.2-canary.7) available that might fix the problem.
  • Try upgrading to the latest canary version using npm install next@canary to see if it resolves the issue.
  • If upgrading doesn't work, consider reporting the issue to the Next.js team, as there's no apparent option to disable Turbopack in Next.js 16.
  • Verify the issue by running npm run build && npm run start after upgrading and checking if the input loss still occurs during hydration.

Notes

The provided environment information suggests that the issue might be specific to the current version of Next.js (16.0.2-canary.6) and Turbopack. Upgrading to the latest canary version is a reasonable step to try and resolve the issue.

Recommendation

Apply workaround: Upgrade to the latest Next.js canary version (16.0.2-canary.7), as it may include fixes for the reported issue.

Vote matrix · Quick signals

Works
Did the solution work? Tap to confirm.
Easy Fix
Was it a quick fix?
Time Saver
Did it save you time?
Blocking
Was it severely blocking?
Common Issue
Are others likely hitting this too?
Flaky / Intermittent
Is it intermittent?
Verified / Reproducible
Can you reproduce it reliably?
Loading…

Still need to ship something?

×6

Another batch ranked right after the header list — different links, same matching logic.

Back to top recommendations

TRENDING