Karma-Jasmine为Angular项目设置

Question

我有一个角度（目前是@ 4.0.0）项目，我想用Karma和Jasmine引入单元测试。

我已设置了相应的spec-bundle.js，package.json和npm test。但是当我运行spec时，这就是控制台上的内容。测试脚本似乎没有得到识别和运行。

这些是控制台上的警告，

我有一个app.ts文件，其中包含import { async, TestBed, ComponentFixture } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { DebugElement } from '@angular/core'; import { App } from './app'; import { AuthorizationService } from '../service/security/authorizationService'; describe('App (templateUrl)', () => { let comp: App; let fixture: ComponentFixture<App>; let de: DebugElement; let el: HTMLElement; beforeEach(async(() => { TestBed.configureTestingModule({ declarations: [App] }) .compileComponents(); })); beforeEach(() => { fixture = TestBed.createComponent(App); comp = fixture.componentInstance; }); it('should display app title', () => { fixture.detectChanges(); expect(comp.appTitle).toContain('Angular'); }); }); 的简单测试。

"scripts": {
"rimraf": "rimraf",
"tslint": "tslint",
"typedoc": "typedoc",
"typings": "typings",
"webpack": "webpack",
"webpack-dev-server": "webpack-dev-server",
"webdriver-manager": "webdriver-manager",
"protractor": "protractor",
"clean": "npm cache clean && npm run rimraf -- node_modules doc typings coverage dist",
"clean:dist": "npm run rimraf -- dist",
"preclean:install": "npm run clean",
"clean:install": "npm set progress=false && npm install",
"preclean:start": "npm run clean",
"clean:start": "npm start",
"watch": "npm run watch:local",
"watch:dev": "npm run build:dev -- --watch",
"watch:local": "npm run build:local -- --watch",
"watch:dev:hmr": "npm run watch:dev -- --hot",
"watch:test": "npm run test -- --auto-watch --no-single-run",
"watch:uat": "npm run uat -- --auto-watch --no-single-run",
"watch:prod": "npm run build:prod -- --watch",
"build": "npm run build:local",
"prebuild:dev": "npm run clean:dist",
"build:dev": "webpack --config config/webpack.dev.js --progress --profile --colors --display-error-details --display-cached",
"build:local": "webpack --config config/webpack.local.js --progress --profile --colors --display-error-details --display-cached",
"build:devplus": "webpack --config config/webpack.devplus.js --progress --profile --colors --display-error-details --display-cached",
"build:test": "webpack --config config/webpack.test.js --progress --profile --colors --display-error-details --display-cached --bail",
"build:uat": "webpack --config config/webpack.uat.js --progress --profile --colors --display-error-details --display-cached --bail",
"prebuild:prod": "npm run clean:dist",
"build:prod": "webpack --config config/webpack.prod.js --progress --profile --colors --display-error-details --display-cached --bail",
"server": "npm run server:dev",
"server:dev": "webpack-dev-server --config config/webpack.dev.js --inline --progress --profile --colors --watch --display-error-details --display-cached --content-base src/",
"server:local": "webpack-dev-server --config config/webpack.local.js --inline --progress --profile --colors --watch --display-error-details --display-cached --content-base src/",
"server:dev:hmr": "npm run server:dev -- --hot",
"server:prod": "http-server dist --cors",
"webdriver:update": "npm run webdriver-manager update",
"webdriver:start": "npm run webdriver-manager start",
"lint": "npm run tslint 'src/**/*.ts'",
"pree2e": "npm run webdriver:update -- --standalone",
"e2e": "npm run protractor",
"e2e:live": "npm run e2e -- --elementExplorer",
"pretest": "npm run lint",
"test": "karma start config/karma.conf.js",
"ci": "npm run e2e && npm run test",
"docs": "npm run typedoc -- --options typedoc.json --exclude '**/*.spec.ts' ./src/",
"start": "npm run server:local",
"start:hmr": "npm run server:dev:hmr",
"postinstall": "npm run typings -- install",
"preversion": "npm test",
"version": "npm run build",
"postversion": "git push && git push --tags"
},

"dependencies": {
"@angular/common": "4.0.0",
"@angular/compiler": "4.0.0",
"@angular/core": "4.0.0",
"@angular/forms": "4.0.0",
"@angular/http": "4.0.0",
"@angular/platform-browser": "4.0.0",
"@angular/platform-browser-dynamic": "4.0.0",
"@angular/router": "4.0.0",
"@angular/router-deprecated": "2.0.0-rc.2",
"@angular/upgrade": "4.0.0",
"angular2-toaster": "1.0.1",
"core-js": "^2.4.1",
"css-loader": "0.23.1",
"fullcalendar": "^2.7.1",
"hammerjs": "^2.0.8",
"intl": "1.2.4",
"jquery": "2.2.2",
"jquery-ui": "1.10.5",
"lodash": "^4.17.4",
"ng2-auto-complete": "^0.7.0",
"ng2-cookies": "^0.1.5",
"ng2-file-upload": "^1.0.0-beta.1",
"node-sass": "^3.8.0",
"normalize.css": "^4.1.1",
"path-to-regexp": "^1.5.3",
"postcss": "^5.0.19",
"postcss-loader": "^0.8.2",
"primeng": "1.0.0-beta.15",
"primeui": "4.1.10",
"resolve-url-loader": "^1.6.0",
"rxjs": "^5.0.1",
"sass-loader": "^3.2.3",
"style-loader": "^0.13.1",
"tether": "^1.2.0",
"url-loader": "^0.5.7",
"zone.js": "^0.8.4"
},
  "devDependencies": {
    "angular2-hmr": "~0.5.5",
    "awesome-typescript-loader": "~0.17.0",
    "babel-core": "^6.18.2",
    "babel-loader": "^6.2.8",
    "babel-plugin-transform-es2015-modules-commonjs-simple": "^6.7.0",
    "babel-preset-es2015": "^6.1.18",
    "babel-preset-es2015-webpack": "^6.4.0",
    "bootstrap": "4.0.0-alpha.2",
    "bootstrap-loader": "1.0.10",
    "codelyzer": "0.0.15",
    "compression-webpack-plugin": "^0.3.1",
    "copy-webpack-plugin": "^2.1.3",
    "css-loader": "^0.23.1",
    "es6-promise": "^3.1.2",
    "es6-promise-loader": "^1.0.1",
    "es6-shim": "^0.35.0",
    "exports-loader": "^0.6.3",
    "expose-loader": "^0.7.1",
    "extract-text-webpack-plugin": "^1.0.1",
    "file-loader": "^0.8.5",
    "html-webpack-plugin": "^2.15.0",
    "http-server": "^0.9.0",
    "imports-loader": "^0.6.5",
    "istanbul-instrumenter-loader": "^0.2.0",
    "jasmine-core": "^2.6.2",
    "json-loader": "^0.5.4",
    "karma": "^1.6.0",
    "karma-chrome-launcher": "^0.2.3",
    "karma-coverage": "^0.5.5",
    "karma-jasmine": "^0.3.8",
    "karma-mocha-reporter": "^2.0.0",
    "karma-phantomjs-launcher": "^1.0.0",
    "karma-sourcemap-loader": "^0.3.7",
    "karma-webpack": "1.7.0",
    "lodash": "^4.6.1",
    "moment": "^2.11.2",
    "node-sass": "3.7.0",
    "npmconf": "2.1.2",
    "parse5": "^2.1.5",
    "phantomjs-polyfill": "0.0.2",
    "phantomjs-prebuilt": "^2.1.7",
    "protractor": "^3.2.2",
    "raw-loader": "0.5.1",
    "reflect-metadata": "^0.1.3",
    "remap-istanbul": "^0.6.3",
    "resolve-url-loader": "^1.4.3",
    "rimraf": "^2.5.2",
    "sass-loader": "^3.2.0",
    "source-map-loader": "^0.1.5",
    "style-loader": "^0.13.1",
    "ts-helpers": "1.1.1",
    "ts-node": "^0.7.1",
    "tslint": "^3.7.1",
    "tslint-loader": "^2.1.3",
    "typedoc": "^0.3.12",
    "typescript": "2.0.3",
    "typings": "^1.5.0",
    "url-loader": "^0.5.7",
    "webpack": "^1.12.14",
    "webpack-dev-server": "^1.14.1",
    "webpack-load-plugins": "^0.1.2",
    "webpack-md5-hash": "^0.0.5",
    "webpack-merge": "^0.12.0",
    "webpack-validator": "^1.0.0-beta.4"
  },
  "repository": {
    "type": "git",
    "url": "https://github.com/angularclass/angular2-webpack-starter.git"
  },
  "bugs": {
    "url": "https://github.com/angularclass/angular2-webpack-starter/issues"
  },
  "engines": {
    "node": ">= 4.2.1",
    "npm": ">= 3"
  }
}

的package.json：

module.exports = function(config) {

var testWebpackConfig = require('./webpack.test.js');

  config.set({
    basePath: '',
    frameworks: ['jasmine'],
    exclude: [ ],

files: [ { pattern: 'spec-bundle.js', watched: false } ],

preprocessors: { 'spec-bundle.js': ['coverage', 'webpack', 'sourcemap'] },

webpack: testWebpackConfig,

coverageReporter: {
  dir : 'coverage/',
  reporters: [
    { type: 'text-summary' },
    { type: 'json' },
    { type: 'html' }
  ]
},
webpackServer: { noInfo: true },

reporters: [ 'mocha', 'coverage' ],
port: 9876,

colors: true,
logLevel: config.LOG_INFO,

autoWatch: true,

browsers: [
  'Chrome'
],
singleRun: true

 });

};

karma.conf.js：

Error.stackTraceLimit = Infinity;

require('core-js/es6');
require('core-js/es7/reflect');

require('zone.js/dist/zone');
require('zone.js/dist/long-stack-trace-zone');
require('zone.js/dist/proxy'); // since zone.js 0.6.15
require('zone.js/dist/sync-test');
require('zone.js/dist/jasmine-patch'); // put here since zone.js 0.6.14
require('zone.js/dist/async-test');
require('zone.js/dist/fake-async-test');
require('rxjs/Rx');

var testing = require('@angular/core/testing');
var browser = require('@angular/platform-browser-dynamic/testing');

testing.TestBed.initTestEnvironment(
  browser.BrowserDynamicTestingModule,
  browser.platformBrowserDynamicTesting()
);

var testContext = require.context('../src', true, /\.spec\.ts/);

function requireAll(requireContext) {
  return requireContext.keys().map(requireContext);
}

var modules = requireAll(testContext);

SPEC-bundle.js：

    scala> def sum(a:Int)(b:Int) = a+b;
    sum: (a: Int)(b: Int)Int

    scala> var psum = sum(5)_
    psum: Int => Int = $$Lambda$1035/814753967@724c5cbe

    scala> psum(23)
    res0: Int = 28