UseWatch with an input field that has a default value returns undefined when the input field is not changed

[tdesmet]

What you were expecting: I would expect that useWatch returns the default value of the field.

What happened instead: useWatch returns undefined, untill I change the watched field.

Steps to reproduce:

create a form with an input that has a default value, then have another component use useWatch on that input field, the resulting value is undefined untill you change the input.

Related code: I created a WatchBug component in the PostCreate file. It watches the Published at input. you see that initally the value returned is undefined. https://stackblitz.com/edit/github-mjvobu?file=src%2Fposts%2FPostCreate.tsx

Environment

• React-admin version: 4.15.2
• Last version that did not exhibit the issue (if applicable): 4.8.4 does not show the bug, I did not try other versions inbetween.

Working version on 4.8.4 https://stackblitz.com/edit/github-ladv9x?file=src%2Fposts%2FPostCreate.tsx

[fzaninotto]

I don't think there is a bug.

In your stackblitz, you define default values both at the form level and at the input level. But the doc clearly says that

React-admin will ignore these [input] default values if the Form already defines a global defaultValues (form > input):

See https://marmelab.com/react-admin/EditTutorial.html#per-input-default-value

A modified stackblitz with just the input default value shows that there is no bug:

https://stackblitz.com/edit/github-mjvobu-bqdzkf?file=src%2Fposts%2FPostCreate.tsx

[tdesmet]

Okay good to know. Still weird since as you can see in my second stackblitz it used to work in 4.8.4. And in my application, I have one instance where the form has no defaultValues and only the input has it and useWatch returns undefined. Allthough this might be because the form is in a dialog, which is used inside another form.

[tdesmet]

@fzaninotto I just tried your stackblitz and it shows undefined for me...

[slax57]

Indeed this looks like some kind of race condition between the application of the defaultValues and the setup of useWatch.

As stated in react-hook-form's docs, useWatch's execution order matters.

It could be that there is nothing we can do about this, but still, this requires more investigation work to figure out for sure if this comes from RHF or RA. So I'm reopening the issue.

[fzaninotto]

I copied the code from my Stackblitz to my local checkout or react-admin, and I cannot reproduce the bug...