Jest 是一个流行的 JavaScript 测试框架，被许多前端和开发团队广泛应用于单元测试、集成测试、快照测试等方面。在 GitLab 中使用 Jest 进行测试，可以自动化测试过程，为开发过程提供更高的质量保障。本文将详细讲解在 GitLab CI 中如何使用 Jest 进行测试，并提供示例代码作为参考。
安装 Jest
在使用 Jest 之前，需要先安装 Jest 和其相关库。在全局安装 Jest 之前，需要先安装 Node.js 和 npm。可以通过以下命令检查 Node.js 和 npm 版本：
---- -- --- --
如果未安装，可以在 https://nodejs.org 下载安装。
安装 Jest 的方式可以采用全局安装或者在项目中安装，这里选择在项目中安装。在项目目录下执行以下命令：
--- ------- ---------- ---- ---------- ----------- -----------------
其中，babel-jest 和 @babel/core 是为使用 ES6 语法做准备的，@babel/preset-env 是为了让 Jest 支持新的 JavaScript 语法特性。
配置 Jest
Jest 使用的默认配置文件是 jest.config.js，需要在项目根目录下创建该文件并进行配置。常用的配置项包括：
roots：配置 Jest 执行测试时的根目录，默认为当前目录。testEnvironment：配置 Jest 执行测试时的环境，默认为jsdom。testRegex：配置 Jest 执行测试时匹配到的文件名称，默认为(/__tests__/.*|(\\.|/)(test|spec))\\.[jt]sx?$，也就是匹配以__tests__其中的目录下以.test.js或.spec.js结尾的文件。moduleFileExtensions：配置 Jest 处理的文件扩展名，默认值为['js', 'json', 'jsx']。transform：配置 Jest 处理的文件格式，默认为{'^.+\\.(js|jsx)$': 'babel-jest'}，也就是用 babel-jest 处理以.js或.jsx结尾的文件。
示例 jest.config.js 文件内容如下：
-------------- - -
------ ------------------
---------------- -------
---------- ---------------------------------------------
--------------------- ------ ------- -------
---------- -
-------------- -------------
--
--在 GitLab CI 中使用 Jest
在 GitLab CI 中使用 Jest 进行测试，需要先在 .gitlab-ci.yml 文件中添加测试任务。在项目根目录下创建 .gitlab-ci.yml 文件，并添加以下任务：
-----
------ ------------
-------
- --- -
- --- --- ----其中，test 是自定义的任务名称，image 是使用的 Docker 镜像，这里使用的是 Node.js 14.17.6 版本。script 是运行的脚本，先运行 npm i 安装依赖，然后运行 npm run test 运行 Jest 测试。如果需要在测试运行之前先编译代码，可以在 script 中添加相应的命令。例如：
-----
------ ------------
-------
- --- -
- --- --- -----
- --- --- ----在运行 Jest 测试之前，需要添加相应的测试脚本。可以在 package.json 文件中的 scripts 选项中添加：
---------- - ------- ------ -
编写 Jest 测试
在 __tests__ 目录下新建测试文件，以 .spec.js 或 .test.js 结尾，编写测试代码。例如：
------ - --- - ---- ---------------
--------------- -- -- -
---------- - - - -- ----- --- -- -- -
------------- ------------
---
---在上面的例子中，测试了 sum 函数的功能，期望调用该函数以 1 和 2 为参数时返回 3。
运行 Jest 测试
安装完 Jest 并编写好测试代码后，可以使用命令行运行测试。在项目目录下运行以下命令：
--- --- ----
如果所有测试用例都通过，将输出类似于如下的内容：
---- ---------------------
---
- ---- - - - -- ----- - -----
---- ------- - ------- - -----
------ - ------- - -----如果测试用例有未通过的，将输出类似如下的内容：
---- ---------------------
---
- ---- - - - -- ----- - -----
- --- - ---- - - - -- ----- -
-------------------------------
--------- -
--------- -
- - --------------- -- -- -
- - ---------- - - - -- ----- --- -- -- -
- - - ------------- ------------
- -
- - ---
- - ---
-- ------------------ ----------------------------总结
Jest 是一个流行的 JavaScript 测试框架，可以自动化测试过程，为开发过程提供更高的质量保障。在 GitLab 中使用 Jest 进行测试，通过配置 Jest 和编写相应的测试代码，可以轻松地对代码进行单元测试、集成测试、快照测试等。在该过程中，需要注重配置的使用和给予代码的充分测试，以确保代码的质量和稳定性。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6519274f95b1f8cacd15d880