前端自动化测试

测试工具

测试主要使用到的工具是测试框架、断言库以及代码覆盖率工具

1. 测试框架：Mocha、Jasmine 等等，测试主要提供了清晰简明的语法来描述测试用例，以及对测试用例分组，测试框架会抓取到代码抛出的 AssertionError，并增加一大堆附加信息，比如那个用例挂了，为什么挂等等。测试框架通常提供 TDD（测试驱动开发）或 BDD（行为驱动开发）的测试语法来编写测试用例，关于 TDD 和 BDD 的对比可以看一篇比较知名的文章 The Difference Between TDD and BDD。不同的测试框架支持不同的测试语法，比如 Mocha 既支持 TDD 也支持 BDD，而 Jasmine 只支持 BDD。

2. 断言库：Should.js、chai、expect.js 断言库提供了很多语义化的方法来对值做各种各样的判断。当然也可以不用断言库，Node.js 中也可以直接使用原生 assert 库。这里后续以 Should.js 为例

3. 代码覆盖率：istanbul 等等为代码在语法级分支上打点，运行了打点后的代码，根据运行结束后收集到的信息和打点时的信息来统计出当前测试用例的对源码的覆盖情况。

参考文档：https://cloud.tencent.com/developer/article/1665717 (opens new window)

前端自动化测试方向

1. 界面回归测试 测试界面是否正常，这是前端测试最基础的环节

界面回归测试常见的做法有像素对比和 dom 结构对比两个方向。

像素对比工具：PhantomCSS，dom 结构对比方案：page-monitor

2. 功能测试 测试功能操作是否正常，由于涉及交互，这部分测试比界面测试会更复杂，

Phantomjs、CasperJS

3. 性能测试 页面性能越来越受到关注，并且性能需要在开发过程中持续关注，否则很容易随着业务迭代而下降。

Phantomas

4. 页面特征检测 有些动态区域无法通过界面对比进行测试、也没有功能上的异常，但可能不符合需求。例如性能测试中移动端大图素材检测就是一种特征检测，另外常见的还有页面区块静态资源是否符合预期等等。

参考地址：http://fex.baidu.com/blog/2015/07/front-end-test/ (opens new window)