Question

目前，Javascript的思想领袖似乎认为酶测试了太多的实现细节，并且容易损坏。我正在尝试将SFC Formik表单与react-testing-library一起使用，并且可以成功地测试初始渲染，但是我似乎无法弄清楚如何在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或酶以外的其他方法。我已经在使用赛普拉斯，并且喜欢它，但是单元测试对于企业项目非常有用。

如何在Formik无状态功能组件中测试重新初始化？

0 个答案: