Formik: initialValues is now required?

[mrowe009]

🐛 Bug report

Current Behavior

A form that does NOT have initialValues, the application crashes because formik cannot read property [field name] of undefined

Expected behavior

A form that does not require fields to be initialized nor keep track of values, for example a login form. It shouldn't be required to apply the initialValues prop

Reproducible example

Here is a sandbox with the latest formik that shows the behavior. If you uncomment line 9, you will see the behavior of not applying initialValues, which causes the app to break as soon as you type into the field

https://codesandbox.io/s/formik-codesandbox-template-9rstl

Suggested solution(s)

Not making the initialValues required.

Additional context

If this is part of the migration of V1 to V2, then it should be documented because in V1, initialValues was not required

Your environment

| Software | Version(s) |
| ---------------- | ---------- |
| Formik | latest
| React | latest

Edit: fixed sandbox link

[apieceofbart]

From the docs:

Even if your form is empty by default, you must initialize all fields with initial values otherwise React will throw an error saying that you have changed an input from uncontrolled to controlled.

Maybe Formik could provide a default value (empty object) ?

[mrowe009]

@apieceofbart I read that, but that isn't the case here. The docs say that react will throw an error if going from uncontrolled to controlled; also it wouldn't destroy the app either. I am using the forms inputs (the login form) as UNCONTROLLED. So there isn't a need to initialize the fields. Also this behavior was not present in V1 when not providing initialValues.

In the codesandbox, if you open the console, uncomment line 9, and try to type in the field, you will see the error that crashes the application

[riccoski]

Same. Have to use an empty object for initialValues

[antiold]

Discover this by trying to setFieldValue, which gives a setIn error.
Should be documented that initialValues should be at least {}.

[mrowe009]

@antiold this wasn't the case in V1. There seems to be a few undocumented changes in V2 that breaks implementation.

[kylepeeler]

We had the same issue, and until this was discovered, it was a blocker to us upgrading to Formik v2. Please add a default prop or make a note in the migration notes about this change. Passing undefined into here was frequently occuring when initialValues was set to a value connected to Redux.

[johnrom]

InitialValues has always been required. Using typescript, your build will fail when not passing an object. If it were up to me, I'd throw an error in JS as well to prevent hidden errors like using setFieldValue as described above.

An empty object is not assignable to Formik's values signature, so there is no way for Formik to create a valid default object. I don't think we should document something like, "If you're going to do it wrong, at least do it wrong _like this_." It provides a false alternative. I think this will be resolved in v3 because initialValues will probably be optional, but if not we should just throw an error if initialValues is undefined.

Passing undefined into here was frequently occuring when initialValues was set to a value connected to Redux.

@kylepeeler Formik cannot determine what your fallback object should be. You should provide your own fallback when Redux is not populated. It should also match the expected values signature.

const MyForm = () => {
  const defaultValues = React.useMemo(() => selectDefaultValues(), []);

  return <Formik
    initialValues={valueFromRedux ?? defaultValues}
    enableReinitialize={true}
  />
}