Angular CLI终极参考指南（翻译）-单元测试

Angular CLI终极参考指南

如果翻译内容对你产品困扰，可查看原文The Ultimate Angular CLI Reference Guide

运行单元测试

在你的程序最初创建以后，Angular CLI自动安装Karma test runner
当新增一个功能（组件、指令、管道等）到程序中，你可以使用--spec选项来确认你是否让Angular CLI创建相应的.spect.ts文件来做功能的单元测试。
测试文件与功能在同一目录下，方便你找到他们
src目录下的所有单元测试文件要以.spec.ts结尾，这样就可以在程序中一次运行全部单元测试，运行全部单元测试，可以：

$ ng test

控制台会输出如下内容：

[karma]: No captured browser, open http://localhost:9876/
[karma]: Karma v1.2.0 server started at http://localhost:9876/
[launcher]: Launching browser Chrome with unlimited concurrency
[launcher]: Starting browser Chrome
[Chrome 53.0.2785 (Mac OS X 10.12.0)]: Connected on socket /#9KHc7IVVulsBRJWgAAAA with id 95795517
Chrome 53.0.2785 (Mac OS X 10.12.0): Executed 6 of 6 SUCCESS (0.151 secs / 0.141 secs)

同时会打开新的浏览器窗口

Paste_Image.png

该命令做了什么？

1. Angular CLI 加载 angular-cli.json。
2. Angular CLI 按照 angular-cli.json中指定的配置运行 Karma，karma.conf.js默认定位到项目的根目录。
3. Karma 按照 Karma配置打开浏览器，默认打开Google Chrome浏览器。
4. Karma 使用 Karma配置的测试框架控制浏览器运行src/test.ts文件。默认框架为Jasmine framework。项目创建的时候 src/test.ts文件也被自动创建了。 src/test.ts文件用以预配置项目测试所必须的代码，以及用于运行src目录下所有以spec.ts结尾的测试文件。
5. Karma 将测试结果输出到控制台。
6. 当 Karma 监听到src目录下文件变化，重新运行第4和第5步。
   按crtl+c结束进程。
   如果你想学习更多关于Angular代码测试的知识，可以查阅 Official Angular Testing Guide。

运行E2E测试

应用程序初始化以后，Angular CLI为你自动安装了Protractor
运行E2E测试，输入：

$ ng e2e

控制台输出：

[10:26:12] I/direct - Using ChromeDriver directly...
[10:26:12] I/launcher - Running 1 instances of WebDriver
Started
Spec started
.
  my-app App
    ✓ should display message saying app works
1 spec, 0 failures
Finished in 0.55 seconds
Executed 1 of 1 spec SUCCESS in 0.551 sec.
[10:26:13] I/launcher - 0 instance(s) of WebDriver still running
[10:26:13] I/launcher - chrome #01 passed
All end-to-end tests pass.

同时打开新窗口：

Paste_Image.png

该命令做了什么？

1. Angular CLI 加载angular-cli.json文件。
2. Angular CLI 安装angular-cli.json中指定的配置运行Protractor。默认应用是根目录下protractor.conf.js 文件。
3. Protractor按照Protractor配置项打开浏览器，默认打开Google Chrome浏览器。
4. Protractor通过浏览器运行e2e目录下所有以.e2e-spec.ts结尾的文件。
5. Protractor输出测试结果到控制台。
   进程将在第5步以后自动退出。
   如果你想学习更多关于Andular代码中E2E测试的知识，可以查阅 Official Angular Testing Guide 和Protractor 文档。