Как проверить реинициализацию в функциональном компоненте Formik без состояния?

Question

В настоящее время лидеры мысли Javascript, похоже, считают, что фермент тестирует слишком много деталей реализации и склонен к поломке. Я пытаюсь использовать реагирующую библиотеку с формой SFC Formik, и я могу успешно протестировать начальный рендер, но я не могу понять, как проверить реинициализированные значения после выборки в вызове useEffect. Это важно для меня, потому что я хочу проверить наше правильное исходное состояние ошибки.

Я пытался использовать фермент с wrapper.find ({value: someInitialValue}), но я не смог заставить его работать. Я пришел к выводу, что начальные значения на самом деле правильно устанавливаются в компоненте после нескольких визуализаций, используя консольные журналы в моем хуке useEffect.

export const UserCreate = (props: ICreateUserFormProps) => {
      const userId = props.match.params.userId
      const isEditMode = userId !== 'new'
      const [retrievedUser, setRetrievedUser] = useState<UserType | null>(null)
     useEffect(() => {
        if (isEditMode) {
          api.get(`/api/users/${userId}`).then(user => {
            setRetrievedUser(user)
          })
        }
      }, [isEditMode])
     const formInitialValues = isEditMode && retrievedUser ? { firstName: retrievedUser.firstName } : { firstName: ''}
     return (
        <>
          <Formik
            initialValues={formInitialValues}
            isInitialValid={isEditMode && !userFieldErrorsTouched}
            enableReinitialize={isEditMode && !userFieldErrorsTouched}
            onSubmit={saveUser}
            validationSchema={schema}
          >
            {({
              errors,
              setFieldTouched,
              values,
              isValid,
              isSubmitting,
            }: FormikProps<ICreateUserFormValues>) => { <Field name="firstName" />}      
      </Formik>
    </>)
}

describe('Create Edit Users  View', () => {
      beforeEach(() => {
        fetchMock.restore()
        fetchMock.mock('/api/folders', [
          { ...stuff },
        ])
        fetchMock.mock('/api/roles', [
          {... stuff},
        ])
        fetchMock.get('/api/users/1', {
firstName: 'William',})
        fetchMock.mock('/api/authentication/membership?userId=1', {})
      })

        it('renders a properly initialized form for a user id', async done => {
        const {getByText } = render(
          withRouter(CreateEdit, { userId: '1' })
        )   const greetingTextNode = await waitForElement(() => getByText('William'))
        expect(greetingTextNode).toBeDefined()
})

Я представляю, что происходит что-то, где formik не перерисовывает изменения состояния с крючка, и мне было интересно, знает ли кто-нибудь, каково решение.

Пожалуйста, не говорите мне принимать что-то кроме RTL или Enzyme. Я уже использую Cypress, и мне это нравится, но модульные тесты очень полезны для корпоративных проектов.