Reactjs 模拟传递给子组件的道具

我不太会开玩笑。我的部件看起来像这样

class ComponentToTest extends React.Component {
    searchName = () => {
        return axios.get(...)
    }
    render() {
        return(
            <Form onSubmit={handleSubmit(save)}>
                <SomeChildComponent searchName={ (searchTerm: string) => this.searchName(searchTerm)} />
            </Form>
        )
    }
}


`ComponentToTest.test.js`
it('should call `handleSubmit` with `save`', () => {
    const store = createStore((state) => state, { app: {} });
    const onSave = jest.fn().mockReturnValue(() => {});
    const props: any = { handleSubmit: onSave };
    const tree = mount(
        <Provider store={store}>
            <ComponentToTest {...props} />
        </Provider>,
    );

    tree.find('button').simulate('submit');
    expect(onSave).toHaveBeenCalled();
});

类ComponentToTest扩展了React.Component{
searchName=（）=>{
返回axios.get（…）
}
render（）{
返回(
this.searchName（searchTerm）}/>
)
}
}
`ComponentToTest.test.js`
它（'应该调用'handleSubmit'和'save'，（）=>{
const store=createStore（（state）=>state，{app:{}）；
const onSave=jest.fn（）.mockReturnValue（（）=>{}）；
const-props:any={handleSubmit:onSave}；
常数树=挂载(
,
);
tree.find（'button'）.simulate（'submit'）；
expect（onSave）.toHaveBeenCalled（）；
});

---

运行此测试后，我遇到错误。有没有办法模拟对searchName的调用并返回promise？

因为您使用的是axios，也许您可以使用

jests mock axios

来模拟

axios。改为获取
调用！这些文档很有帮助：您忘记在prop中调用
searchName
。它应该是
searchName={（searchTerm:string）=>this.searchName（searchTerm）}
。或者更好的是
searchName={this.searchName}