watch() return undefined after validation error

[bimurzaew]

Watch returns undefined after validation has triggered and thrown an error.
The component one level above uses reset(), which populates the form with default values.

The problem appeared after updating React Hook Form to version 7.66.0. Previously, the version was 7.54.2, which had no issues.

[BrendanC23]

Can you provide a CodeSandbox that demonstrates the problem?

[chrisjcthomas]

That version jump matters. 7.66 tightened when unmounted / errored fields report values, so bare watch() (no field name) now returns undefined in the window between the parent's reset() repopulating defaults and the child re-registering. On 7.54 the old value leaked through that gap, which is why it looked fine before.

Pin a fallback so the gap can't produce undefined:

// before: blows up when reset + validation race
const values = watch();

// after: stays defined through reset/re-register
const values = watch(undefined, { defaultValue: defaultValues });
// or per-field, which is more robust:
const name = watch('name', defaultValues.name);

Two other things worth checking since reset() lives one level up: if the watched field is conditionally rendered, validation errors unmount it and watch() has nothing to read — either keep it mounted or set shouldUnregister: false on that field. And if the parent calls reset() on every render (rather than once when data arrives), the child perpetually re-registers; gate it behind the data being ready instead.

If it still reproduces, the discriminating detail is whether getValues() also returns undefined at the same moment — if getValues() has the value but watch() doesn't, it's purely the subscription timing above; if both are empty, the reset() payload itself is missing the key.

[ninaad-padiyarr]

A quick heads-up before trying the fallback above: watch(undefined, { defaultValue: defaultValues }) isn't a supported public overload, including in 7.66.0. The second argument isn't a defaultValue options object.

For one field, the supported form is:

const name = watch('name', defaultValues.name);

For the whole form, set defaultValues on useForm and call watch() without arguments. That's an initialization pattern, though, not a confirmed fix for the regression you're seeing.

I agree with the request for a small reproduction. Keeping the parent's reset(), the child watcher, and the validation step would let someone compare 7.54.2 and 7.66.0 without guessing about an unmounting or timing change.

I checked the 7.66.0 watch declarations and verified the supported field-level call with TypeScript. I haven't reproduced your original bug.

AI-assisted reply.