我正在尝试使用 Karma/Jasmine 改造现有的 Angular 6/Cordova 项目。我已经安装了所有先决条件和软件包并配置了所有软件包配置文件。我有 karma 测试运行程序,但现在我的 Karma 编译输出中出现了一堆类型依赖错误(见下文)。
我创建了一个简单的 .spec.ts 文件作为简单测试,以查看框架是否正常工作:
import { TestBed, fakeAsync, inject, tick } from "@angular/core/testing";
// import { Http, BaseRequestOptions, Response, ResponseOptions } from "@angular/http";
import {FeedbackService} from "../services";
import * as http from "http";
describe("FeedbackService", () => {
// let mockResponse, matchingHero, connection;
beforeEach(() => TestBed.configureTestingModule({
providers: [ FeedbackService],
}));
it("should return current language code", inject([FeedbackService], service => {
expect(service.getLanguageCode()).toContain("en-US");
}));
});
这是编译器输出:
> ng test --sourcemap=true
10% building modules 1/1 modules 0 active29 05 2018 16:44:07.646:WARN [karma]: No captured browser, open http://localhost:9876/
29 05 2018 16:44:07.655:INFO [karma]: Karma v2.0.2 server started at http://0.0.0.0:9876/
29 05 2018 16:44:07.656:INFO [launcher]: Launching browser Chrome with unlimited concurrency
29 05 2018 16:44:07.662:INFO [launcher]: Starting browser Chrome [../../../../../src/polyfills.ts] ./src/polyfills.ts 0 bytes {polyfills} [built]
[0] multi ./src/polyfills.ts 28 bytes {polyfills} [built]
[../../../../../src/test.ts] ./src/test.ts 0 bytes {main} [built]
ERROR in src/app/core/services/storage.service.ts(35,59): error TS2304: Cannot find name 'Entry'.
src/app/core/services/storage.service.ts(87,43): error TS2304: Cannot find name 'FileError'.
src/app/core/services/storage.service.ts(92,35): error TS2304: Cannot find name 'FileError'.
src/app/core/services/storage.service.ts(105,35): error TS2304: Cannot find name 'FileError'.
src/app/core/services/storage.service.ts(141,31): error TS2304: Cannot find name 'FileError'.
src/app/core/services/storage.service.ts(189,31): error TS2304: Cannot find name 'FileError'.
src/app/core/services/storage.service.ts(215,31): error TS2304: Cannot find name 'FileError'.
src/app/core/services/storage.service.ts(245,43): error TS2304: Cannot find name 'FileError'.
src/app/core/services/storage.service.ts(257,39): error TS2304: Cannot find name 'FileError'.
src/app/core/services/storage.service.ts(262,31): error TS2304: Cannot find name 'FileError'.
src/app/core/services/storage.service.ts(408,16): error TS2339: Property 'resolveLocalFileSystemURL' does not exist on type 'Window'.
src/app/core/services/storage.service.ts(408,62): error TS2304: Cannot find name 'FileEntry'.
src/app/core/services/storage.service.ts(411,18): error TS2304: Cannot find name 'FileError'.
src/app/core/services/storage.service.ts(428,23): error TS2339: Property 'resolveLocalFileSystemURL' does not exist on type 'Window'.
src/app/core/services/storage.service.ts(429,31): error TS2304: Cannot find name 'DirectoryEntry'.
src/app/core/services/storage.service.ts(431,41): error TS2304: Cannot find name 'FileEntry'.
src/app/core/services/storage.service.ts(433,49): error TS2304: Cannot find name 'FileWriter'.
src/app/core/services/storage.service.ts(476,33): error TS2304: Cannot find name 'FileEntry'.
src/app/core/services/storage.service.ts(497,16): error TS2339: Property 'resolveLocalFileSystemURL' does not exist on type 'Window'.
src/app/core/services/storage.service.ts(497,62): error TS2304: Cannot find name 'FileEntry'.
src/app/core/services/storage.service.ts(518,23): error TS2304: Cannot find name 'FileError'.
src/app/core/services/storage.service.ts(521,18): error TS2304: Cannot find name 'FileError'.
src/app/core/services/storage.service.ts(529,16): error TS2339: Property 'resolveLocalFileSystemURL' does not exist on type 'Window'.
src/app/core/services/storage.service.ts(529,61): error TS2304: Cannot find name 'DirectoryEntry'.
src/app/core/services/storage.service.ts(532,51): error TS2304: Cannot find name 'Entry'.
src/app/core/services/storage.service.ts(542,22): error TS2304: Cannot find name 'FileError'.
src/app/core/services/storage.service.ts(545,18): error TS2304: Cannot find name 'FileError'.
src/app/core/services/storage.service.ts(553,16): error TS2339: Property 'resolveLocalFileSystemURL' does not exist on type 'Window'.
src/app/core/services/storage.service.ts(553,62): error TS2304: Cannot find name 'FileEntry'.
src/app/core/services/storage.service.ts(559,23): error TS2304: Cannot find name 'FileError'.
src/app/core/services/storage.service.ts(562,18): error TS2304: Cannot find name 'FileError'.
src/app/core/services/storage.service.ts(615,16): error TS2339: Property 'resolveLocalFileSystemURL' does not exist on type 'Window'.
src/app/core/services/storage.service.ts(616,24): error TS2304: Cannot find name 'DirectoryEntry'.
src/app/core/services/storage.service.ts(620,19): error TS2304: Cannot find name 'FileError'.
src/app/core/services/storage.service.ts(627,36): error TS2339: Property 'resolveLocalFileSystemURL' does not exist on type 'Window'.
src/app/core/services/storage.service.ts(628,44): error TS2304: Cannot find name 'DirectoryEntry'.
src/app/core/services/storage.service.ts(631,52): error TS2304: Cannot find name 'DirectoryEntry'.
src/app/core/services/storage.service.ts(642,39): error TS2304: Cannot find name 'FileError'.
src/app/core/services/storage.service.ts(647,31): error TS2304: Cannot find name 'FileError'.
src/app/core/services/storage.service.ts(695,31): error TS2304: Cannot find name 'FileError'.
src/app/core/services/storage.service.ts(724,24): error TS2339: Property 'resolveLocalFileSystemURL' does not exist on type 'Window'.
这是我的 karma.config.js 文件:
// Karma configuration
// Generated on Fri May 25 2018 09:18:40 GMT-0700 (Pacific Daylight Time)
module.exports = function(config) {
config.set({
// base path that will be used to resolve all patterns (eg. files, exclude)
basePath: '',
// frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
frameworks: ['jasmine', '@angular/cli'],
plugins: [
require('karma-jasmine'),
require('karma-chrome-launcher'),
require('karma-jasmine-html-reporter'),
require('karma-coverage-istanbul-reporter'),
require('@angular/cli/plugins/karma'),
],
coverageIstanbulReporter: {
reports: [ 'html', 'lcovonly' ],
fixWebpackSourcePaths: true
},
angularCli: {
environment: 'dev'
},
// list of files / patterns to load in the browser
files: [
'src/app/**/*spec.ts',
],
// list of files / patterns to exclude
exclude: [
"./src/app/sandbox/*.ts",
"./src/app/core/containers/app-cordova.ts",
"./src/app/app-cordova.module.ts",
"./src/main-cordova.ts"
],
// preprocess matching files before serving them to the browser
// available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
preprocessors: {
'./src/test.ts': ['@angular/cli']
},
// test results reporter to use
// possible values: 'dots', 'progress'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
reporters: ['progress'],
// web server port
port: 9876,
// enable / disable colors in the output (reporters and logs)
colors: true,
// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
logLevel: config.LOG_INFO,
// enable / disable watching file and executing tests whenever any file changes
autoWatch: true,
// start these browsers
// available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
browsers: ['Chrome'],
// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: false,
// Concurrency level
// how many browser should be started simultaneous
concurrency: Infinity
})
}
这是我的 angular.cli.json 文件:
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"project": {
"name": "ngease"
},
"apps": [
{
"name": "web",
"root": "src",
"outDir": "dist",
"assets": [
"assets",
"favicon.ico"
],
"index": "index.html",
"main": "main.ts",
"polyfills": "polyfills.ts",
"test": "test.ts",
"tsconfig": "tsconfig.web.json",
"testTsconfig": "tsconfig.spec.json",
"prefix": "ease",
"styles": [
"styles/styles.scss"
],
"stylePreprocessorOptions": {
"includePaths": [
"styles"
]
},
"scripts": [],
"environmentSource": "environments/environment.ts",
"environments": {
"local": "environments/environment.ts",
"dev": "environments/environment.dev.ts",
"uat": "environments/environment.uat.ts",
"preprod": "environments/environment.preprod.ts",
"prod": "environments/environment.prod.ts"
}
},
{
"name": "mobile",
"root": "src",
"outDir": "www",
"assets": [
"assets",
"assets-cordova",
"favicon.ico"
],
"index": "index-cordova.html",
"main": "main-cordova.ts",
"polyfills": "polyfills.ts",
"test": "test.ts",
"tsconfig": "tsconfig.mobile.json",
"testTsconfig": "tsconfig.spec.json",
"prefix": "app",
"styles": [
"styles/styles.scss",
"styles-cordova/styles.scss"
],
"stylePreprocessorOptions": {
"includePaths": [
"styles"
]
},
"scripts": [],
"environmentSource": "environments/environment.ts",
"environments": {
"local": "environments/environment.ts",
"dev": "environments/environment.dev.ts",
"uat": "environments/environment.uat.ts",
"preprod": "environments/environment.preprod.ts",
"prod": "environments/environment.prod.ts"
}
}
],
"e2e": {
"protractor": {
"config": "./protractor.conf.js"
}
},
"lint": [
{
"project": "src/tsconfig.app.json",
"exclude": "**/node_modules/**"
},
{
"project": "src/tsconfig.spec.json",
"exclude": "**/node_modules/**"
},
{
"project": "e2e/tsconfig.e2e.json",
"exclude": "**/node_modules/**"
}
],
"test": {
"karma": {
"config": "./karma.conf.js"
}
},
"defaults": {
"styleExt": "scss",
"component": {}
}
}
测试.ts:
// This file is required by karma.conf.js and loads recursively all the .spec and framework files
import 'zone.js/dist/long-stack-trace-zone';
import 'zone.js/dist/proxy.js';
import 'zone.js/dist/sync-test';
import 'zone.js/dist/jasmine-patch';
import 'zone.js/dist/async-test';
import 'zone.js/dist/fake-async-test';
import { getTestBed } from '@angular/core/testing';
import {
BrowserDynamicTestingModule,
platformBrowserDynamicTesting
} from '@angular/platform-browser-dynamic/testing';
// Unfortunately there's no typing for the `__karma__` variable. Just declare it as any.
declare const __karma__: any;
declare const require: any;
// Prevent Karma from running prematurely.
__karma__.loaded = function () {};
// First, initialize the Angular testing environment.
getTestBed().initTestEnvironment(
BrowserDynamicTestingModule,
platformBrowserDynamicTesting()
);
// Then we find all the tests.
const context = require.context('./', true, /\.spec\.ts$/);
// And load the modules.
context.keys().map(context);
// Finally, start Karma to run the tests.
__karma__.start();
最后是我的 package.json:
{
"name": "ease-app",
"version": "1.23.0",
"scripts": {
"test": "ng test --sourcemap=true",
"start": "npm run ng:web:serve",
"ng:web:serve": "ng serve --app=web --env=local --port 8080",
"ng:web:build": "increase-memory-limit && ng build --app=web --env=prod --prod",
"ng:web:build:dev": "increase-memory-limit && ng build --app=web --env=dev --sourcemaps --build-optimizer=false",
"ng:web:build:uat": "increase-memory-limit && ng build --app=web --env=uat --prod",
"ng:web:build:preprod": "increase-memory-limit && ng build --app=web --env=preprod --prod",
"ng:mobile:build": "increase-memory-limit && ng build --app=mobile --env=prod --prod",
"ng:mobile:build:preprod": "increase-memory-limit && ng build --app=mobile --env=preprod --prod",
"ng:mobile:build:uat": "increase-memory-limit && ng build --app=mobile --env=uat --prod",
"ng:mobile:build:dev": "increase-memory-limit && ng build --app=mobile --env=dev --build-optimizer=false",
"ng:mobile:build:local": "increase-memory-limit && ng build --app=mobile --env=local --build-optimizer=false",
"cordova:ios:iphone5": "cordova run ios --debug --emulator --target=iPhone-5s",
"cordova:ios:iphone6": "cordova run ios --debug --emulator --target=iPhone-6",
"cordova:ios:iphone8+": "cordova run ios --debug --emulator --target=iPhone-8-Plus",
"cordova:ios:ipad": "cordova run ios --debug --emulator --target=iPad--5th-generation-"
},
"dependencies": {
"@angular/animations": "5.2.8",
"@angular/cdk": "^5.0.4",
"@angular/common": "5.2.8",
"@angular/compiler": "5.2.8",
"@angular/core": "5.2.8",
"@angular/flex-layout": "^5.0.0-beta.13",
"@angular/forms": "5.2.8",
"@angular/http": "5.2.8",
"@angular/material": "^5.0.4",
"@angular/platform-browser": "5.2.8",
"@angular/platform-browser-dynamic": "5.2.8",
"@angular/platform-server": "5.2.8",
"@angular/router": "5.2.8",
"@angular/upgrade": "^4.4.6",
"@ngrx/effects": "5.2.0",
"@ngrx/entity": "5.2.0",
"@ngrx/router-store": "5.2.0",
"@ngrx/store": "5.2.0",
"@ngrx/store-devtools": "5.2.0",
"angular-calendar": "^0.22.1",
"angular-gridster2": "^4.3.3",
"angular-in-memory-web-api": "^0.3.2",
"angular-tree-component": "^7.0.1",
"angular2-highcharts": "^0.5.5",
"angular2-moment": "^1.7.0",
"cordova-browser": "^5.0.3",
"cordova-ios": "^4.5.4",
"cordova-plugin-camera": "^4.0.3",
"cordova-plugin-compat": "^1.2.0",
"cordova-plugin-device": "^2.0.2",
"cordova-plugin-dialogs": "^2.0.1",
"cordova-plugin-file": "^6.0.1",
"cordova-plugin-file-transfer": "^1.7.1",
"cordova-plugin-splashscreen": "^5.0.2",
"cordova-plugin-whitelist": "^1.3.3",
"cordova-universal-links-plugin": "file:Library/cordova-universal-links-plugin",
"cordova-windows": "^5.0.0",
"core-js": "2.4.1",
"file-saver": "^1.3.3",
"font-awesome": "^4.7.0",
"highcharts": "^6.0.7",
"jquery": "^3.2.1",
"lodash": "^4.17.4",
"material-design-icons": "^3.0.1",
"moment": "^2.18.1",
"ng2-dragula": "^1.5.0",
"ng2-file-upload": "^1.2.1",
"ng2-translate": "^5.0.0",
"ng4-click-outside": "^1.0.1",
"ngx-bootstrap": "^2.0.0-rc.0",
"ngx-cookie": "^3.0.1",
"ngx-perfect-scrollbar": "^5.3.1",
"ngx-treeview": "^2.0.4",
"reflect-metadata": "^0.1.10",
"rxjs": "^5.5.6",
"url-polyfill": "^1.0.12",
"zone.js": "^0.8.4"
},
"devDependencies": {
"@angular/cli": "1.6.8",
"@angular/compiler-cli": "^5.0.0",
"@types/cordova": "0.0.34",
"@types/cordova-plugin-dialogs": "^1.3.2",
"@types/cordova-plugin-file": "^4.3.2",
"@types/core-js": "^0.9.44",
"@types/file-saver": "^1.3.0",
"@types/highcharts": "^5.0.15",
"@types/lodash": "^4.14.73",
"@types/node": "^9.3.0",
"@types/underscore": "^1.8.7",
"concurrently": "3.0.0",
"del-cli": "1.1.0",
"increase-memory-limit": "^1.0.6",
"jasmine-core": "^3.1.0",
"karma": "^2.0.2",
"karma-chrome-launcher": "^2.2.0",
"karma-coverage-istanbul-reporter": "^2.0.1",
"karma-jasmine": "^1.1.2",
"karma-jasmine-html-reporter": "^1.1.0",
"lite-server": "2.2.2",
"ngrx-store-freeze": "^0.2.1",
"tslint": "^5.8.0",
"typescript": "~2.4.2",
"@types/jasmine": "~2.8.0",
"@types/jasminewd2": "^2.0.3",
"jasmine-spec-reporter": "^4.2.1",
"karma-cli": "^1.0.1",
"karma-phantomjs-launcher": "^1.0.2",
"phantomjs-prebuilt": "^2.1.7",
"protractor": "~5.1.0",
"ts-node": "^3.3.0"
},
"cordova": {
"platforms": [
"browser",
"windows",
"ios"
],
"plugins": {
"cordova-plugin-device": {},
"cordova-plugin-whitelist": {},
"cordova-plugin-file": {},
"cordova-plugin-compat": {},
"cordova-plugin-file-transfer": {},
"cordova-plugin-dialogs": {},
"cordova-plugin-splashscreen": {},
"cordova-plugin-camera": {
"CAMERA_USAGE_DESCRIPTION": "Upload pictures to your audit.",
"PHOTOLIBRARY_USAGE_DESCRIPTION": "uses photos"
},
"cordova-universal-links-plugin": {}
}
},
"-vs-binding": {
"BeforeBuild": [
"build:appdebug",
"notify:readyforcordovaprepare"
],
"Clean": [
"clean"
],
"ProjectOpened": [
"update"
]
}
}
非常感谢我为什么仍然收到这些错误的任何想法!