React实战-React标配单元测试工具Jest

    xiaoxiao2023-03-24  3

    React实战-React标配单元测试工具Jest

    目前Javascript的测试工具很多,但是针对React的测试策略,Facebook推出的ReactJs标配测试工具是Jest.Jest的官网地址:https://facebook.github.io/jest/。我们可以看到Jest官网宣称的是:Painless JavaScript Testing。是Facebook用于测试服务和React应用程序的JavaScript单元测试框架。

    所谓单元测试也就是对每个单元进行测试,通俗的将一般针对的是函数,类或单个组件,不涉及系统和集成。单元测试是软件测试的基础测试。Jest主要有以下特点:

    适应性:Jest是模块化、可扩展和可配置的。

    沙箱和快速:Jest虚拟化了JavaScript的环境,能模拟浏览器,并且并行执行

    快照测试:Jest能够对React 树进行快照或别的序列化数值快速编写测试,提供快速更新的用户体验。

    支持异步代码测试:支持promisesasync/await

    l 自动生成静态分析结果:不仅显示测试用例执行结果,也显示语句、分支、函数等覆盖率。

    1.为什么要使用单元测试工具

    我们在开发过程中,不使用测试工具依然可以自己写代码进行单元测试,但是我们的代码存在着相互调用关系,在测试过程中我们又希望使单元相对独立而又能正常运行,就需要我们对被测函数的依赖函数和环境进行mock,并且在测试数据输入、测试执行和测试结果检查方面存在很多相似性,测试工具正是为我们在这些方面提供了方便。

    2.如果使用Jest

    使用Jest的过程并不复杂,主要分以下几步:

    a.配置Jest

    与使用所有的Js包一样:可以先配置package.json,再执行npm install。也可以直接采用npm install --save-dev jest命令。

    b.编写测试脚步

    例如被测函数为:

    function sum(a,b){

    return a + b;

    };

    module.exports = sum;

    测试脚步:

    test('add 1+2 equal 3',()=>{

    const sum = require('./sum');

    expect(sum(1,2)).toBe(3);

    });

    c.执行脚本

    执行脚本也可以有多种方式:

    1)在配置文件中配置

    "scripts": {

          "test": "jest"

      },

    2)直接执行命令

    需要安装全局jest命令: npm install -g jest

    直接进入项目,执行命令:jest

    d.查看测试结果

    脚步执行后可直接看到测试结果,自动显示测试用例的执行结果和测试用例数量。如果想看到覆盖率:jest --coverage

    3.使用约束

    使用jest可能会奇怪,jest是如何在源码文件中找到测试脚步并执行的。配置文件中并没有配置测试脚本的入口。其实在jest中我们对脚步的定义是有约束的,可以采用以下几种方式。

    创建__tests__目录,xxx-test.js

    直接创建Xxx.test.js

    直接创建xxx.spec.js

    转载请注明原文地址: https://ju.6miu.com/read-1201485.html
    最新回复(0)