issue: form.reset(values) ignores undefined values

[andykog]

Version Number

7.51.2

Codesandbox/Expo snack

https://codesandbox.io/p/sandbox/react-hook-form-reset-undefined-w3p8ks

Steps to reproduce

Initialize the form with some values or defaultValues:

const userProfileForm = useForm({
  values: { revision: 5, firstName: 'a', image: {url: 'https://image.png'} },
})

Assume that the data was re-fetched from server and the form needs to be reset to reflect the actual state (in this scenario the profile image was removed on another device):

userProfileForm.reset({revision: 6, firstName: 'a' }); // <- image was removed

Result: the image value wasn't reset.

Additional info: it used to work fine in version 7.21.0

Workaround 1: replace all undefined values with null when calling reset:

userProfileForm.reset(_.defaultsDeep(newUserProfile, {image: null}))

Workaround 2: call reset with and without arguments multiple times (you can try to press buttons in the pvovided codesandbox a few times, eventually it will reset lastname), this behaviour is inconsistent.

Discussion

Expected behaviour

It should reset the form state completely to match the provided object without “merging” it with the previous values.

What browsers are you seeing the problem on?

Chrome

Relevant log output

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

[bluebill1049]

we don't support undefined value, you can find similar rule for other hook such as useController defaultValue or defaultValues

[andykog]

@bluebill1049 Would be useful if there was a way to reset form state completely. Also I think reset behaviour should be consistent (see my comment about workaround 2) it shouldn't behave differently depending on how many time it was invoked.