Skip to content

Can't use Suspense boundary inside a form that uses useActionState(). #79995

@younes101020

Description

@younes101020

Link to the code that reproduces this issue

https://codesandbox.io/p/devbox/nextjs-15-forked-vyrr8l

To Reproduce

  1. Go to the codesandbox link.
  2. run pnpm dev

Current vs. Expected behavior

I'm currently trying to use Suspense nested inside a form that uses useActionState(), but a hydration error occurs.

Image

Provide environment information

"@tanstack/react-query": "^5.79.0",
"next": "15.4.0-canary.58",
"react": "19.0.0-rc-66855b96-20241106",
"react-dom": "19.0.0-rc-66855b96-20241106",
"typescript": "^5"

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

Server Actions

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

next dev (local)

Additional context

No response

Metadata

Metadata

Assignees

Labels

Type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions