呃呃呃额额,我想这个应该是我写的最没有底气的博客了,因为自己了解到的都是最基本的。废话不说,开始入坑把。。。。。。
Ava,简单的理解就是用于自动化测试的框架,支持ES2017,Promise,Generator,Async,Observable,React。
为什么选择Ava?
(https://github.com/avajs/ava-docs/blob/master/zh_CN/readme.md)
- 轻量和高效
- 简单的测试语法
- 并发运行测试
- 强制编写原子测试
- 没有隐藏的全局变量
- 包含 TypeScript 和 Flow 的类型定义
- Magic assert
- 简明的堆栈跟踪
- 为每个测试文件隔离环境
- 强化断言
- [可选的 TAP 输出显示](#TAP 报告器)
安装Ava
- 在项目根目录下新建测试文件main.test.js,项目结构如下
- 全局安装ava,如果想要在package.json里面看到ava的安装信息,可以添加--save-dev安装到该项目下
- Ava断言
.pass([message]) 测试通过
.fail([message]) 断言失败
.truthy(value, [message]) 断言 value 是否是真值
.falsy(value, [message]) 断言 value 是否是假值
.true(value, [message]) 断言 value 是否是 true
.false(value, [message]) 断言 value 是否是 false
.is(value, expected, [message]) 断言 value 是否和 expected 相等
.not(value, expected, [message]) 断言 value 是否和 expected 不等
.deepEqual(value, expected, [message]) 断言 value 是否和 expected 深度相等
.notDeepEqual(value, expected, [message]) 断言 value 是否和 expected 深度不等
.throws(function|promise, [error, [message]]) 断言 function 抛出一个异常,或者 promise reject 一个错误
.notThrows(function|promise, [message]) 断言 function 没有抛出一个异常,或者 promise resolve
.regex(contents, regex, [message]) 断言 contents 匹配 regex
.notRegex(contents, regex, [message]) 断言 contents 不匹配 regex
.ifError(error, [message]) 断言 error 是假值
.snapshot(expected, [message]) 将预期值与先前记录的快照进行比较
.snapshot(expected, [options], [message]) 将预期值与先前记录的快照进行比较
我们以pass为例子
//main.test.js
import test from 'ava'
import vueLoaderConf from './build/vue-loader.conf.js'
test('vue loader',t =>{
t.pass()
})
执行ava main.test.js,首先保证定位到改项目文件下,执行该命令
C:\Users\13902\Documents\men-config>ava main.test.js
1 passed
1 todo
4.覆盖率,安装nyc,npm install nyc -g,再执行nyc ava main.test.js,可以看到测试文件问题说明,同时会在我们的项目根目录下生成一个.nyc_output文件
Stms
: Statement 的缩写,语句覆盖,通常指某一行代码是否被测试覆盖了,不包括注释,条件等。Branch
: 分支覆盖或条件覆盖,指某一个条件语句是否被测试覆盖了,如:if
、while
;分支数是条件语句的两倍。Funcs
: Function 的缩写,函数覆盖,指这个函数是否被测试代码调用了。Lines
: 行覆盖,通常情况等于语句覆盖。一行未必只有一条语句(官方给的差异解释):https://github.com/gotwarlost
5.npm脚本测试,ava --init,会在你package.json的scripts的test里面增加了ava,执行npm main.test.js,会出现和4下面一样的结果,这个时候我们就可以用npm代替ava了。
6.生成html测试报告,在我们package.json的scripts的test里面增加的加上"report": "nyc report --reporter=html",
执行npm run report ,会在我们的根目录下生生coverage文件夹,里面会将我们的测试文件转化成htm等文件,直观的看出测试报告。最终的文件结构如下:
测试报告
其实我写的都是很简单的例子,写好ava,感觉还是要慢慢琢磨。
总结:npm install ava --save-dev --->ava main.test.js --->npm install nyc -g ---> nyc ava main.test.js ---> ava --init --->npm main.test.js --->npm run report 。