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 支持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.js和expect.js相较于assert语义性更强，且支持类型检测，而should.js在语法上更加简明，同时支持链式语法.and。

hooks

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

异步测试

Mocha 默认每一个测试用例执行2000ms，超出时长则报错，因此在测试代码中若是有异步操做，则须要经过done函数来明确测试用例结束。done接受Error参数。

BOM/DOM

Mocha 在node环境下运行时，不支持 BOM 和 DOM 接口，须要引入jsdom和jsdom-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便可，将输出测试结果以下图：

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便可，将输出测试结果以下图：

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"，再运行后可得以下结果：