阅读 2220

JavaScript单元测试框架

我的博客:JavaScript单元测试框架

简介

测试是保证代码质量的重要环节,web项目的单元测试虽然不能完全完成功能测试,但是却能保证底层单一模块的工作质量,并且在代码重构的时候保证对外接口不会发生变化。

测试框架

  • Mocha
  • Jasmine
  • Jest
  • Tape
  • Karma

Mocha

Mocha 是一个灵活的测试框架,但它只是一个结构,你需要引入其他插件来实现一些测试功能,比如断言库、覆盖统计等。

Mocha安装

npm 安装:npm install mocha --save-dev

脚本语法

简要示例:

// 引入需测试的模块或类
const add = require("./add");
const assert = require("assert");

// describe:定义一组测试
describe("加法函数测试", function() {
    before(function() {
        // runs before all tests in this block
    });
    
    // it: 定义一个测试用例
    it("1 加 1 应该等于 2", function() {
        // assert: nodejs内置断言模块
        assert.equal(add(1, 1), 2);
    });
    
    after(function() {
        // runs after all test in this block
    });
});
复制代码

使用方法

为测试脚本创建目录test-mocha,测试脚本命名应遵循[模块名].test.js的风格,然后在package.json中配置测试命令:

"scripts": {
    "test-mocha": "mocha test-mocha/"
}
复制代码

执行npm run test-mocha即可,将输出测试结果如下图:

mocha-执行脚本

断言库

Mocha 支持should.js, chai, expect.js, better-assert, unexpected等断言库。以上一个示例,可以对比一下各个断言库的差别:

  • assert
assert.ok(add(1, 1));
assert.equal(add(1, 1), 2);
复制代码
  • should.js
(add(1, 1)).should.be.a.Number();
(add(1, 1)).should.equal(2);
复制代码
  • expect.js
expect(add(1, 1)).to.be.a("number");
expect(add(1, 1)).to.equal(2);
复制代码
  • chai:支持should, expect, assert三种语法

综上,should.jsexpect.js相较于assert语义性更强,且支持类型检测,而should.js在语法上更加简明,同时支持链式语法.and

hooks

Mocha 支持4种 hook,包括before / after / beforeEach / afterEach

异步测试

Mocha 默认每个测试用例执行2000ms,超出时长则报错,所以在测试代码中如果有异步操作,则需要通过done函数来明确测试用例结束。done接受Error参数。

BOM/DOM

Mocha 在node环境下运行时,不支持 BOM 和 DOM 接口,需要引入jsdomjsdom-global库。

Jasmine

Jasmine 是一个功能全面的测试框架,内置断言expect;但是有全局声明,且需要配置,相对来说使用更复杂、不够灵活。

Jasmine安装

npm 安装:npm install jasmine --save-dev

脚本语法

const add = require("../src/add");

describe("加法函数测试", function () {
    it("1加1等于2", function() {
        expect(add(1, 1)).toEqual(2);
    });
    it("输出数字", function() {
        expect(add(1, 1)).toEqual(jasmine.any(Number));
    });
});
复制代码

Jasmine 的语法与 Mocha 非常相似,不过断言采用内置的expect()

使用方法

新建配置文件jasmine.json:

{
    // 测试脚本相对路径
    "spec_dir": "test-jasmine",
    // 测试脚本
    "spec_files": [
        "*.test.js"
        "!*.notest.js"
    ],
    // 测试前需要引入的脚本
    "helpers": [],
    // 是否在遇到第一个报错后停止测试
    "stopSpecOnExpectationFailure": false,
    // 是否以半随机顺序执行测试
    "random": false
}
复制代码

创建测试脚本目录test-jasmine,脚本文件命名为[模块名].test.js,在package.json中配置测试命令:

"scripts": {
    "test-jasmine": "jasmine --config=jasmine.json"
}
复制代码

然后执行npm run test-jasmine即可,将输出测试结果如下图:

jasmine-执行脚本

hook 和异步

与 Mocha 相似。

Jest

Jest 是一个功能全面的“零配置”测试框架,既集成了各种工具,且无需配置即可使用。

Jest安装

npm 安装:npm install --save-dev jest

脚本语法

Jest 语法与以上两个框架不太相同:

const add = require("../src/add");

describe("加法函数测试", () => {
    test("1加1等于2", () => {
        expect(add(1, 1)).toBe(2);
    }); 
});

复制代码

Jest 中以test定义一个测试用例,且自带断言expect,断言库功能强大,但语法相较于should.js来说更复杂。

断言语法:

  • 普通匹配:toBe, not.toBe
  • 空匹配:toBeNull, toBeUndefined, toBeDefine, toBeTruthy, toBeFalsy
  • 数字大小:toBeGreaterThan, toBeGreaterThanOrEqual, toBeLessThan, toEqual, toBeCloseTo(用于浮点数)
  • 正则匹配:toMatch
  • 数组查询:toContain
  • 构造匹配:toEqual(expect.any(constructor))

使用方法

创建测试脚本目录test-jest,脚本文件命名为[模块名].test.js,在package.json中配置测试命令:

"scripts": {
    "test-jest": "jest test-jest/"
}
复制代码

然后执行npm run test-jest即可,将输出测试结果如下图:

jest-执行脚本

hook

Jest 同样有四个hook,beforeAll/beforeEach/afterAll/afterEach

BOM/DOM

Jest 内置对 DOM 和 BOM 接口的支持。

覆盖统计

Jest 内置覆盖统计,为了更方便地进行相关配置,我们可以创建一个配置文件jest.config.js

module.exports = {
    // 开启覆盖统计功能
    collectCoverage: true,
    // 指定需要覆盖的文件
    collectCoverageFrom: [
        "src/*.js"
    ],
    // 指定输出覆盖统计结果的目录
    coverageDirectory: "test-jest/coverage/",
    // 指定测试脚本
    testMatch: [
    	"**/test-jest/*.test.js"
    ]
};
复制代码

然后将package.json中的命名修改一下:"test-jest": "jest",再运行后可得如下结果:

jest覆盖统计

关注下面的标签,发现更多相似文章
评论