[TOC]
单元测试阿里巴巴准则
1.【强制】好的单元测试必须遵守AIR原则。
说明：单元测试在线上运行时，感觉像空气（AIR）一样并不存在，但在测试质量的保障上，却是非常关键的。好的单元测试宏观上来说，具有自动化、独立性、可重复执行的特点。
A：Automatic（自动化）
I：Independent（独立性）
R：Repeatable（可重复）
2.【强制】单元测试应该是全自动执行的，并且非交互式的。测试用例通常是被定期执行的，执行过程必须完全自动化才有意义。输出结果需要人工检查的测试不是一个好的单元测试。单元测试中不准使用System.out来进行人肉验证，必须使用assert来验证。
3.【强制】保持单元测试的独立性。为了保证单元测试稳定可靠且便于维护，单元测试用例之间决不能互相调用，也不能依赖执行的先后次序。
反例：method2需要依赖method1的执行，将执行结果作为method2的输入。
4.【强制】单元测试是可以重复执行的，不能受到外界环境的影响。
说明：单元测试通常会被放到持续集成中，每次有代码check in时单元测试都会被执行。如果单测对外部环境（网络、服务、中间件等）有依赖，容易导致持续集成机制的不可用。
正例：为了不受外界环境影响，要求设计代码时就把SUT的依赖改成注入，在测试时用spring 这样的DI框架注入一个本地（内存）实现或者Mock实现。
5.【强制】对于单元测试，要保证测试粒度足够小，有助于精确定位问题。单测粒度至多是类级别，一般是方法级别。
说明：只有测试粒度小才能在出错时尽快定位到出错位置。单测不负责检查跨类或者跨系统的交互逻辑，那是集成测试的领域。
6.【强制】核心业务、核心应用、核心模块的增量代码确保单元测试通过。
说明：新增代码及时补充单元测试，如果新增代码影响了原有单元测试，请及时修正。
7.【强制】单元测试代码必须写在如下工程目录：src/test/java，不允许写在业务代码目录下。
说明：源码构建时会跳过此目录，而单元测试框架默认是扫描此目录。
8.【推荐】单元测试的基本目标：语句覆盖率达到70%；核心模块的语句覆盖率和分支覆盖率都要达到100%
说明：在工程规约的应用分层中提到的DAO层，Manager层，可重用度高的Service，都应该进行单元测试。
9.【推荐】编写单元测试代码遵守BCDE原则，以保证被测试模块的交付质量。
B：Border，边界值测试，包括循环边界、特殊取值、特殊时间点、数据顺序等。
C：Correct，正确的输入，并得到预期的结果。
D：Design，与设计文档相结合，来编写单元测试。
E：Error，强制错误信息输入（如：非法数据、异常流程、非业务允许输入等），并得到预期的结果。
10.【推荐】对于数据库相关的查询，更新，删除等操作，不能假设数据库里的数据是存在的，或者直接操作数据库把数据插入进去，请使用程序插入或者导入数据的方式来准备数据。
反例：删除某一行数据的单元测试，在数据库中，先直接手动增加一行作为删除目标，但是这一行新增数据并不符合业务插入规则，导致测试结果异常。
11.【推荐】和数据库相关的单元测试，可以设定自动回滚机制，不给数据库造成脏数据。或者对单元测试产生的数据有明确的前后缀标识。
正例：在RDC内部单元测试中，使用RDC_UNIT_TEST_的前缀标识数据。
12.【推荐】对于不可测的代码建议做必要的重构，使代码变得可测，避免为了达到测试要求而书写不规范测试代码。
13.【推荐】在设计评审阶段，开发人员需要和测试人员一起确定单元测试范围，单元测试最好覆盖所有测试用例（UC）。
14.【推荐】单元测试作为一种质量保障手段，不建议项目发布后补充单元测试用例，建议在项目提测前完成单元测试。
15.【参考】为了更方便地进行单元测试，业务代码应避免以下情况：
- 构造方法中做的事情过多。
- 存在过多的全局变量和静态方法。
- 存在过多的外部依赖。
- 存在过多的条件语句。
说明：多层条件语句建议使用卫语句、策略模式、状态模式等方式重构。
16.【参考】不要对单元测试存在如下误解：
- 那是测试同学干的事情。本文是开发手册，凡是本文内容都是与开发同学强相关的。
- 单元测试代码是多余的。汽车的整体功能与各单元部件的测试正常与否是强相关的。
- 单元测试代码不需要维护。一年半载后，那么单元测试几乎处于废弃状态。
- 单元测试与线上故障没有辩证关系。好的单元测试能够最大限度地规避线上故障。
为什么
单元测试有很多好处, 比如:
- 提高信心，适应变化和迭代. 如果现有代码有较为完善的单元测试，在代码重构时，可以检验模块是否依然可以工作, 一旦变更导致错误，单元测试也可以帮助我们快速定位并修复错误
- 单元测试是集成测试的基础
- 测试即文档。如果文档不能解决你的问题，在你打算看源码之前，可以查看单元测试。通过这些测试用例，开发人员可以直观地理解程序单元的基础API
- 提升代码质量。易于测试的代码，一般都是好代码
测什么?
业务代码或业务组件是比较难以实施单元测试的，一方面它们比较多变、另一方面很多团队很少有精力维护这部分单元测试。所以通常只要求对一些基础/底层的组件、框架或者服务进行测试, 视情况考虑是否要测试业务代码
单元测试指标:
一般使用测试覆盖率来量化，尽管对于覆盖率能不能衡量单元测试的有效性存在较多争议。
大部分情况下还是推荐尽可能提高覆盖率, 比如要求语句覆盖率达到70%；核心模块的语句覆盖率和分支覆盖率都要达到100%. 视团队情况而定
https://juejin.im/post/5d3a7134f265da1b5d57f1ed
安装加运行
1.安装jest
npm install --save-dev jest @vue/test-utils
2.vue-jest
vue-jest是一个 预处理器，如果不安装vue-jest，jest无法处理.vue
npm install --save-dev vue-jest
3.配置scripts
"scripts": {
//"test": "jest",
"test": "jest --config ./src/test/unit/jest.config.js --coverage --watchAll"
}
// --coverage 生成html报表
// --watchAll 实时监测修改打用例
4.在src/test/unit文件夹下新建jest.config.js来配置
- 这个配置如果你项目的时候配置了jest就已经存在
const path = require('path');
module.exports = {
verbose: true,
testURL: 'http://localhost/',
rootDir: path.resolve(__dirname, '../../../'),
moduleFileExtensions: [
'js',
'json',
'vue',
],
testMatch: [ // 匹配测试用例的文件
'<rootDir>/src/test/unit/specs/*.spec.js',
],
transform: {
'^.+\\.js$': 'babel-jest',
'.*\\.(vue)$': 'vue-jest',
},
testPathIgnorePatterns: [
'<rootDir>/test/e2e',
],
moduleNameMapper: {
'^@/(.*)$': '<rootDir>/src/$1',
},
};
5.在src/test/unit新建文件夹specs，在里面写测试代码
[图片上传失败...(image-770746-1587087856993)]
6.项目案例
- ATest.vue文件
<template>
<div>
<input type="checkbox" class="checkAlls" @on-change="checkboxChange" v-model="checkAll">
</div>
</template>
<script>
export default {
name: 'ATest',
data() {
return {
checkAll: false,
};
},
methods: {
checkboxChange(value) {
this.$emit('on-change', value);
},
},
};
</script>
- ATest.spec.js
// import { mount, createLocalVue } from '@vue/test-utils';
// import ATest from '../../../components/ATest.vue';
// const localVue = createLocalVue();
// describe('ATest.vue', () => {
// const wrapper = mount(ATest, {
// localVue
// });
// it("事件被正常触发", () => {
// const stub = jest.fn();
// wrapper.setMethods({ checkboxChange: stub });
// //触发自定义事件
// // wrapper.find(".checkAlls").vm.$emit("on-change");
// wrapper.setData({ checkAll: true });
// expect(wrapper.vm.checkAll).toBe(true);
// })
// })
import { shallowMount } from '@vue/test-utils'
import ATest from '../../../components/ATest.vue';
// __test__/unit/MyHeader.js
it('提示 ATest 样式是否有发生变更', () => {
const wrapper = shallowMount(ATest)
expect(wrapper).toMatchSnapshot()
})
7.执行监测
npm run test
在项目根目录的coverage文件夹里面有一个index.html，找到在浏览器打开能看到测试报告
8.环境安装运行报错整理
- 找不到babel-core
cannot find 'babel-core'
原因：到目前为止vue-jest v25.0.1，引用的是babel-core6.+而不是7，本地安装的是@babel/core，导致包版本不同。
方案一：去对应的文件 require引入的babel-core 改为 @babel/core.（没有网络的环境，后遗症是要备注交接的时候要告诉别人）
方案二：装babel兼容方案，babel-brige（有网环境）
npm i -D babel-core@^7.0.0-bridge.0
jest学习笔记
前端单元测试基本规则
- 检测方法运行正确
- 检测传值正确
- 检测多种情况渲染正确
- 操作dom到达预期效果
长更中，有问题请留言
