final-form / final-form/react-final-form

Dirty subscription with useFormState does not work in combination with defaultValue on field

Open
#890 1 comment 6 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
7.4k
Forks
497
PR merge metrics
No merged PRs in 30d

Description

### Are you submitting a **bug report** or a **feature request**?

Bug report

### What is the current behavior?

I have a field (number input) where I set a defaultValue on. I read the documentation and I know this will set the field dirty, this is actually what I want. The field does not have an initial value.

a) Another component in my form would need to react to the `dirty` form state. To that end, I use the `useFormState` hook in which I subscribe to the `dirty` state field. However, the value for the dirty field seems to be false (although the form is actually dirty as I used a default value).

b) Furthermore, when I change the value of my input after rendering (increment by one using the input controls), my subscriber receives an update ONLY when it is comes first in the component tree. I included 2 sandboxes, in sandbox 1 no update is happening (this is wrong), in sandbox 2 there is.

### What is the expected behavior?

a) When using `useFormState` and subscribing on `dirty`, the returned value reflects the actual dirty state of the form.
b) Changing the value of the control should cause `dirty` to be true.

### Sandbox Link

2 sandboxes:

1) https://codesandbox.io/s/react-final-form-dirty-ip301
2) https://codesandbox.io/s/react-final-form-dirty-2-36sio

### What's your environment?

React 17 & RFF 6.5.2 (in the sandbox, I have the same issue with React 16.13.1)

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.