Ionic3 为已创建工程配置单元测试环境

一. 首先下载单元测试example
ionic-unit-testing-example的介绍参考上一篇文章。

二. 为已创建工程配置单元测试环境

1. 安装需要的Node Modules
   为已创建工程配置单元测试环境

npm install --save-dev angular2-template-loader html-loader jasmine jasmine-spec-reporter karma karma-chrome-launcher karma-jasmine karma-jasmine-html-reporter karma-sourcemap-loader karma-webpack karma-coverage-istanbul-reporter istanbul-instrumenter-loader null-loader protractor ts-loader ts-node @types/jasmine @types/node

2. 增加Scripts到package.json 文件

"test": "karma start ./test-config/karma.conf.js",
"test-ci": "karma start ./test-config/karma.conf.js --single-run",
"test-coverage": "karma start ./test-config/karma.conf.js --coverage",
"e2e": "npm run e2e-update && npm run e2e-test",
"e2e-test": "protractor ./test-config/protractor.conf.js",
"e2e-update": "webdriver-manager update --standalone false --gecko false"

以上配置后，可以在命令行中运行这些脚本。如npm run test代表开始单元测试。

3. 增加配置文件
   将ionic-unit-testing-example 工程下面的test-config拷贝到自己的工程下面。总共有以下几个文件：

karma-test-shim.js
karma-config.js
mocks-ionic.js
protractor.conf.js
webpack.test.js

karma-config.js是Karma配置文件。
这个配置文件使用karma-test-shim.js将测试需要的Modules连接起来。
webpack.test.js用于配置和编译我们的测试代码。
protractor.conf.js Protractor的配置文件.
mocks-ionic.js这个文件在ionic-angular module测试中，作为一个替代类的类的集合。

5.增加第一个单元测试
将ionic-unit-testing-example中的app.component.spec.ts中的拷贝的我们工程，并放在对应的文件夹下。这个测试文件用于测试MyApp这个类。

6. 进行单元测试

npm run test

参考：
https://leifwells.github.io/2017/08/27/testing-in-ionic-configure-existing-projects-for-testing/