我想为我的角度应用程序整合茉莉和业力..我已经完成了所有的配置,就像我在下面提到的那样 . 但是当我运行npm run test(“karma start karma.conf.js)”时,它显示如下所示的错误
-toastr/ng2-toastr.js (socket hang up)
[1] 08 03 2018 15:27:43.396:WARN [proxy]: failed to proxy /base/node_modules/ng2
-toastr/ng2-toastr.js (socket hang up)
[1] Chrome 64.0.3282 (Windows 7.0.0) ERROR
[1] {
[1] "originalErr": {}
[1] }
[1]
[1] Chrome 64.0.3282 (Windows 7.0.0) ERROR
[1] {
[1] "originalErr": {}
[1] }
[1]
任何人都可以帮我这个...
app结构
app
app.component.ts
spec
app.component.spec.ts
main.ts
node_modules
karma.conf.js
karma-test-shim.js
systemjs.config.js
tsconfig.js
app.component.ts = --------------
import { Component,ViewContainerRef,OnInit } from '@angular/core';
import { ToastService } from './services/ToastService';
import { ToastsManager } from 'ng2-toastr/ng2-toastr';
@Component({
selector: 'my-app',
template: `<h1>hjii</h1>`
})
export class AppComponent {
name = "app component"
public _toastr: ToastsManager;
public _toastService:ToastService;
public _vcr: ViewContainerRef;
public constructor(public vcr: ViewContainerRef, public toastr: ToastsManager, public toastService:ToastService ){
this._vcr=vcr;
this._toastr=toastr;
this._toastService=toastService;
}
public ngOnInit():void {
this.init();
}
init():void{
this._toastService.setToast(this._vcr,this._toastr);
}
}
app.component.spec.ts
import { AppComponent } from '../app.component';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { By } from '@angular/platform-browser';
import { DebugElement } from '@angular/core';
describe('AppComponent', function () {
let de: DebugElement;
let comp: AppComponent;
let fixture: ComponentFixture<AppComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ AppComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(AppComponent);
comp = fixture.componentInstance;
de = fixture.debugElement.query(By.css('h1'));
});
it('should create component', () => expect(comp).toBeDefined() );
it('should have expected <h1> text', () => {
fixture.detectChanges();
const h1 = de.nativeElement;
expect(h1.innerText).toMatch(/angular/i,
'<h1> should say something about "Angular"');
});
});
main.ts
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app.module';
import {enableProdMode} from '@angular/core';
platformBrowserDynamic().bootstrapModule(AppModule);
karma.conf.js
module.exports = function(config) {
var appBase = 'app/'; // transpiled app JS and map files
var appSrcBase = appBase; // app source TS files
// Testing helpers (optional) are conventionally in a folder called `testing`
var testingBase = 'testing/'; // transpiled test JS and map files
var testingSrcBase = 'testing/'; // test source TS files
config.set({
basePath: '',
frameworks: ['jasmine'],
plugins: [
require('karma-jasmine'),
require('karma-chrome-launcher'),
require('karma-jasmine-html-reporter')
],
client: {
builtPaths: [appBase, testingBase], // add more spec base paths as needed
clearContext: false // leave Jasmine Spec Runner output visible in browser
},
customLaunchers: {
// From the CLI. Not used here but interesting
// chrome setup for travis CI using chromium
Chrome_travis_ci: {
base: 'Chrome',
flags: ['--no-sandbox']
}
},
files: [
// System.js for module loading
'node_modules/systemjs/dist/system.src.js',
// Polyfills
'node_modules/core-js/client/shim.js',
// zone.js
'node_modules/zone.js/dist/zone.js',
'node_modules/zone.js/dist/long-stack-trace-zone.js',
'node_modules/zone.js/dist/proxy.js',
'node_modules/zone.js/dist/sync-test.js',
'node_modules/zone.js/dist/jasmine-patch.js',
'node_modules/zone.js/dist/async-test.js',
'node_modules/zone.js/dist/fake-async-test.js',
// RxJs
{ pattern: 'node_modules/rxjs/**/*.js', included: false, watched: false },
{ pattern: 'node_modules/rxjs/**/*.js.map', included: false, watched: false },
// Paths loaded via module imports:
// Angular itself
{ pattern: 'node_modules/@angular/**/*.js', included: false, watched: false },
{ pattern: 'node_modules/@angular/**/*.js.map', included: false, watched: false },
{ pattern: 'systemjs.config.js', included: false, watched: false },
'karma-test-shim.js', // optionally extend SystemJS mapping e.g., with barrels
{ pattern: 'systemjs.config.extras.js', included: false, watched: false },
// transpiled application & spec code paths loaded via module imports
{ pattern: appBase + '**/*.js', included: false, watched: true },
{ pattern: testingBase + '**/*.js', included: false, watched: true },
// Asset (HTML & CSS) paths loaded via Angular's component compiler
// (these paths need to be rewritten, see proxies section)
{ pattern: appBase + '/*.html', included: false, watched: true },
{ pattern: appBase + '/*.css', included: false, watched: true },
// Paths for debugging with source maps in dev tools
{ pattern: appBase + '/*.ts', included: false, watched: false },
{ pattern: appBase + '/*.js.map', included: false, watched: false },
{ pattern: testingSrcBase + '/*.ts', included: false, watched: false },
{ pattern: testingBase + '/*.js.map', included: false, watched: false}
],
// Proxied base paths for loading assets
proxies: {
// required for modules fetched by SystemJS
'/base/node_modules/': '/base/node_modules/'
},
exclude: [],
preprocessors: {},
reporters: ['progress' , 'kjhtml'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
singleRun: false
})
}
karma-test-shim.js
// /*global jasmine, __karma__, window*/
Error.stackTraceLimit = 0; // "No stacktrace"" is usually best for app testing.
// Uncomment to get full stacktrace output. Sometimes helpful, usually not.
// Error.stackTraceLimit = Infinity; //
jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000;
// builtPaths: root paths for output ("built") files
// get from karma.config.js, then prefix with '/base/' (default is 'src/')
var builtPaths = (__karma__.config.builtPaths || [''])
.map(function(p) { return '/base/'+p;});
__karma__.loaded = function () { };
function isJsFile(path) {
return path.slice(-3) == '.js';
}
function isSpecFile(path) {
return /\.spec\.(.*\.)?js$/.test(path);
}
// Is a "built" file if is JavaScript file in one of the "built" folders
function isBuiltFile(path) {
return isJsFile(path) &&
builtPaths.reduce(function(keep, bp) {
return keep || (path.substr(0, bp.length) === bp);
}, false);
}
var allSpecFiles = Object.keys(window.__karma__.files)
.filter(isSpecFile)
.filter(isBuiltFile);
System.config({
// Base URL for System.js calls. 'base/' is where Karma serves files from.
baseURL: 'base/',
// Extend usual application package list with test folder
packages: { 'testing': { main: 'index.js', defaultExtension: 'js' } },
// Assume npm: is set in `paths` in systemjs.config
// Map the angular testing umd bundles
map: {
'@angular/core/testing': 'npm:@angular/core/bundles/core-testing.umd.js',
'@angular/common/testing': 'npm:@angular/common/bundles/common-testing.umd.js',
'@angular/compiler/testing': 'npm:@angular/compiler/bundles/compiler-testing.umd.js',
'@angular/platform-browser/testing': 'npm:@angular/platform-browser/bundles/platform-browser-testing.umd.js',
'@angular/platform-browser-dynamic/testing': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic-testing.umd.js',
'@angular/http/testing': 'npm:@angular/http/bundles/http-testing.umd.js',
'@angular/router/testing': 'npm:@angular/router/bundles/router-testing.umd.js',
'@angular/forms/testing': 'npm:@angular/forms/bundles/forms-testing.umd.js',
},
});
System.import('systemjs.config.js')
.then(initTestBed)
.then(initTesting);
/** Optional SystemJS configuration extras. Keep going w/o it */
// function importSystemJsExtras(){
// return System.import('systemjs.config.extras.js')
// .catch(function(reason) {
// console.log(
// 'Warning: System.import could not load the optional
"systemjs.config.extras.js". Did you omit it by accident? Continuing without it.'
// );
// console.log(reason);
// });
// }
function initTestBed(){
return Promise.all([
System.import('@angular/core/testing'),
System.import('@angular/platform-browser-dynamic/testing')
])
.then(function (providers) {
var coreTesting = providers[0];
var browserTesting = providers[1];
coreTesting.TestBed.initTestEnvironment(
browserTesting.BrowserDynamicTestingModule,
browserTesting.platformBrowserDynamicTesting());
})
}
// Import all spec files and start karma
function initTesting () {
return Promise.all(
allSpecFiles.map(function (moduleName) {
return System.import(moduleName);
})
)
.then(__karma__.start, __karma__.error);
}
systemjs.config.js
/**
* System configuration for Angular 2 samples
* Adjust as necessary for your application needs.
*/
(function(global) {
// map tells the System loader where to look for things
var map = {
'app': 'app', // 'dist',
'@angular': 'node_modules/@angular',
'@amcharts/amcharts3-angular': 'node_modules/@amcharts/amcharts3-angular/umd/index.js',
'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api',
'ng2-toastr':'node_modules/ng2-toastr',
'rxjs': 'node_modules/rxjs',
'@ng-bootstrap/ng-bootstrap': 'node_modules/ng-bootstrap/bundles/ng-bootstrap.js',
'ng-sidebar': 'node_modules/ng-sidebar',
'ng2-drag-drop': 'node_modules/ng2-drag-drop',
'@ngx-translate/core': 'node_modules/@ngx-translate/core/bundles',
'@ngx-translate/http-loader':'node_modules/@ngx-translate/http-loader/bundles',
'angular2-multiselect-dropdown': 'node_modules/angular2-multiselect-dropdown/index.umd.js',
'object-path':'node_modules/object-path/index.js'
};
// packages tells the System loader how to load when no filename and/or no extension
var packages = {
'app': { main: 'main.js', defaultExtension: 'js' },
'rxjs': { defaultExtension: 'js' },
'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' },
'ng2-toastr':{main: 'ng2-toastr.js',defaultExtension: 'js'},
'ng-sidebar': {main: 'lib/index',defaultExtension: 'js' },
'ng2-drag-drop': { main: 'index.js', defaultExtension: 'js' },
'@ngx-translate/core' : { main: 'core.umd.js', defaultExtension: 'js' },
'@ngx-translate/http-loader' : { main: 'http-loader.umd.js', defaultExtension: 'js' }
};
var ngPackageNames = [
'common',
'compiler',
'core',
'forms',
'http',
'platform-browser',
'platform-browser-dynamic',
'router',
'router-deprecated',
'upgrade'
];
// Individual files (~300 requests):
function packIndex(pkgName) {
packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' };
}
// Bundled (~40 requests):
function packUmd(pkgName) {
packages['@angular/'+pkgName] = { main: '/bundles/' + pkgName + '.umd.js', defaultExtension: 'js' };
}
// Most environments should use UMD; some (Karma) need the individual index files
var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;
// Add package entries for angular packages
ngPackageNames.forEach(setPackageConfig);
var config = {
paths: { 'npm:': 'node_modules/' , underscore: './node_modules/underscore/underscore.js', objectpath:'./node_modules/object-path/index.js', objectDiff:'./app/js/objectDiff.js'},
rxjs: {
defaultExtension: 'js'
},
map: map,
packages: packages
};
System.config(config);
})(this);
tsconfig.js
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true ,
"lib": ["dom", "es2015" ]
// "removeComments": true,
// "noImplicitAny": false,
// "outDir": "dist",
// "sourceMap": true,
// "pretty": true
},
"exclude": [
"node_modules"
],"types": [
"underscore"
],
"awesomeTypescriptLoaderOptions": {
"forkChecker": true
},
"compileOnSave": true,
"buildOnSave": true,
"atom": { "rewriteTsconfig": false }
}