我正在为一个组件编写集成测试，该组件应根据异步（重击）redux动作的响应重定向到特定路径。

这是我组件的简化版本：

class MyComponent extends React.Component {

  constructor(props) {
    super(props);
    this.state = {
      redirect: false
    }

    this.props.dispatch(asyncThunkaction())
      .then( () => this.setState({redirec: true}) )
      .catch( (err) => console.log('action failed') )
  }

 ...

  render() {

    if (this.state.redirect) {
      return <Redirect to='/whocares' />
    }
    ...
  }
}

function mapstatetoProps(state) {
  return {
     ...
  };
}

export default connect(mapstatetoProps)(MyComponent);

我想编写一个测试来断言该组件已重定向到预期路径。

我正在使用this technique来检查实际的重定向路径（虽然不完美，但这不是此问题的重点）。

卡住的地方是在执行{uxux / thunk}操作后.then()中的状态更改。因为这是一个承诺，所以重定向会在我的expect语句之后发生，因此我无法对其进行测试。

这是我的测试结果：

const middlewares = [thunk];
const mockStore = configureStore(middlewares);

  test('redirects after thunk action',() => {
    const redirectUrl = '/whocares'
    const data = {};


    jest.mock('../actions');

    act(() => {
      ReactDOM.render(
        <TestRouter
            ComponentWithRedirection={<MyComponent store={mockStore(data)} />}
            RedirectUrl={redirectUrl}
        />,container);
    });
    expect(container.innerHTML).toEqual(
      expect.stringContaining(redirectUrl)
    )
  })

我的TestRouter只是将预期的重定向URL打印到DOM中。 （请查看上面的链接以获取有关此hack的完整说明。）因此，现在，我的测试（正确地）没有击中预期的路线，而是正确地识别了在执行重击操作时出现的加载屏幕。

我认为正确的方法是模拟asyncThunkaction的响应，以便它返回具有匹配数据的已解决的promise，但是到目前为止，我还无法弄清楚怎么做。我遵循manual mocks上的Jest文档，并创建了相应的模拟文件：

// __mocks__/actions.js
const asyncThunkaction = function(){
    return Promise.resolve({foo: 'bar'});
};
export { asyncThunkaction };

...但是我的测试仍然“看到”加载状态。我什至不认为它正在查看我的模拟文件/操作。

正确的方法是什么？