这里搭建的环境是Jasmine作为单元测试框架，Karma框架作为自动化测试的框架。
1.首先需要下载相关的依赖，
"jasmine":
"^2.8.0",
"jasmine-core":
"^2.8.0",
"jasmine-spec-reporter":
"^4.2.1",
"karma":
"^1.7.1",
"karma-chrome-launcher":
"^2.2.0",
"karma-cli":
"^1.0.1",
"karma-coverage-istanbul-reporter ":
"^1.3.0",
"karma-jasmine":
"^1.1.0",
"karma-jasmine-html-reporter":
"^0.2.2",
"karma-mocha-reporter":
"^2.2.4",
"karma-remap-istanbul":
"^0.6.0",
"typescript":
"2.3.4"
2.配置相关的文件
1.新建typings.json文件，写入如下内容
{
"globalDependencies": {
"jasmine":
"registry:dt/jasmine#2.5.2+20170317130948",
}
}
2.新建karma.conf.js文件，并写入如下内容
module
.
exports
=
function
(
config
) {
config.
set({
basePath:
'',
frameworks: [
'jasmine',
'@angular/cli'],
plugins: [
require(
'karma-jasmine'),
require(
'karma-chrome-launcher'),
require(
'karma-remap-istanbul'),
require(
'karma-mocha-reporter'),
require(
'@angular/cli/plugins/karma')
],
files: [
{
pattern:
'./src/libriary/testing/preprocessors.ts',
watched:
false }
],
preprocessors: {
'./src/libriary/testing/preprocessors.ts'
: [
'@angular/cli']
},
mime: {
'text/x-typescript'
: [
'ts',
'tsx']
},
remapIstanbulReporter: {
reports: {
html:
'coverage',
lcovonly:
'./coverage/coverage.lcov'
}
},
angularCli: {
config:
'./angular-cli.json',
environment:
'dev'
},
reporters:
config.
angularCli &&
config.
angularCli.
codeCoverage
? [
'mocha',
'karma-remap-istanbul']
: [
'mocha'],
port:
9876,
colors:
true,
logLevel:
config.
LOG_INFO,
autoWatch:
true,
browsers: [
'Chrome'],
singleRun:
false
});
};
3.新建angular-cli.json，并写入如下内容
{
"project": {
"version":
"1.0.0",
"name":
"app name"
},
"apps": [
{
"root":
"src",
"outDir":
"dist",
"assets": [
"assets"
],
"index":
"index.html",
"main":
"./app/main.ts",
"polyfills":
"../src/libriary/testing/polyfills.ts",
"test":
"../src/libriary/testing/preprocessors.ts",
"tsconfig":
"../src/libriary/testing/tsconfig.spec.json",
"prefix":
"app",
"mobile":
false,
"styles": [
"styles.css"
],
"scripts": [
"../src/assets/lib/leaflet.js"],
"environmentSource":
"../src/libriary/testing/environments/environment.ts",
"environments": {
"dev":
"../src/libriary/testing/environments/environment.ts",
"prod":
"../src/libriary/testing/environments/environment.prod.ts"
}
}
],
"addons": [],
"packages": [],
"test": {
"karma": {
"config":
"./karma.conf.js"
}
},
"defaults": {
"styleExt":
"css",
"prefixInterfaces":
false,
"inline": {
"style":
false,
"template":
false
},
"spec": {
"class":
false,
"component":
true,
"directive":
true,
"module":
false,
"pipe":
true,
"service":
true
}
}
}
接下来是编写相关的文件，具体地址是
转载自 http://skyfly.xyz/2017/10/11/Front_End/ionic/how-to-settingup-unittest-for-ionic3x/