issue: isDirty is always 'true' when the reactStrictMode property is enabled in the next.config.js config

[popovevgen]

Version Number

7.51.5

Codesandbox/Expo snack

https://codesandbox.io/p/devbox/next-js-rhf-isdirty-tzqyr5?file=%2Fpages%2Findex.tsx%3A5%2C1

Steps to reproduce

1. Go to Next.js RHF isDirty
2. Click on 'devtools'
3. In devtools you can see that isDirty is true
   

Expected behaviour

I believe that it does not depend on the reactStrictMode property in the next.config.js - the isDirty property must return the correct value

What browsers are you seeing the problem on?

No response

Relevant log output

No response

Code of Conduct

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

[bluebill1049]

are you missing supplying the defaultValues?

Important: Make sure to provide all inputs' defaultValues at the useForm, so hook form can have a single source of truth to compare whether the form is dirty.

https://react-hook-form.com/docs/useform/formstate

[popovevgen]

@bluebill1049 Well, as you can see from the example, I don’t set defaultValues

In my opinion, it is not obvious behavior when isDirty depends on reactStrictMode
if when the defaultValues is not set, then isDirty should always be false. Is not it?

[kmsomebody]

The defaultValues do not make any difference.

In my case, I set the default values. On the 2nd render, isDirty becomes true and dirtyFields is empty. The values did not change between renders.

When reactStrictMode is disabled or shouldUnregister is false, this does not happen.
So I think the culprit here is shouldUnregister.

This happens even with an empty form, so there is no way anything could change.

In 7.51.3, it works as expected.
7.51.4-7.52.0 have this issue.

[arthurmmedeiros]

Has this discussion had any progress?

I'm currently facing the same problem mentioned by @kmsomebody :

In my case, I set the default values. On the 2nd render, isDirty becomes true and dirtyFields is empty. The values did not change between renders.

I set all the default values when initialising the form.

In my case I call reset(data, {keepDirtyValues: false}) after the form is submitted. The form re-renders after this and I isDirty is set to false. A second re-render happens right after that and sets isDirty to true again. On the other side, dirtyFields seem to work just fine. Calling reset, dirtyFields becomes an empty object.