Cannot call setIn() with undefined state

[alexander-lebed]

Are you submitting a bug report or a feature request?

bug report

What is the current behavior?

Throws Cannot call setIn() with undefined state when clear out and fill values for several times. Using custom onChange + initialValues and keepDirtyOnReinitialize

const [firstName, setFirstName] = useState("First");
...
<Form
  onSubmit={onSubmit}
  initialValues={{ firstName, lastName: "Last" }}
  keepDirtyOnReinitialize
  render={({ handleSubmit }) => (
    <form onSubmit={handleSubmit}>
      <div>
      <label>First Name</label>
       <Field name="firstName">
          {(props) => (
            <input
              name={props.input.name}
              value={props.input.value}
              onChange={(e) => {
                props.input.onChange(e);
                // In fact I need to save the value to redux store
                setFirstName(e.target.value);
              }}
            />
            ...
          )}
        </Field>
      </div>
    </form>
  )}
/>

Sandbox Link

https://codesandbox.io/s/upbeat-shaw-5ffvl

What's your environment?

Final Form 4.20.0 Node 12.18.3

[AndyRightNow]

I encountered the same issue as well but it was extremely hard to reproduce. Thank you so much for your Sandbox link! It really saves me a ton of hassles of trying to reproduce it.

It appears that the the values state changes to undefined at this line.

If setIn() is supposed to return undefined when all property values of the target object are undefined, isn't there supposed to be any approach to normalize the values state for any later operations?

@erikras