[BUG] Issue When Using useAction to Create Form with File Schema
KhoeLe opened this issue · comments
Are you using the latest version of this library?
- I verified that the issue exists in the latest next-safe-action release
Is there an existing issue for this?
- I have searched the existing issues and found nothing that matches
Describe the bug
I am experiencing issues when creating a form that includes a file upload using useAction. Below is the code where the problem occurs:
Reproduction steps
form-action.tsx
logic code handle submit
form input upload file
Expected behavior
Problem occurs during the form submission process.
Reproduction example
https://github.com/KhoeLe/next-safe-action.git
Operating System
Windows 10
Library version
"next-safe-action": "^6.2.0",
Additional context
if I remove the file from the formDataSchema and any related components, the form submits successfully
No response
Not related to next-safe-action, got the same error with your schema and without using this library. You need to pass the file in FormData, I suggest using zod-form-data on top of Zod to validate the form.
Hello @TheEdoRan
I am having issues using react-hook-form with a Zod schema for file uploads (z.instanceof(File)). I am encountering errors. Do you have any ideas for resolving this?
Hello @TheEdoRan
I am having issues using react-hook-form with a Zod schema for file uploads (z.instanceof(File)). I am encountering errors. Do you have any ideas for resolving this?
File isn't a type noticed by nextjs if your node version is below >= 20.0. The potential alternative may be to try z.instanceof(Blob)), I haven't tried it out myself though
I'm having the same problem, is there a workaround?
For the people who are stuck on Node.js 18 LTS but can't upgrade above, unfortunately z.instanceof(Blob)) doesn't work. Neither polyfilling with a Web-API compliant polyfill for the File class.
Absolutely, updating the node version to 20 fix it!