酶：在匿名 function 中找到（）formik 組件

Question

我正在使用酶來測試反應成分。 我有一個具有這種結構的formik表單：

表單.js

export class Form extends Component {
    constructor(props) {
        //...
    }

    render() {
        <Formik
            inititalValues={{
                //...
            }}
            onSubmit={(values, { resetForm }) => {
                //...
                //...
            }}
            onReset = {(values, formProps) => {
                //...
            }}
            validationSchema={
                //...
            }>

            {
                (props) => {
                    const {values, errors, handleSubmit} = props;
                    return (
                        <form onSubmit={handleSubmit}>
                            <input type='text' name='email' />
                            <input type='password' name='password' />
                            <button type='submit'>Submit</button>
                        </form>
                    )
                }
            }

        </Formik>
    }
}

我如何使用酶的 find() 方法來獲取這些輸入文件？

我可以獲得主要的<Formik>組件，但無法獲得匿名 function 中的輸入字段。 任何幫助都將不勝感激。

Answer 1

您可以使用dive()來展開嵌套form 。

shallow(<Form {...props} />)
  .find(Formik)
  .dive()

您也可以使用prop(key)直接觸發 Formik 道具

shallow(<Form {...props} />)
  .find(Formik)
  .prop('onSubmit')(args)