issue: defaultValues of required number inputs ignored on form submit if not rendered first

[elieven]

Version Number

7.40.0

Codesandbox/Expo snack

https://codesandbox.io/s/react-hook-form-tabs-problems-01-required-numbers-kmy5jp?file=%2Fsrc%2FApp.tsx

Steps to reproduce

1. Go to https://codesandbox.io/s/react-hook-form-tabs-problems-01-required-numbers-kmy5jp?file=%2Fsrc%2FApp.tsx
2. Click on submit (without clicking on any other tabs)
3. Look at console log
4. You should see errors {prop2: Object, prop3: Object}

Expected behaviour

Form should submit without any errors since the default values have been provided for all required inputs. The exact same thing but with "text" inputs works as expected and submits the form with all data from defaultValues and no errors as can be seen in this sandbox: https://codesandbox.io/s/react-hook-form-tabs-problems-01-required-strings-9btufh?file=%2Fsrc%2FApp.tsx.

What browsers are you seeing the problem on?

Firefox, Chrome, Edge

Relevant log output

No response

Code of Conduct

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

[elieven]

It's particularly strange because if you click on the other tabs (cause the other inputs to render too) it works. But if all the inputs have not been rendered at some point it does not work. I'm talking about number inputs only since i tested number and text and of those the number ones caused the issues. I have not tested date or any other type of input to see if those have the same problem too.

[bluebill1049]

Never it's not to do with render, i am looking into this issue now.

[bluebill1049]

#9571

[bluebill1049]

I can confirm the issue is due to input is not been registered, looking for a solution to work around this.

[leapful]

@elieven @bluebill1049

A workaround is to render all tab contents and hide it using CSS.

Working demo: https://codesandbox.io/s/react-hook-form-tabs-problems-01-required-numbers-forked-tzidgk

[bluebill1049]

Thanks @leapful i have patched it will release it this week 🙏 👍

[elieven]

@leapful I was not aware of this [data-headlessui-state=""] thing (never really looked too deep into headless UI tabs) quite an interesting trick. For my use case it was probably better to not render all he fields.