issue: useFieldArray and getFieldState causes react console warnings

[axel-havukangas-tt]

Version Number

7.51.3

Codesandbox/Expo snack

https://codesandbox.io/p/sandbox/nervous-pateu-v5t8t2

Steps to reproduce

1. Go to codesandbox
2. Click on "Add cat"
3. Check web console for preview
4. See error

Also, the render count increases a lot more than expected.

Expected behaviour

While the form works from the user perspective, I would expect it do so without producing React warnings.

What browsers are you seeing the problem on?

Chrome, Safari

Relevant log output

Warning: Cannot update a component (`App`) while rendering a different component (`Cats`). To locate the bad setState() call inside `Cats`, follow the stack trace as described in https://reactjs.org/link/setstate-in-render
    at Cats (https://v5t8t2.csb.app/src/App.js:48:40)
    at form
    at exports.FormProvider (https://v5t8t2.csb.app/node_modules/react-hook-form/dist/index.cjs.js:1:24227)
    at div
    at App (https://v5t8t2.csb.app/src/App.js:23:46)

Code of Conduct

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

[axel-havukangas-tt]

Might be related to the issue described in https://github.com/orgs/react-hook-form/discussions/10964#discussioncomment-9113909.

[axel-havukangas-tt]

Investigated this a bit more, and noticed that the issue seems to be related to passing the whole formState to getFieldState. Separately subscribing to changes to appropriate formState fields as described in https://react-hook-form.com/docs/useform/getfieldstate seems to work around the issue.

So in the example it would look like this

function Validation() {
  const {
    getFieldState,
    formState: { errors },
  } = useFormContext();
  const { invalid } = getFieldState("cats");

  return invalid === true ? "BAD CATS" : "GOOD CATS";
}

[sim391calado]

I still have this problem in 7.51.3

[axel-havukangas-tt]

@sim391calado That was actually the version I used as well, not sure why the issue template generated an old version. Fixed that now.

Did removing formState from the getFieldState, and replacing it with manual subscription of formState fields help in your case?