formik
formik copied to clipboard
jaredpalmer
yup validation schema
🐛 Bug report
Yup validation schema return undefined field value at initialization
Current Behavior
<Formik<Edit> initialValues={{ field: '', disable: true }} validationSchema={yup.object().shape<Edit>({ field: yup.string().when('disable', { is: value => {console.log(value); return value}, then: yup.string(), otherwise: yup.string() }) })} validateOnBlur >
at least few times console.log return undefined. In preview version 1.5.8 always return initial value
Expected behavior
validation schema suppose to return value if initialized
Your environment
| Software | Version(s) |
|---|---|
| Formik | 2.0.3 |
| React | 16.10.2 |
| TypeScript | 3.6.4 |
| Browser | opera |
| npm/Yarn | 1.19.1 |
| Operating System | mac OS |
This is due to a change implemented in this PR: #1740 I left a comment on it about this, but I'm not sure why this change was made. The only thing I could think of is if Yup had some strange behavior when passed an empty string, but I feel like that situation should be handled by the implementation, not Formik.
I dug a bit deeper, and as mentioned in #1520 (the issue that lead to that PR) Yup doesn't like being passed an empty string when trying to set a min length for a string value. This means if you pass an empty string as the default value and it isn't transformed to undefined (as is currently happening in formik), all validation schema with a minimum length will fail even if the field isn't supposed to be required.
In previous versions of Formik, empty strings were only transformed for top level schema entries, so the current code is certainly better than that inconsistent behavior. However that makes 2.X have a breaking change for people like me that had tests depend on receiving an empty string in nested schema (even though the problem is fairly easily fixed). Changing Formik to not transform any empty strings to undefined would be a breaking change in the other direction, and would probably have a much larger impact so I don't think that's a good idea.
Perhaps this should be added as a breaking change in the Formik docs for upgrading to version 2 if no code changes come from this discussion?
Given this information, how would you like to proceed @jaredpalmer ?
Formik converting empty strings to undefined during the prepareDataForValidation function means that we can't use yup's .defined() check when the field value is "". This is causing issues for some of our form validation, is using an empty string as a value considered bad practice?
@sambrodriguez @jaredpalmer I have the same problem as @abs25.
The current behavior makes it impossible to allow empty strings in a yup validation schema, despite the fact that yup is plenty flexible enough to distinguish between undefined, null and '' independently. Please either document this properly and give a good reasoning, or rethink the implementation to allow empty strings.
Please, some maintainer reply here. You should either stop converting empty strings to undefined, or give us an alternative.
Using undefined for empty inputs is not acceptable in react, given that undefined is used to distinguish uncontrolled inputs from controlled ones!
Please react at least. We will be forced to fork if we do not get a response very soon.
I've raised a PR fixing the same - https://github.com/formium/formik/pull/2902
@clawoflight Thanks for your patience and cooperation, I have raised a PR which can be a solution to fixing this. Stay Tuned!
I found the suggestion at https://github.com/jaredpalmer/formik/pull/2902#issuecomment-922492137 fixed this for me.
