Formik: validateOnMount does not validate field on first mount

Created on 28 Jul 2020 · 9Comments · Source: formium/formik

🐛 Bug report

Current Behavior

at first mount field has 0 errors with defined "initialValue" and "validateOnMount" flag

Expected behavior

at the first mount, the validation field must have an error.

Reproducible example

https://codesandbox.io/s/formik-codesandbox-template-723xp

Additional context

at [email protected] all works fine.

Your environment

| Software | Version(s) |
| ---------------- | ---------- |
| Formik | 2.1.5
| React | 16.11.0

Source

psaruks

👍14

Most helpful comment

@cduff

Yes, I can confirm that it is fixed in 2.1.6.

Aerophite on 1 Oct 2020

👍3

All 9 comments

Looks like this works in 2.1.4 as well. I believe my PR #2625 will fix this.

dhallstr on 28 Jul 2020

same issue on 2.1.5

Raden-Hor on 13 Aug 2020

Any update on this? I'd like to be able to update Formik to keep my dependencies up to date but this issue is stopping me.

Aerophite on 20 Aug 2020

In the last version the property isInitialValid is marked as deprecated, but this was only way to disable submit button on initial empty form. Current initialErrors with validation schema makes the form valid on start even if it invalid (empty).

DmitryIvanovIAMM on 29 Aug 2020

for now I'm using like this:

import React, { useRef, useEffect } from 'react'
import {
  Formik as BaseFormik,
  Form as BaseForm,
  FormikProps,
  FormikConfig,
} from 'formik'

function Formik<Values>(props: FormikConfig<Values>) {
  const { children, ...rest } = props
  const formRef = useRef<FormikProps<Values> | null>(null)

  useEffect(() => {
    if (formRef.current) {
      formRef.current.validateForm()
    }
  }, [])

  return (
    <BaseFormik innerRef={formRef} {...rest}>
      <BaseForm>{children}</BaseForm>
    </BaseFormik>
  )
}

// Workaround for: https://github.com/formium/formik/issues/2652
export default Formik

So instead of import from formik I'm using this component