Question

我想自己测试一个React组件，而不要使用模拟存储。
假设我有一个连接到Redux存储的组件，并且导出了两次：

class MyComponent extends Component {
 ...
}

export {MyComponent};

export default withRouter(
  connect(
    mapStateToProps,
    mapDispatchToProps
  )(injectIntl(MyComponent))
);

然后在测试文件中，我将导入未连接的版本：

import {MyComponent} from "./MyComponent"

const component  = shallow(<MyComponent />);

这是导出组件的正确方法吗？您如何在连接的组件上进行单元测试？通过不使用模拟存储进行单元测试，可以节省多少时间？我的测试非常耗时，因为每个人都在对所有连接的组件使用模拟存储。

Answer 1

您的方法是正确的，尽管我惯用的语法是export class MyComponent extends Component {...}。

我认为，连接的组件实际上不需要单元测试，因为您应该相信所有涉及的部分（mapStateToProps，mapDispatchToProps，connect）都可以直接使用。毕竟是来自外部库。

mapStateToProps和mapDispatchToProps都不应该过于复杂，mapStateToProps会将复杂的东西委托给选择器（您可以独立进行单元测试），而mapDispatchToProps只是将redux动作放入一个对象，或者做一些映射（例如，当使用与React组件不同的参数来分派动作时）。在后一种情况下，您可以导出mapDispatchToProps并通过仅模拟调度函数来对其进行单元测试。

与将酶可以mount()进行连接的真实连接组件的所有模拟汇总在一起相比，这要省得多。但是，有时这可能是必要的，但我认为这更多是一种集成测试。

如何正确导出两次以进行酶测试

1 个答案: