测试工具:
- mocha & chai (断言库)
- jest (vue 主推)
## :-: mocha
```
// 测试文件要放到 test/unit/ 文件夹下、
// 测试文件必须以 xxx.spec.js 结尾、或 xxx.test.js
// npm run test:unit
// 引入测试工具
import { expect } from 'chai';
// 测试用例
it('-- test 单元', () => {
// 断言
// 判断相等
expect(123).to.be.equal(123); // 基本类型
// deep -- 可以让其后的断言不是比较对象本身,而是递归比较对象的键值对、
expect({ abc: 123 }).to.be.deep.equal({ abc: 123 }); // 引用值
expect({ abc: 123 }).to.be.eql({ abc: 123 }); // 引用值(简写)
// 判断不等
expect(2).to.be.not.equal(1);
// 判断大于
expect(10).to.be.above(5);
expect(10).to.be.greaterThan(5);
// 判断小于
expect(5).to.be.below(10);
expect(5).to.be.lessThan(10);
// 判断大于等于
expect(10).to.be.at.least(10);
expect(10).to.be.not.lessThan(10);
// 判断小于等于
expect(5).to.be.at.most(5);
expect(5).to.be.not.greaterThan(5);
// 判断长度
expect([1, 2, 3]).to.be.lengthOf(3);
// 判断为truthy,(真值:除了false、undefined、null、正负0、NaN、''的值)
expect(1).to.be.ok;
// 判断为true、false、null、undefined、NaN
expect(true).to.be.true;
expect(false).to.be.false;
expect(null).to.be.null;
expect(undefined).to.be.undefined;
expect(NaN).to.be.NaN;
// 判断包含
expect('xxxxx').to.be.include('x'); // 包含
expect('xxxxx').to.be.contain('x'); // 包含
expect('xxxxx').to.be.match(/x/); // 正则匹配
// ---------------------------------------
// expect().to.be.equal()
// expect({}).to.be.equal({}) // 断言失败
// deep -- 可以让其后的断言不是比较对象本身,而是递归比较对象的键值对、
expect({}).to.be.deep.equal({});
// deep的简写 ( expect(xxx).to.be.deep.equal(xxx) )
expect({}).to.be.eql({});
});
```
:-: xxx.spec.js
```
const abs = num => {
if (typeof(num) !== 'number') return NaN;
if (num < 0) return -num;
return num;
},
add = (...rest) => rest.reduce((prev, next) => { return prev + next; });
export { abs, add };
```
```
// 测试文件要放到 test/unit/ 文件夹下、
// 测试文件必须以 xxx.spec.js 结尾、或 xxx.test.js
// npm run test:unit
// 引入测试工具
import { expect } from 'chai';
// 引入要测试的组件
import { abs, add } from '@/xxx.js';
// describe -- 分组(套件)
describe('abs函数', () => {
it('正数', () => {
expect(abs(123)).to.be.equal(123);
});
it('负数', () => {
expect(abs(-321)).to.be.equal(321);
});
it('0', () => {
expect(abs(0)).to.be.equal(0);
expect(abs(-0)).to.be.equal(0);
});
it('传入非数返回NaN', () => {
expect(abs('')).to.be.eql(NaN);
expect(abs(null)).to.be.eql(NaN);
expect(abs(undefined)).to.be.eql(NaN);
expect(abs([])).to.be.eql(NaN);
expect(abs({})).to.be.eql(NaN);
expect(abs(true)).to.be.eql(NaN);
expect(abs(false)).to.be.eql(NaN);
expect(abs(NaN)).to.be.eql(NaN);
});
});
// describe -- 分组(套件)
describe('add函数', () => {
it('求和', () => {
expect(add(1, 2, 3, 4)).to.be.equal(10);
});
});
/*
MOCHA Testing...
√ -- test 单元
abs函数
√ 正数
√ 负数
√ 0
√ 传入非数返回NaN
add函数
√ 求和
6 passing (444ms)
MOCHA Tests completed successfully
*/
```
- 前端工具库
- HTML
- CSS
- 实用样式
- JavaScript
- 模拟运动
- 深入数组扩展
- JavaScript_补充
- jQuery
- 自定义插件
- 网络 · 后端请求
- css3.0 - 2019-2-28
- 选择器
- 边界样式
- text 字体系列
- 盒子模型
- 动图效果
- 其他
- less - 用法
- scss - 用法 2019-9-26
- HTML5 - 2019-3-21
- canvas - 画布
- SVG - 矢量图
- 多媒体类
- H5 - 其他
- webpack - 自动化构建
- webpack - 起步
- webpack -- 环境配置
- gulp
- ES6 - 2019-4-21
- HTML5补充 - 2019-6-30
- 微信小程序 2019-7-8
- 全局配置
- 页面配置
- 组件生命周期
- 自定义组件 - 2019-7-14
- Git 基本操作 - 2019-7-16
- vue框架 - 2019-7-17
- 基本使用 - 2019-7-18
- 自定义功能 - 2019-7-20
- 自定义组件 - 2019-7-22
- 脚手架的使用 - 2019-7-25
- vue - 终端常用命令
- Vue Router - 路由 (基础)
- Vue Router - 路由 (高级)
- 路由插件配置 - 2019-7-29
- 路由 - 一个实例
- VUEX_数据仓库 - 2019-8-2
- Vue CLI 项目配置 - 2019-8-5
- 单元测试 - 2019-8-6
- 挂载全局组件 - 2019-11-14
- React框架
- React基本使用
- React - 组件化 2019-8-25
- React - 组件间交互 2019-8-26
- React - setState 2019-11-19
- React - slot 2019-11-19
- React - 生命周期 2019-8-26
- props属性校验 2019-11-26
- React - 路由 2019-8-28
- React - ref 2019-11-26
- React - Context 2019-11-27
- PureComponent - 性能优化 2019-11-27
- Render Props VS HOC 2019-11-27
- Portals - 插槽 2019-11-28
- React - Event 2019-11-29
- React - 渲染原理 2019-11-29
- Node.js
- 模块收纳
- dome
- nodejs - tsconfig.json
- TypeScript - 2020-3-5
- TypeScript - 基础 2020-3-6
- TypeScript - 进阶 2020-3-9
- Ordinary小助手
- uni-app
- 高德地图api
- mysql
- EVENTS
- 笔记
- 关于小程序工具方法封装
- Tool/basics
- Tool/web
- parsedUrl
- request