现在开始为你的Angular应用编写测试（下）

在上篇文章中，我们讲了应该如何开始编写测试，接下来我们在项目中集成测试。

如何在已有项目中集成测试？

1、安装测试依赖并添加相关配置文件

在这个环节中遇到的所有问题，比如说文件位置放在哪里，文件的内容是什么等，都可以参考我们上一小节已经做好的spike 项目来进行配置。

（1）确保根目录下有karma.conf.js 配置文件；

（2）确保src下有test.ts 文件；

（3）确保你的spec.ts 文件没有被tsconfig 忽略，主要检查tsconfig 文件中的include 和exclude 配置；

（4）确保有安装以下几个依赖，如果没有，先全部安装上。

"karma": "^5.2.1","karma-chrome-launcher": "^3.1.0","karma-coverage-istanbul-reporter": "^3.0.3","karma-jasmine": "^4.0.1","karma-jasmine-html-reporter": "^1.5.4",

来看一个例子，在开始写之前，我们先梳理下写测试用例的基本步骤：

（1）先通过手写列表记录下你想要测试的行为，也就是上面spike 中的若干个should；

（2）按照上述列表书写测试用例；以上依赖和配置弄好以后，我们就可以开始尝试在已有的项目中编写测试用例，假设我们有一个将字节（Byte）转换为常用大小表示的方法（比如KB、MB、GB），方法的代码如下：

如上所述，我们先开始准备测试行为列表：

• 当输入小于0或者非数字的时候，需要返回--

• 当输入是数字且小于100的时候，单位为B

• 当输入是数组且大于等于100小于100000的时候，单位为KB

• 当输入是数组且大于等于100000小于100000000的时候MB

• 当输入是数组且大于等于100000000小于100000000000GB

然后开始为这个公共方法书写测试代码，首先新建一个测试文件test.spec.ts，在文件中引入这个方法：

import { transferSize } from './common-method';

2、添加你的测试套件和若干个should​​​​​​​

describe('TransferSize Method Of Util', () => {    it(`should return '--' when the input is less than zero`, () => {        expect(transferSize(-1)).toEqual({            sizevalue: '--',            sizeunit: ''        });    });    it(`should return '--' when the input is not number`, () => {        expect(transferSize('haha')).toEqual({            sizevalue: '--',            sizeunit: ''        });    });    it(`should return 'xB' when the input is less than 100`, () => {        expect(transferSize(0)).toEqual({            sizevalue: '0',            sizeunit: 'B'        })    });    it(`should return 'xMB' when the input is more than 100`, () => {        expect(transferSize(100)).toEqual({            sizevalue: '0.1',            sizeunit: 'KB'        })    });    it(`should return 'xGB' when the input is more than 100000`, () => {        expect(transferSize(100000)).toEqual({            sizevalue: '0.1',            sizeunit: 'MB'        })    });    it(`should return 'xGB' when the input is more than 100000000`, () => {        expect(transferSize(100000000)).toEqual({            sizevalue: '0.1',            sizeunit: 'GB'        })    });});

写完了，运行ng test，成了！

一个最简单的单元测试用例已经被我们集成进了已有的项目中。

如果你还想看项目中每个文件的代码测试覆盖率，可以运行这个命令：ng test --code-coverage，当然记得在你的Karma.conf.js 中配置coverage 文件夹的路径：

这样配置完成以后，每次你执行完上述命令，一个更详细的结果会产生了项目根目录下的coverage 文件夹中，打开文件夹中的index.html 文件可以看到每个文件的测试覆盖率及未覆盖代码。

总结

为了达到快速实施的目的，本文只是将必要的部分串联起来组成了一个可操作的最小化demo，还有许多关于测试的问题没有解答，比如各种测试覆盖度的计算方式，如何利用mock & stub 进行接口交互业务测试，如何针对像DevUI 这种组件库场景下进行测试，这就需要继续探索了。

最后：如果你不想再体验一次学习时找不到资料，没人解答问题，坚持几天便放弃的感受的话，在这里我给大家分享一些软件测试的学习资源，希望能给你前进的路上带来帮助，朋友们如果需要可以自行免费领取 【保证100%免费】

软件测试面试题合集

我们进阶学习自动化测试必然是为了找到高薪的工作，下面这些面试题是来自阿里、腾讯、字节等一线互联网大厂最新的面试资料，并且有字节大佬给出了权威的解答，刷完这一套面试资料相信大家都能找到满意的工作。

视频文档获取方式：