React-hook-form: isValid unexpectedly evaluates to false when using nested objects

Created on 26 Dec 2019  路  3Comments  路  Source: react-hook-form/react-hook-form

Bug Overview
I have dateOfBirth.month, dateOfBirth.day, and dateOfBirth.year. The register options say all items are required. After completing the form, all fields have a value and formState.touched includes all items are touched, but isValid is false. If you look at the errors of the form, you can see an error for dateOfBirth.

To Reproduce...

  1. Create a form with some inputs having the name of a nested object.
  2. Set the submit button's disabled state to !isValid.
  3. Observe the behavior.

Codesandbox
I have created a Codesandbox to reproduce the bug. The console.log's will help you see the issue more clearly.
https://codesandbox.io/s/react-hook-form-isvalid-bug-r8dc5

Expected Behavior:
dateOfBirth should not be listed in the errors of the form. If the error is set to undefined, isValid should be true.

Screenshots:
The ref:
image

The output after filling out the form:
2019-12-26 16_40_00-Window

Specifications

  • OS: Windows 10 Pro, Version 1809
  • Browser: Google Chrome, Version 79.0.3945.88

Please let me know if I can provide any further details. Thanks in advance! :)

bug

All 3 comments

[email protected]

fixed if you would like to verify

It looks like it's working! Thank you!

@chriscarrillo thanks a lot for reporting the issue and verify.

Was this page helpful?
0 / 5 - 0 ratings