8000 Formik enters into an endless validation loop when validateOnMount is activated and initialValues change · Issue #3348 · jaredpalmer/formik · GitHub
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

Formik enters into an endless validation loop when validateOnMount is activated and initialValues change #3348

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Closed
rapzo opened this issue Sep 16, 2021 · 7 comments
Closed

Formik enters into an endless validation loop when validateOnMount is activated and initialValues change #3348

rapzo opened this issue Sep 16, 2021 · 7 comments
Labels
Type: Bug

Comments

@rapzo
Copy link
rapzo commented Sep 16, 2021

Bug report

Current Behavior

When using Formik with validateOnMount: true and mutated initialValues controlled outside the form context, on the 1st change, Formik will go into an infinite validation loop, crashing the page eventually.
This behavior is easily caught when using a toggle in the form that affects its validation and/or structure.

Expected behavior

It is expected that, whenever initialValues change, a proper validation is done on the newly provided values.

Reproducible example

Formik validateOnMount with a toggle that freezes the app: https://codesandbox.io/s/github/rapzo/formik-validateOnMount/tree/csb-dengj

A possible workaround, although it kind of limits the depth of the changeable value: https://codesandbox.io/s/github/rapzo/formik-validateOnMount/tree/main

Suggested solution(s)

master...rapzo:patch-1

Additional context

I don't know if this was an expected behavior so I'm creating the issue before a PR.
Will be happy to add test cases to the PR if this proposal makes sense.

Your environment

Software Version(s)
Formik 2.2.9
React 17.0.2
TypeScript 4.4.2
Browser Google Chrome 91.0.4472.164 (Official Build) (64-bit)
npm/Yarn 6.14.15/1.22.11
Operating System Manjaro (kernel: 5.10.56-1-MANJARO)
@kevinlandsberg
Copy link

Ran exactly into the same issue... 😉

@onadeemdev
Copy link

@kevinlandsberg @rapzo same issue! couldn't figure it out for a while, did you guys find any good solutions? thanks!

@ktalalykin
Copy link

if you change values, by updating initialValue, you will need to set another property to formik enableReinitialize: true. This way it will work as expected

@LeonardoDaLuz
Copy link
LeonardoDaLuz commented Jun 18, 2022 •
edited
Loading

There is a bug that occurs when the initial values is constructed directly inside the parameter object of the use formik function. It recreates the object every time it validates, and every time it creates an object it validates again. The solution was to create this initial values object inside a useEffect.

Example of a case where the problem occurs:
image

@alexdr00
Copy link
alexdr00 commented Mar 21, 2023 •
edited
Loading

if you change values, by updating initialValue, you will need to set another property to formik enableReinitialize: true. This way it will work as expected

This worked! Thanks @ktalalykin .

@eliassaTsb
Copy link

Thank you @ktalalykin ! Fixed the issue

@TomerAtarScopio
Copy link

In my case @LeonardoDaLuz 's was the right approach, memoizing the initialData made more sense than enabling a reinitialization setting. Thanks

@rapzo rapzo closed this as not planned Won't fix, can't repro, duplicate, stale May 11, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
Type: Bug
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
370F
8 participants
@rapzo @alexdr00 @kevinlandsberg @TomerAtarScopio @LeonardoDaLuz @ktalalykin @onadeemdev @eliassaTsb
0