File still adds even if yup validation fails
validators={{
onChange: yup
.mixed()
.required("A photo ID selfie is required")
.test("emptyFile", "A photo ID selfie is required", (value: AnyPresentValue & {}) => {
return value.value !== undefined && value.value !== null && value.value !== "";
})
.test("fileSize", "The file is too large", (value: AnyPresentValue & {}) => {
return value.value && value.value.size <= 1024 * 1024;
})
.test("fileType", "Document format is invalid (JPG or PNG)", (value: AnyPresentValue & {}) => {
return value.value && ["image/jpeg", "image/jpg", "image/png"].includes(value.value.type);
}),
}}
/> validators={{
onChange: yup
.mixed()
.required("A photo ID selfie is required")
.test("emptyFile", "A photo ID selfie is required", (value: AnyPresentValue & {}) => {
return value.value !== undefined && value.value !== null && value.value !== "";
})
.test("fileSize", "The file is too large", (value: AnyPresentValue & {}) => {
return value.value && value.value.size <= 1024 * 1024;
})
.test("fileType", "Document format is invalid (JPG or PNG)", (value: AnyPresentValue & {}) => {
return value.value && ["image/jpeg", "image/jpg", "image/png"].includes(value.value.type);
}),
}}
/>I'd like to block adding the file if Yup validation fails. In this case, field.state.value still gets set even if the size is too large.
Using v0.13.0 for React-Form and Form-Core.
