issue: Watch don't work with React Compiler (React 19) about react-hook-form HOT 11 OPEN

Since React Compiler is still experimental, the bug have also been reported to React Compiler team, they replied it works as excepted and the library don't follow the React guidelines : facebook/react#29144

from react-hook-form.

The same applies to the formState.

export const useFieldError = () => {
  const { fieldKey } = use(SchemaFieldContext);
  const { errors } = useFormState({ name: fieldKey, exact: true });

  return get(errors, fieldKey)?.message?.toString();
};

This hook fails to subscribe to changes when React Compiler is enabled. I had to add use no memo for now.

from react-hook-form.

register sometimes works, but sometimes refuses to track changes. The register() call has to be called with use no memo to work reliably.

Another hack for now:

const useRegisterProps = (name: string, props: RegisterOptions = {}) => {
  'use no memo';

  return useFormContext().register(name, props);
};

from react-hook-form.

const { watch } = useForm({ defaultValues: { customerId: "", addressId: "" } });
const customerId = useMemo(() => watch("customerId"), [watch]);

watch reference is not going to change on each update unless we change the design (breaking change). almost need to remove this API just for the compiler. At this stage, consider using useWatch as a solution.

from react-hook-form.