v4: `z.file` optional not working

[l0uisgrange]

Hi,

I'm a huge Svelte and Zod fan, and I think my only problem with Zod is that it doesn't manage well formData empty values.

For example, here are empty inputs formData values :

Input type	FormData
file	File { size: 0, type: 'application/octet-stream', name: '', lastModified: ... }
text	""

And hence the .optional() does not work as the value is not null.

I think the best workaround would be to seriously consider something like z.file().mime(...).formOptional() which would try if the file has empty values.

Note that I tried the following schema for a text field, but it does not generate any errors.properties that I could reuse in my Svelte views.

z.url().or(z.string().length(0, { error: 'Invalid URL' }).nullish())

Here is another example with the file input :

const schema = z.object({
    status: z.enum(['accepted', 'created', 'refused', 'cancelled']),
    organisation: z.string().nonempty(),
    logo: z.file().mime(['image/png', 'image/webp', 'image/svg+xml', 'image/jpeg']).max(1_000_000_000).optional(),
});

and the z.file().optional() does not seem to work, because it throws the error :

"properties": {
    "logo": {
        "errors": [],
        "properties": {
             "type": {
                  "errors": [
                      "Invalid option: expected one of \"image/png\"|\"image/webp\"|\"image/svg+xml\"|\"image/jpeg\""
                  ]
             }
        }
    }
}

[colinhacks]

I've certainly pondered APIs that would help Zod align better with how HTML forms work. I have some ideas that are still gestating.

I can't quite tell what behavior you want here, but you should be able to differentiate between empty and non-empty files with z.file().min(1).

To transform the empty file to null, I'd recommend something like this.

z.file()
  .nullable()
  .transform((file) => (file && file.size > 0 ? file : null));

Gonna close because the question of aligning Zod with form-style semantics is an ongoing area of work.