AngularJS中的两种测试类型(+1)

测试 AngularJS 不像看起来那么简单(不过测试前端的任何东西都挺难的)。AngularJS 是个非常牛逼的框架，能让你测试应用的所有领域，不过它还是需要进行一些配置。AngularJS 提供单元测试和 E2E (End-to-End) 测试两种截然不同的测试。单元测试是一小段独立的，单元代码，可以从各个角度任你玩。而E2E测试是在一个HTTP服务上跑一个测试，从头到尾，也就是所谓的端到端。可以这样想象，一个机器人用浏览器运行测试，当页面准备好之后，测试并检测页面上各断言。基本上，E2E测试相当于你刷新一个页面，然后说"这里应该说啥"或者"这里应该重复列表五次”，这样的事情。

AngularJS 牛逼的地方是 E2E 测试全支持的，当然这是 Karma 的一部分。

好了，这就是主要的两个测试方式，那么第三个是？好吧，第三个测试其实要用到 AngularJS 的一个测试插件，看起来像白盒测试。这是用来测试应用的源代码，可以访问你的 JavaScript 代码的每一层。这个测试落在单元测试和E2E测试之间。因为单元测试有时颗粒太细了，相当繁琐，比如说你想从应用级别的操作(比如页面操作或者 XHR 请求之类)，你要用到拦截器或者是 Mock 来使请求和模板起作用(基本 XHR 的所有)。E2E测试也不一定是好选择，因为用来测某个特性的话有时候显得层面太高。比如说，你怎么测试你网站上面 XHR 请求下载用户的 Session 的时候， Controller 的性能? … 你不能用E2E来测(因为用E2E非常难访问 scope 成员，和应用级别的 Javascript 代码)， 而但愿测试又要求好多的模拟和假数据，会导致你的测试更多的代码更复杂。我们真正需要的的是一个第三方测试方式，用在解决这种中间情况。因此，这种用来测试 AngularJS 应用的方式 Midway 测试。

->猛击这里查看 ngMidwayTester

Midway 测试已经包含在测试项目中了，无需单独下载，下面提到的 Midway 测试都是指可以用 Midway 方式执行的测试代码。

下面是三种方式的简要对比：

单元测试：

• 代码级别的测试
• 适用于Services，class，和Object
• 沙盒和独立测试
• 需要模拟数据
• 快速

Midway测试：

• 应用/代码级别测试
• 可以访问应用的所有层面
• 可以直接作用Web应用代码
• 模拟数据没啥用
• 容易中断，因为依赖于应用的代码。不过也利于捕捉代码层的异常
• 不能测你 index.html 里面的任何东西
• 快，但是对 XHR 请求慢

E2E测试：

• 页面级别测试
• 需要有服务端
• 需要AngularJS特定的判别模块，比如 expect 和 should
• 完美的迭代测试
• 非常适用断言
• 不能访问应用的 JavaScript 代码，只能渲染 HTML 和一部分 AngularJS
• 慢

因为现在我们知道了每个测试方式的含义，让我们接下来看看如何完全测试我们的 AngularJS 英勇。下面的每一章，会给单元测试，E2E测试，和 Midway 测试提供一个例子，让我们掌握如何测试全面的 AngularJS 应用。