Chapter 23: Debugging

Core Idea

Three recurring issues cover most of what goes wrong: an uncontrolled-to-controlled input warning from missing defaultValues, a field value typed as unknown from an overly complex form shape, and a TypeScript "excessively deep type instantiation" error tied to the library's own generic machinery.

Anti-patterns

• Missing/partial defaultValues: leaving a field's default out of defaultValues means it starts undefined, which React reports as an uncontrolled-to-controlled transition the first time a value arrives. Fix: always seed every field's default explicitly in useForm's defaultValues (see ch006).
• field.state.value typed as unknown: usually a sign the form's overall type shape has gotten too complex for inference to fully resolve. Fix: break the form into smaller pieces (form groups, ch012; composition, ch020) or add more specific typing; casting with as is a workaround, not a fix.
• "Excessively deep type instantiation": a TypeScript compiler error from the library's generic depth, not a runtime bug — doesn't affect execution. File a minimal reproduction with maintainers rather than trying to "fix" it in your own code.

Key Takeaways

1. If you see the uncontrolled-input warning, check defaultValues completeness before anything else — it is almost always the cause.
2. unknown-typed field values are a complexity signal, not a bug to cast away — restructure the form (ch012 Form Groups, ch020 Form Composition) rather than reaching for as as a permanent fix.
3. Deep type-instantiation errors are safe to ignore at runtime but worth reporting upstream with a minimal repro — don't spend time trying to restructure your own types to work around a library-internal limit.

Connects To

• Ch006 React Quick Start: where defaultValues completeness first matters.
• Ch005 TypeScript: the strict/version requirements underlying these type-inference failure modes.
• Ch024 Devtools: a faster way to inspect actual field state/types at runtime than console-logging.