[bug]: not able to submit the form, using Next.js 15 and React.js 19

[Boby900]

Describe the bug

I am trying to submit the form and playing around with Next.js 15 and React.js 19 but form doesn't seems to be working, it's not getting submitted. and I am also not seeing any

Affected component/components

Form

How to reproduce

use Next.js 15 and React.js 19 install the form component try to submit the form.

When I remove the onSubmit function my form is submitted and data is getting console logged as URL =
GET /?username= 200 in 242ms, GET /?username=sss 200 in 216ms

but not getting any type of warnings from zod when I am trying to submit the empty form and also not getting any requests in the network tab.

Codesandbox/StackBlitz link

https://github.com/Boby900/react-todo

Logs

No response

System Info

System:
    OS: Windows 10 10.0.19045
    CPU: (4) x64 Intel(R) Core(TM) i3-4160 CPU @ 3.60GHz
    Memory: 385.89 MB / 3.92 GB
  Binaries:
    Node: 21.1.0 - C:\Program Files\nodejs\node.EXE
    npm: 10.4.0 - C:\Program Files\nodejs\npm.CMD
    pnpm: 9.2.0 - ~\AppData\Roaming\npm\pnpm.CMD
    bun: 1.1.10 - ~\AppData\Roaming\npm\bun.CMD
  Browsers:
    Chrome: 126.0.6478.126
    Edge: Chromium (126.0.2592.68)
    Internet Explorer: 11.0.19041.4355
  npmPackages:
    @hookform/resolvers: ^3.6.0 => 3.6.0
    @radix-ui/react-label: ^2.1.0 => 2.1.0
    @radix-ui/react-slot: ^1.1.0 => 1.1.0
    @testing-library/react: ^16.0.0 => 16.0.0
    @types/node: ^20 => 20.14.8
    @types/react: ^18 => 18.3.3
    @types/react-dom: ^18 => 18.3.0
    @vitejs/plugin-react: ^4.3.1 => 4.3.1
    babel-plugin-react-compiler: ^0.0.0-experimental-938cd9a-20240601 => 0.0.0-experimental-938cd9a-20240601
    class-variance-authority: ^0.7.0 => 0.7.0
    clsx: ^2.1.1 => 2.1.1
    eslint: ^8 => 8.57.0
    eslint-config-next: 15.0.0-rc.0 => 15.0.0-rc.0
    jsdom: ^24.1.0 => 24.1.0
    lucide-react: ^0.396.0 => 0.396.0
    next: 15.0.0-rc.0 => 15.0.0-rc.0
    next-auth: ^5.0.0-beta.19 => 5.0.0-beta.19
    postcss: ^8 => 8.4.38
    react: 19.0.0-rc-f994737d14-20240522 => 19.0.0-rc-f994737d14-20240522
    react-dom: 19.0.0-rc-f994737d14-20240522 => 19.0.0-rc-f994737d14-20240522
    react-hook-form: ^7.52.0 => 7.52.0
    tailwind-merge: ^2.3.0 => 2.3.0
    tailwindcss: ^3.4.1 => 3.4.4
    tailwindcss-animate: ^1.0.7 => 1.0.7
    typescript: ^5 => 5.5.2
    vitest: ^1.6.0 => 1.6.0
    zod: ^3.23.8 => 3.23.8

Before submitting

• [X] I've made research efforts and searched the documentation
• [X] I've searched for existing issues

[hmongdev]

I was having the same issue.

For me, the issue was an invalid schema / validation.

console.log(yourFormName.formState.errors);

https://github.com/shadcn-ui/ui/issues/456#issuecomment-1563231165

[Boby900]

console.log(yourFormName.formState.errors);

thanks for jumping in, but still I am not able to solve it.

[Boby900]

I made some changes in code and data is getting console logged but zod is not providing any validation errors when I am submitting the empty form.

[hmongdev]

You have to make sure your schema validation matches your form. Good luck!

[Boby900]

okay, thanks for your help @hmongdev but I have checked it multiple times, it's already matching with my form.