使用enzyme.mount().setProps和react-redux Provider

Question

我有一个设置道具的测试,以观察组件中的一些变化.唯一的复杂因素是我将渲染的元素包装在a中,<Provider>因为树中有一些连接的组件.

我正在渲染

const el = () => <MyComponent prop1={ prop1 } />;
const wrapper = mount(<Provider store={store}>{ el() }</Provider>);

然后我尝试使用以下内容观察一些更改:

wrapper.setProps({ /* new props */ });
// expect()s etc.

问题是setProps()没有在包装组件上正确设置道具.我认为这是因为<Provider>它实际上并没有通过道具,因为它不是HoC.有没有更好的方法来测试这个,而不仅仅是更改本地范围的道具变量和重新渲染？

Answer 1

这是使用 setProps

import { Provider } from 'react-redux';


const renderComponent = properties => mount(
  React.createElement(
    props => (
      <Provider store={store}>
        <IntlProvider locale="en" defaultLocale="en" messages={messages}>
      <Router>
        <MyComponent {...props} />
      </Router>

      </Provider>
    ),
    properties))

然后在你的测试

it('should set some props', () => {
   const renderedComponent = renderComponent(props);
   renderedComponent.setProps({ /* some props */ } });

  expect(true).toBe(true);
})