在前端开发中，React 是非常流行的框架之一，而 Enzyme 则是 React 组件测试过程中常用的工具之一。Enzyme 提供了一系列 API，可以方便我们对 React 组件进行测试。然而，有时在使用 Enzyme 进行测试时，会遇到 warning: ReactTestUtils has been moved to react-dom/test-utils 的提示信息，这会让我们感到十分困惑。本文将会详细介绍这个 warning 的出现原因以及解决方法，希望能对大家有所帮助。
问题产生的原因
首先，我们来看一下这个 warning 的提示：
-------- -------------- --- ---- ----- -- --------------------- ------ ---------- -- ------ ---- --------
也就是说，这个 warning 是由于我们在测试 React 组件的时候，使用了 ReactTestUtils 相关的 API，但是 ReactTestUtils 已经被移动到了 react-dom/test-utils 库中，在新版的 React 中，ReactTestUtils 已经被标记为过时，并推荐使用 react-dom/test-utils 代替。因此，当我们在使用 Enzyme 的时候，如果还使用了 ReactTestUtils 相关的 API，就会触发这个 warning。
解决方法
那么，如何解决这个问题呢？其实解决起来也非常简单，只需要将我们在测试组件中使用的 ReactTestUtils 相关的 API，全部替换成 react-dom/test-utils 中对应的 API 即可。
以 shallow 渲染为例，我们可以将原来的代码：
------ ----- ---- --------
------ - ------- - ---- ---------
------ - -------------- - ---- ------------------------------
------ ----------- ---- ----------------
----- -------- - -----------------
------------ ----------- -- -- -
---------- -------- -- -- -
---------------------------- ----
----- ------ - ---------------------------
----- ------- - ----------------
----------------------------------
---
---修改成如下代码：
------ ----- ---- --------
------ - ------- - ---- ---------
------ - -------------- - ---- ------------------------------
------ ------------ ---- -----------------------
------ ----------- ---- ----------------
----- -------- - -----------------
------------ ----------- -- -- -
---------- -------- -- -- -
---------------------------- ----
----- ------ - ---------------------------
----- ------- - ----------------------------------------------
----------------------------------
---
---通过添加 TestRenderer，我们成功地将代码中使用的 ReactTestUtils 相关的 API 替换成了 react-dom/test-utils 中对应的 API。
关于其他方法的替换，可以查看官方文档：ReactTestUtils has been moved to react-dom/test-utils.
总结
本文通过详细的介绍，解决了使用 Enzyme 进行 React 组件测试时遇到的 warning: ReactTestUtils has been moved to react-dom/test-utils 的问题。虽然这个问题看起来比较小，但是却很可能给我们带来不必要的麻烦，因此建议大家在使用 Enzyme 进行测试时，时刻注意警告信息，及时更换被标记为过时的 API。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6520d54895b1f8cacd848fa8