How can i validate File Input with zod?

[niklasgrewe]

Hi, i want to validate a File Input like this:

export const CreateTeam = z.object({
  teamProfileImage: z.instanceof(File)
})

when i try to use it, i get the runtime error:

Server Error
ReferenceError: File is not defined

How can i solve this? I know that the validation was used both, on client and on server. I think that this is the problem, because nodejs don't know about File Type, isn't it?

[flybayer]

Are you trying to upload a file with a mutation? Mutations don't yet support file upload: #2270

[niklasgrewe]

@flybayer yeah the schema code is running also on the server, when i not use the schema in mutations or queries. In my case it's quite stupid, because I need the schema only client-side. Here we are again at the point you suggested yesterday, namely that we define convention of filename.server.js for server only files. This could also be used to fix such errors, couldn't it? I am not one of the constributors of Blitz, but I suspect that the schemas are also included in the server bundle and this is what generates the error message.

[flybayer]

Most code in your app runs on the server during build.

The way to fix is like this:

export const UserSetup = z.object({
   avatar: typeof window === 'undefined' ? z.any() : z.instanceof(File),
   username: z.string().min(4).max(20)
})

[bryanltobing]

The way to fix is like this:

if we use this we will be losing the typescript type. zod will detect the type as any

[bryanltobing]

I prefer to use z.null() or z.undefined() instead of z.any()

[AdsonCicilioti]

Yes! z.any interferes with type inference.