formik: [v2] initialValues broken in 2.0.1-alpha.51 & 2.0.1-rc.0 with CRA

πŸ› Bug report

Current Behavior

  • initialValues are not set in the versions mentioned in dev CRA environment
  • Ok in 2.0.1-alpha.5.
  • Can’t reproduce in codeSandbox
  • Works once build

So it’s probably a broken compatibility between the development version output of @palmerhq/tsdx and CRA. I can move the issue to tsdx if you want.

Reproducible example

  • yarn create react-app formik-test --typescript
  • yarn add formik@next
  • Change App.tsx to:
import React from "react";
import { Formik } from "formik";

const App: React.FC = () => {
  return (
    <Formik
      initialValues={{ email: "Will crash", password: "" }}
      onSubmit={console.log}
      render={props => (
        <>
          <input value={props.values.email} name="email" type="email" />
          <input
            value={props.values.password}
            name="password"
            type="password"
          />
          <button>Log In</button>
        </>
      )}
    />
  );
};

export default App;

Your environment

Software Version(s)
Formik 2.0.1-rc.0
React 16.8.6
CRA 3.0.1
TypeScript 3.4.5
Browser Chrome
npm/Yarn yarn 1.16
Operating System macOS

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Reactions: 2
  • Comments: 17 (7 by maintainers)

Most upvoted comments

We still encounter this bug too, only version 2.0.1-alpha.5 is working. I believe some changes in 2.0.1-alpha.51 lead the bug

I made some tests with Next and the code works when running on the server but not when running on the browser:

const formik = useFormik({
  initialValues: { user: 'test' }
});

image Live demo: https://formik-nextjs-jgkhfsskwe.now.sh/ (refresh the page and see the value coming from the server and then being overridden by the client, this is a production build)

Maybe there is something going on the production build of the lib because it works fine if I try to run it locally in development mode or use the dev files instead of the production ones (renaming them).

Same here. 2.0.1-alpha.5 is the last one to work. I get undefined errors when trying to access values from useFormikContext()

Also having issues since alpha.51, values and other props are undefined.

Everything was working fine up to alpha.5