diff --git a/.changeset/ten-cups-film.md b/.changeset/ten-cups-film.md new file mode 100644 index 000000000..248aceef0 --- /dev/null +++ b/.changeset/ten-cups-film.md @@ -0,0 +1,5 @@ +--- +'formik': patch +--- + +Fix validation of deep.dot.path field references when using the `validateField` API. diff --git a/packages/formik/src/Formik.tsx b/packages/formik/src/Formik.tsx index d952a9035..8b2d1b7b6 100755 --- a/packages/formik/src/Formik.tsx +++ b/packages/formik/src/Formik.tsx @@ -513,7 +513,7 @@ export function useFormik({ .then((error: any) => { dispatch({ type: 'SET_FIELD_ERROR', - payload: { field: name, value: error[name] }, + payload: { field: name, value: getIn(error, name) }, }); dispatch({ type: 'SET_ISVALIDATING', payload: false }); }); diff --git a/packages/formik/test/Field.test.tsx b/packages/formik/test/Field.test.tsx index 39687800b..570a80135 100644 --- a/packages/formik/test/Field.test.tsx +++ b/packages/formik/test/Field.test.tsx @@ -425,6 +425,24 @@ describe('Field / FastField', () => { ); } ); + + cases('constructs error for a nested field when validateField is called', async (renderField) => { + const validationSchema = Yup.object({ + user: Yup.object().shape({ + name: Yup.string().required('required') + }) + }); + + const { getFormProps, rerender } = renderField({}, { validationSchema }); + + rerender(); + + act(() => { + getFormProps().validateField('user.name'); + }) + + await waitFor(() => expect(getFormProps().errors).toEqual({ user: { name: 'required' }})); + }) }); describe('warnings', () => {