在我以前的
javascript fullstack项目中,单元测试一直是分裂的,react前端用jest,node.js后端用mocha。由于在前端使用jest时,所体会到的简洁,让我一直有冲动想用jest来一统江湖。在最近的一个项目中,我做到了,对比mocha,我有下面一些体会。
配置简洁
jest几乎是可以零配置的。它会自动识别一些常用的测试文件pattern,比如__test__ 、*.spec.js、 *.test.js等。我的nodejs项目的配置文件只有下面几行,下面是指package.json文件:
"scripts": {
"test": "jest"
},
"jest": {
"testEnvironment": "node"
}
testEnvironment这个配置是对于nodejs项目是必须的,如果不配置,在async的单元测试中如果抛出异常,则系统不会立刻停止,而只会超时,并且不会定位错误位置。
配置完后,就可以用yarn run test来运行测试了。
测试代码简洁
- 在
mocha中我们必须要describe,比如:
descibe('suiteA', () => {
before(() => {})
it('testA', () => {
})
it('testA', () => {
})
)
可是文件已经把一个个suite分开,为什么还要describe,所以jest可以省略describe,如下:
beforeAll(() => {})
it('testA', () => {
})
it('testA', () => {
})
-
jest几乎内置了所有单元测试需要的库,比如mock和expect,无需像mocha一样需要引入一堆。
易于和babel集成
为了能使用更多的纯nodejs暂时不支持的语法(比如:import ),越来越多的nodejs项目使用babel来编译项目。在jest中支持babel只需要安装jest-babel,即运行:yarn add jest-babel。
内置丰富的expect
而jest内置expect,甚至比chai[1]更丰富,比如:
- 支持snapshot,这个是
jest的killing feature
比如我们要写一个JSON转XML函数jsonToXml: string => string,而且输入和输出都相对长,我们可能会这样写测试用例:
it('make sure transform works', () => {
const input = `{
"name": "ron",
"job": "programmer",
"tags": ["javascript", "functional programming"],
}`
const expectedOutput = `
<user><name>ron</><job>programmer<job/><tags><tag>javascript</tag><tag>functional programmer</tags></tags></user>
`
expect(jsonToXml(input)).toEqual(expectedOutput)
})
请问此时你的眼睛花了没?更麻烦的是,当要修改函数时,所有的校对又要重新来一遍。
jest针对这种场景提出了更好的解决方案snapshot,上面的用例可以这样写:
it('make sure transform works', () => {
const input = `{
"name": "ron",
"job": "programmer",
"tags": ["javascript", "functional programming"],
}`
expect(jsonToXml(input)).toMatchSnapshot()
})
其原理就是,jest会把需要expect的内容(即expected result)自动保存到一个自动生成的文件中,在以后每次运行测试用例时都会比较以前保存的内容。如果修改了函数,则测试用例会fail,但若确定这是by design,则可以运行jest -u来更新自动保存的文件。
- 更好地对promise的支持,特别是对
reject的支持
it('fetchData() rejects to be error', () => {
// make sure to add a return statement
return expect(Promise.reject('octopus')).rejects.toBeDefined();
});
test('fetchData() rejects to be error', async () => {
const drinkOctopus = new Promise(() => {
throw new DisgustingFlavorError('yuck, octopus flavor');
});
await expect(drinkOctopus).rejects.toMatch('octopus');
});
- 其它还有比如:
expect.objectContaining、expect.arrayContaining等
webstorm已经支持jest
之前,我没有转jest的一个很重要的原因是webstorm不支持,不过在2017.1的版本中已经支持jest了。
jest还在频繁地更新中
mocha似乎已经处于维护阶段,而jest还在高频地开发中,一定会迭代出更多的新功能。
总结
在我迁移的这2个月中,jest让我可以更简洁地测试,并没有感觉到用什么mocha可以做,而jest不能做或者做起来比较困难的。我想是时候和陪伴了我多年的mocha说bye bye了。
-
一个专门的
assert库,mocha不内置expect,因此一般使用mocha时会使用chai↩