Using jest and useFormik, getting an error on destructuring

Viewed 140

I have a component that is following the useFormik pattern like this.

const formikOptions:FormikConfig<FormType> = someFormikOptions
const formik = useFormik(formikOptions)
const {values, handleSubmit, dirty, } = formik

Then I toss in a <FormikProvider value={formik}> in the component, and everything works fine on the front end when I run everything. No errors reported at build time, no console warnings, no issues. Woohoo!

Then I come to my spec file where we use jest and enzyme. We recently added an option that resets all mocks between tests (not my decision, not a decision that I can overrule, please do not tell me to yell at my CTO to fix this). One of my now-failing tests looks like this:

decribe('the component name',()=>{
    it('should render',()=>{
       const wrapper = shallow(<TheComponent {...ownProps} />)
       expect(wrapper).toMatchSnapshot()
    }
 }

When I run this code, I'm getting an error:

TypeError: Cannot destructure property 'values' of 'formik' as it is undefined.

I've tried spying on useFormik and mocking a return value with a clearly defined values return object, but I've been unsuccesful. I'm not sure what I'm doing wrong here. Whenever I google, I'm getting information strictly for useFormikContext, never for useFormik. Why am I seeing this type error, and how can I mend it?

0 Answers
Related