介绍
Jest 是 Facebook 开源的一款测试框架，可以用来进行前端测试，jest-react-native 则是在 Jest 的基础上加上了对 React Native 的支持，用于编写 React Native 中的单元测试。
本文将介绍使用 npm 包 jest-react-native 进行 React Native 单元测试的教程，从环境搭建到测试实例，都将做详细的讲解。
环境搭建
- 安装 Node.js
因为 jest-react-native 是一个 npm 包，需要使用 Node.js 的 npm 包管理器进行安装和管理，所以需要首先安装 Node.js。可以在官网下载安装包，也可以使用包管理工具，如 Homebrew 进行安装。
- 初始化 React Native 项目
在开始进行单元测试之前，需要先有一个 React Native 项目，如果还没有，可以使用以下命令进行初始化。
$ npx react-native init myProject
- 安装 jest、jest-react-native
使用 npm 进行安装，具体命令如下。
$ npm install --save-dev jest jest-react-native
使用
- 配置文件
在项目根目录下新建 jest.config.js 文件。
-- -------------------- ---- -------
-------------- - -
------- --------------------
------------------------ -
-----------------------------------------------------------
--
------------------- --------------------
-------- -
---------- -
--------- ---------------------
-- ----------------
------------ -
-------- -------------------------------------------
--
------------ ------
--
--
----------------- -
-- ---------------------------------
---------- -------------------
--
---------- -----------------------
--preset：指定使用默认的 jest-react-native 预设配置，可以省去一些额外的配置。transformIgnorePatterns：忽略某些目录或文件的转换，使用正则来匹配。setupFilesAfterEnv：使用测试文件之前需要运行的模块，一般在这里 import 一些全局配置。globals：一些全局配置，指定了 jest 的 transform 和 ts-jest 等配置。moduleNameMapper：导入组件时的路径映射，将 @/src/xx 转换为 ./src/xx，以便 jest 能够找到对应的组件。testMatch：指定测试文件的匹配规则，这里只匹配 .test.ts 或 .test.tsx 结尾的文件，可以根据自己的需要调整。
在项目根目录下新建 jest.setup.js 文件。
// 这里只是一个示例，可以根据自己的需要增加其他配置，如语法监测、mock 等 import '@testing-library/jest-native/extend-expect';
- 编写测试用例
在项目根目录下的 __tests__ 目录下新建测试文件 App.test.tsx。
-- -------------------- ---- ------- ------ --------------- ------ ----- ---- -------- ------ -------- ---------- ---- -------------------------------- ------ --- ---- ------------- ------------- ----------- ----- -- -- - ----- ------------- - ----------- ---- ----- ---- - ------------------------------------------ ------------------------ --------- --- ------------ ------- ----- -- -- - ----- ------------- - ----------- ---- ----- ------ - ---------------------- ------------------------ ----- ---- - ------------------------------------------ ------------------------- ----------- ---
其中涉及到了 render、fireEvent 和 expect 等测试工具函数，可以用来模拟渲染、交互和断言等操作。
- 运行测试
在命令行中执行以下命令，运行测试。
$ npm test
如果一切顺利，控制台中应该输出测试结果，并以绿色表示测试通过，红色表示测试失败。
总结
本文介绍了使用 npm 包 jest-react-native 进行 React Native 单元测试的教程，从环境搭建到测试实例，都做了详细的讲解，希望能够帮助读者更好地进行 React Native 开发，提高代码质量和开发效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/jest-react-native
