测试需要参数的已连接反应组件

Question

我正在尝试测试需要props.params.id来调用动作创建者的连接的React组件。当我尝试测试该组件已连接到商店时，出现“ Uncaught TypeError：无法读取未定义的属性'id'”

ReactDOM.render(
  <Provider store={store}>
    <Router history={history}>
      <Route path="/" component={App}>
        <IndexRoute component={PostsIndex}/>
        <Route path="posts/:id" component={ShowPost}/>
      </Route>
    </Router>
  </Provider>
  , document.querySelector('.container'));


describe('ConnectedShowPost', ()=> {
    let initialState = {
      posts: { postsList: postsListData, post: postData, error: '' },
      comments: {showComments: false},
      auth: {authenticated: true}
    };

    store = mockStore(initialState);

    connectedShowPost = TestUtils.renderIntoDocument(<Provider store={store}><ConnectedShowPost/></Provider>);
    showPost = TestUtils.scryRenderedComponentsWithType(connectedShowPost, ShowPost)[0];


    expect(showPost.props.posts.post).toEqual(postData);
  })

我已经尝试在商店中包含params，但是由于在组件内部使用params不会将其连接到商店，因此无法正常工作。

[我也尝试过将其作为ownProps参数传递，但这也不起作用。

作为道具传递给ConnectedShowPost组件会导致商店中的所有其他状态项都不确定。

也尝试直接设置showPost.props.params = {id：'123}，该方法也不起作用。。

关于如何使此测试正常工作的任何想法？

我正在尝试测试需要props.params.id来调用动作创建者的连接的React组件。当我尝试测试组件是否已连接到商店时，出现“ Uncaught TypeError：Cannot ...

Answer 1

如果您连接的组件收到这样的参数：