chore: remove useForm dependency from BasicToolForm #987
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
TLDR;
useForm returns
useRef().current
under the hood as a hack to optimize rendering. For the most part, this is totally fine, but it CAN cause some erratic behavior when certain conditions are met (I think it has to do with resetting the form's default values...????)Either way, it added way more complexity than it was worth (at least for this component) so removing it was the best solution
More in-depth:
After mount, the first rerender (change event) of this specific usage of
BasicToolForm
was causing theform.watch
method to change references (not only that but it was being treated as a NOOP??) as a result, theonChange
prop was not getting triggered, but only for the first change. Subsequent rerenders did not reinitialize thewatch
method and it behaved as expected.Looking into the code of
react-hook-form
there is no reasonable explanation for the reference ofform.watch
to change between renders.Essentially what happens is
useForm
initializes auseRef
object with thewatch
method and never updates it again. The only way that re-initialization could happen is if the parent component is remounted (tested and this is not the case).The only thing that seemed off from within the
useForm
code is that it returns thecurrent
property of the previously mentioneduseRef
object. This technically breaks the rules ofuseRef
(this one specifically) which "makes your component's behavior unpredictable"In the interest of spending another 3+ hours on this topic, I'm sticking with this as the working diagnosis