如何为 React Native 文件编写单元测试，并在 Jest 中运行它们
React Native 是当今最为流行的移动应用程序开发框架之一。开发者们使用 React Native 来构建和测试移动应用程序时，经常面临一个烦恼：如何编写单元测试？本文将介绍如何在 React Native 中编写单元测试并在 Jest 中运行它们，从而为您带来一个更加健壮和稳定的应用程序。
为何需要单元测试？
在构建诸如 React Native 之类的移动应用程序时，遵循测试驱动开发(TDD)的原则是至关重要的。错误的代码不仅会导致应用程序的崩溃，还会耗费开发者大量时间和精力来调试和修复。
单元测试是一个较小范围的测试，专注于测试代码的单个模块或组件。由于单元测试遵循 TDD 原则，因此对于构建更稳定，可靠和可维护的应用程序而言，单元测试可以说是不可或缺的。
在 React Native 中，您可以使用 Jest 这个有名的测试框架来测试您的 React Native 应用。Jest 开始作为一个在 Facebook 上开发的 JavaScript 测试工具，用于支持 React 应用程序的测试。自 React Native 以来，Jest 已成为了 React Native 中最知名和最流行的测试工具之一。
为 React Native 编写单元测试
在 React Native 中，您可以使用 Jest 来编写和运行测试。要编写、运行和调试测试，您需要做以下几个步骤：
- 安装 Jest Jest 是一个使用 Node.js 编写的 JavaScript 测试框架，可以使用 npm 安装，运行以下命令即可：
npm install jest --save-dev
- 编写测试用例 现在，您已经安装了 Jest，接下来，您需要编写测试用例。在 React Native 中，测试使用与组件相似的测试文件，这些测试文件以 .test.js 或 .spec.js 为后缀。
以下是一个使用 Enzyme 和 Jest 编写的 React Native 组件的示例测试用例：
-- -------------------- ---- -------
------ ----- ---- --------
------ - ------- - ---- ---------
------ ------------ ---- ------------------
----------------------- ---- -- -- -
----------- ----------- -- -- -
----- ------- - --------------------- ------------ ----
----------------------------------
---
--------- --- ------- -------- ---- --------- -- -- -
----- ----------- - ----------
----- ------- - --------------------- ------------ --------------------- ----
--------------------------
---------------------------------------------
---
---
在这个测试用例中，我们首先使用 shallow() 创建了一个浅渲染对象(wrapper)，它可以测试自定义按钮是否被正确渲染。接下来，我们使用 simulate() 在按钮上模拟了一次点击事件，并使用 Jest 中的 toHaveBeenCalledTimes() 校验函数来确保函数在点击时有且仅有一次被调用。
- 运行测试用例 在编写了测试用例之后，您需要用 Jest 运行它们。在此之前，您需要配置 Jest 来告诉它在哪里可以找到您的测试文件。
通常，Jest 会自动查找根目录下以 .test.js 或 .spec.js 结尾的文件。如果您正在使用其他文件扩展名，则需要在 Jest 的配置文件中设置自己的 testMatch 属性。
现在您只需运行以下命令即可运行测试用例:
npm test
Jest 将查找所有的测试文件，并给出所有测试结果。在测试运行结束之后，您将看到以下屏幕输出：
PASS ./CustomButton.test.js
<CustomButton />
✓ renders correctly (4ms)
✓ calls the onPress function when clicked (1ms)这意味着，我们编写的测试用例全部通过了，意味着编写的组件和功能正确无误。
结论
在 React Native 开发中，单元测试是非常重要的一部分。通过编写单元测试，可以帮助您验证组件，确保应用程序的可靠性和稳定性。在本文中，我们介绍了如何使用 Jest 为 React Native 文件编写单元测试，并在 Jest 中运行它们的过程。我们还提供了示例代码，希望本文能够帮助您在 React Native 应用程序的开发过程中更加专业地编写单元测试。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67025528d91dce0dc84723e6