前言
突然接到任务给当前React项目做单元测试，在此之前是对测试方面的内容从来没接触过，从零开始，正好借此学习了解一下测试相关的东西。
BDD？
任务描述看的我一头雾水，那就先从什么是BDD开始吧。
BDD：Behavior Driven Development 行为驱动开发
看到全称就清楚很多了，它是一种软件的敏捷开发技术，鼓励软件中的开发者和商业参与者之间的协作。
呃，说白了，就是一种需求驱动开发的软件开发指导思想。
在此之前还有一个TDD，也就是
TDD：Test Driven Development 测试驱动开发
它提出测试要优先于编写代码，通过测试代码约定开发者编写什么产品代码。以此来减少代码中的BUG，让开发者在更少的迭代中写出更高质量的代码，它是敏捷开发中的核心实践和技术。
感兴趣的同学请看详情。
BDD测试框架Mocha
介绍
Mocha（“摩卡”）是目前非常流行的一款JS测试框架。
Mocha是一个在Node.js和浏览器上运行的功能丰富的JavaScript测试框架，使异步测试变得简单而有趣。在GitHub上托管。
入门
请保证你的机器上安装了Node，并且版本>6.0.0。
mkdir test // 新建一个test文件夹
npm init // 生成package.json
npm install mocha // 安装mocha
在test下新建一个add.js， 添加如下代码：
function add (x, y) { return x + y; }
module.exports = add;
用上面的add.js模拟源码，即我们要测试的代码。
现在我们编写测试脚本测试该方法是否正确。
测试脚本的命名规则：一般是和原文件名同名，后缀改为.test.js 或者.spec.js。
新建add.test.js， 添加如下代码：
// 使用node原生的断言库
const assert = require('assert');
const add = require('./add.js');
const mocha = require('mocha')
mocha.describe('add方法测试', function () {
it('2 加 3 等于 5', function () {
assert.equal(add(2, 3), 5)
})
})
describe代表一个测试套件，第一个参数表示该测试套件的名称，第二个参数是执行的函数。
it代表每一个测试用例，是最小的测试单位。第一个参数代表测试单位的名称，第二个参数代表实际执行的函数。
在package.json中添加字段：
"scripts": { "test": "mocha" },
mocha命令默认运行当前路径的test子目录中的测试脚本，但仅仅test目录下一层的所有测试脚本，如果要执行test下的所有脚本，加上参数 --recursive。
当前路径下执行 npm test, 可以看到以下结果：
以上代码中我们使用了node原生的断言库，有node基础的同学肯定不会陌生。
以上结果表示断言通过，耗时12ms。
mocha本身不带断言库，但是它允许你使用多种断言库：
比较常用的断言库是chai，它的expect风格语法可以让你像写英文句子一样去写断言。但这并不代表你一定得使用它。
断言库chai
断言：就是你确定一种代码执行结果，当不是该结果时，抛出一个错误。
chai的断言有三种风格： (风格只是声明断言语法上的不同)
-assert
const assert = require('chai').assert;
const foo = 'foo';
// typeof
assert.typeOf(foo, 'string');
// equal
assert.equal(foo, 'foo');
// lengthOf 第三个参数表示断言可选消息
assert.lengthOf(foo, 3, 'foo的长度等于3');
与原生的node的assertAPI类似。
-should
const should = require('chai').should();
const foo = 'foo';
foo.should.be.a('string');
foo.should.have.lengthOf(3);
should风格的断言基本是以对象开头，.should连接不同的断言方法。
-expect
const expect = require('chai').expect;
const foo = 'foo';
const dinner = { fruits:['apple', 'banana', 'orange'] };
expect(foo).to.be.a('string');
expect(foo).to.equal('foo');
expect(foo).to.have.lengthOf(3);
expect(dinner).to.have.property('fruits').with.lengthOf(3);
expect风格的断言基本是以expect开头，to/to.be连接断言方法：lengthOf/equal/a/match等
mocha测试异步代码
mocha测试异步代码有不止一种方式：
方式一：在测试用例it()的回调中显示调用done()通知mocha测试完成。
describe('User', function () {
describe('save()', function () {
it('用户保存测试', function (done) {
// 传递了done参数后，只有显示调用done()才会结束测试。
let user = new User('Tom');
user.save(function (err) {
if (err) done(err);
else done();
});
})
})
})
方式二：使用Promise， 返回了Promise后不能调用done，否则会报异常。
// 省略测试套件代码
it('测试请求',function () {
return axios.get('http://localhost:8080/user')
.then(function (res) {
return res.json();
}).then(function (jsonRes) {
expect(jsonRes.data).to.be.a('array');
});
});
方式三：使用async/await,如果环境支持
// 省略测试套件代码
it('测试请求', async function () {
const user = await db.find({ type:'user' });
expect(user).to.be.have.lengthOf(3);
})
mocha命令
--recursive 见上文。
--timeout 指定超时门槛，默认是2000ms，超时则认为测试失败。
--compliers 指定转码器
如果要使用ES6语法编写测试代码，则需要安装babel转码器:
npm install babel-core babel-preset-es2015 --save-dev
在项目根目录下建立.babelrc文件，添加
{
"presets":["es2015"]
}
然后执行
mocha --compilers js:babel-core/register
表示所有后缀为js的文件都会用babel先转码，再执行测试。
另外如果代码里有Promise/Map等全局对象，还需要安装bebel-profill，并在脚本头部加入
import 'babel-profill'
mocha --init // 可以初始化一个index.html文件 用于在浏览器查看结果
mocha --help // 查看帮助
全部命令参数查看这里。
mocha生命周期钩子
mocha在BDD式接口(expect, should)的describe测试套件中提供了一套生命周期钩子，请看代码：
describe('hooks', function() {
// once
before(function() {
// runs before all tests in this block
});
// each
beforeEach(function() {
// runs before each test in this block
});
// each
afterEach(function() {
// runs after each test in this block
});
// once
after(function() {
// runs after all tests in this block
});
// test cases
});
mocha测试用例管理
当你执行mocha命令执行测试时，想要跳过某些测试用例，或者某文件中你只想执行一个测试用例。请看代码：
// 下面两个测试用例中，只有```only```的会执行
it()
it.only()
// 下面两个测试用例中，第二个会被忽略
it()
it.skip()
结束语
作者我也是前端小白，边学习边把自己的心得记录下来，希望能帮到有同样需求的同学。如有错误，还恳请看官佬爷们批评指正。
感谢阅读！
参考
阮老师的Mocha 实例教程：http://www.ruanyifeng.com/blog/2015/12/a-mocha-tutorial-of-examples.html
mocha官网：https://mochajs.org/
简书文章:https://www.jianshu.com/p/02d61fa41d66
开发人员看测试之TDD和BDD:https://www.cnblogs.com/bigdataZJ/p/AutoTesting1.html
