react-hook-form icon indicating copy to clipboard operation
react-hook-form copied to clipboard

issue: `useFormState` no longer updates `validatingFields`

Open slax57 opened this issue 1 year ago • 4 comments

Version Number

7.53.0

Codesandbox/Expo snack

https://codesandbox.io/p/sandbox/gifted-panka-kctr6s?workspaceId=80f74b7c-dae1-4b05-9812-bc10dfaaf558

Steps to reproduce

  1. Load the form
  2. Leave the 'First Name' field empty
  3. Click on 'Submit'
  4. Notice it says ERRORS: [], although the field is required
  5. Notice the line effect triggered!! is only present once in the DevTools console

Expected behaviour

  1. It should say ERRORS: ["firstName"]
  2. The line effect triggered!! should be present twice in the DevTools console

Additional info

This problem only occurs with RHF v7.53.0. It does not occur with RHF v7.52.2.

If you replace the effects dependencies by the following, then the effect runs as expected:

  const errorsNames = Object.keys(errors);
  React.useEffect(() => {
    console.log("effect triggered!!", { errors, validatingFields });
    setErrorsState(Object.keys(errors));
  }, [
-   errors,
+   JSON.stringify(errorsNames),
    JSON.stringify(validatingFieldsNames),
  ]);

However, this is more of a workaround to me, as it used to work before.

I have tracked down the issue to be the validatingFields object (obtained from useFormState), which no longer seems to change on submission since RHF v7.53.0. That's why I believe this is a bug.

Thank you for your time, and, needless to say, we are still very grateful for this awesome lib and all the work you've done :slightly_smiling_face:

What browsers are you seeing the problem on?

Chrome

Relevant log output

No response

Code of Conduct

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

slax57 avatar Aug 27 '24 16:08 slax57