前端单元测试入门1

1. 单元测试

1.1 TDD 测试驱动开发

TDD指的是Test Drive Development，很明显的意思是测试驱动开发，也就是说我们可以从测试的角度来检验整个项目。
大概的流程是先针对每个功能点抽象出接口代码，然后编写单元测试代码，接下来实现接口，运行单元测试代码，循环此过程，直到整个单元测试都通过。

1.2 BDD 行为驱动开发

BDD指的是Behavior Drive Development，也就是行为驱动开发。
在TDD中，我们并不能完全保证根据设计所编写的测试就是用户所期望的功能。
BDD将这一部分简单和自然化，用自然语言来描述，让开发、测试、BA以及客户都能在这个基础上达成一致。

2. 测试工具

单元测试框架 mocha http://mochajs.org
断言 chai http:/chaijs.com
代理HTTP请求 supertest https://npmjs.com/package/supertest

2.1 使用 mocha 完成一个简单的测试用例

2.1.1 安装

Chai允许开发人员选择最舒适的接口进行测试语句的编写。具有链式功能的BDD风格提供了富有表现力的语言和可读风格，如expect或者should;而TDD断言风格则提供了更为经典的感觉，如assert。

npm i mocha chai -S -D

2.1.2 页面结构

2.1.3 add.js

function add(x, y) {
   return x + y;
}

module.exports = add;

2.1.4 在测试文件mocha.js中先引入add方法和chai的expect方法

var add=require('../src/add.js');
var expect=require('chai').expect;

2.1.5 然后书写测试脚本

describe('add_test1',function(){
   it('1+1=2',function(){
       expect(add(1,1)).to.be.equal(2);
   });
   it('1+1!=3',function(){
       expect(add(1,1)).to.be.not.equal(3);
   })
})

上面这段代码，就是测试脚本，它可以独立执行。测试脚本里面应该包括一个或多个describe块，每个describe块应该包括一个或多个it块。

describe块称为"测试套件"，表示一组相关的测试。它是一个函数，第一个参数是测试套件的名称（“add_test1”），第二个参数是一个实际执行的函数。

it块称为"测试用例"，表示一个单独的测试，是测试的最小单位。它也是一个函数，第一个参数是测试用例的名称（“1+1=2”），第二个参数是一个实际执行的函数

2.1.6 在package.json的scripts中添加mocha

scripts: {
    "test": "mocha"
}

2.1.7 运行test文件

npm run mocha

运行了上述代码后，会自动运行 /test/*.test.js 文件，得到如下结果

2.2 supertest

启动一个node服务

//app.js
const express = require('express');
const app = express();
app.get('/', function (req, res) {
    res.status(200).json({ name: '1234' });
});
app.listen(8080);
module.exports = app;

使用supertest模拟http请求

//test.js
const app = require('../src/app');
const request = require('supertest');
describe('app', function () {
    it('/', function (done) {
        request(app)
            .get('/')
            .expect('Content-Type', /json/)
            .expect('Content-Length', "15")
            .expect(200)
            .end(done);
    });
});