单元测试踩坑

问题1

描述：使用react-test-renderer渲染组件，生成快照时报错Unable to find node on an unmounted component.

解决: react-test-renderer版本降级，我之前用的是17.0.0，降级到16.14.0

yarn upgrade [email protected]

问题2

描述：测试antd组件时，报错useLayoutEffect does nothing on the server。

Warning: useLayoutEffect does nothing on the server, because its effect cannot be encoded into the server renderer's output format. This will lead to a mismatch between the initial, non-hydrated UI and the intended UI. To avoid this, useLayoutEffect should only be used in components that render exclusively on the client. See https://fb.me/react-uselayouteffect-ssr for common fixes.
          in CSSMotion
          in LoadingIcon
          in button
          in Context.Consumer
          in Wave
          in Button
          in ExportButton

解决：

jest.mock('react', () => ({
    ...jest.requireActual('react'),
    useLayoutEffect: jest.requireActual('react').useEffect,
}));

---

踩坑是一个持续的过程，所以这篇文章会不断更新，将我做单元测试遇到的所有问题进行汇总。