enzyme的三种渲染方式

$ npm run test:all ==yarn test:all  # 执行所有测试

单元测试部分：jest 是一个 node 端运行的测试框架，使用了 jsdom 来模拟 DOM 环境，适合用于快速测试 React 组件的逻辑表现，需要真实浏览器可以参考 E2E 测试部分。

 

enzyme的三种渲染方式

1、shallow渲染叫浅渲染，仅仅对当前jsx结构内的顶级组件进行渲染，而不对这些组件的内部子组件进行渲染，因此，它的性能上最快的，大部分情况下，如果不深入组件内部测试，那么可以使用shallow渲染

2、mount则会进行完整渲染，而且完全依赖DOM API，就是说mount渲染的结果和浏览器渲染结果一样，结合jsdom这个工具，可以对上面提到的有内部子组件实现复杂交互功能的组件进行测试。

3、render也会进行完整渲染，但不依赖DOM API，而是渲染成HTML结构，并利用cheerio实现html节点的选择，它相当于只调用了组件的render方法，得到jsx并转码为html，所以组件的生命周期方法内的逻辑都测试不到，所以render常常只用来测试一些数据（结构）一致性对比的场景。在这里还提到，shallow实际上也测试不到componentDidMount/componentDidUpdate这两个方法内的逻辑。