我在Angular 2.0.0中遇到了TestBed的问题
beforeEach( async(() => {
TestBed.configureTestingModule({
declarations: [
SomethingComponent
]
}).compileComponents(); // compile template
}));
beforeEach(() => {
fixture = TestBed.createComponent(SomethingComponent);
comp = fixture.componentInstance;
});
it('test',async(() => {
fixture.detectChanges();
expect(true)
}));
给定组件：
@Component({
templateUrl: 'app/components/something/something.component.html'
})
我收到错误：
Firefox 48.0.0 (Mac OS X 10.11.0) Failed: Uncaught (in promise): Failed to load app/components/something/something.component.html resolvePromise@node_modules/zone.js/dist/zone.js:429:31 resolvePromise@node_modules/zone.js/dist/zone.js:414:17 scheduleResolveOrReject/<@node_modules/zone.js/dist/zone.js:462:17 ZoneDelegate.prototype.invokeTask@node_modules/zone.js/dist/zone.js:236:23 ProxyZoneSpec.prototype.onInvokeTask@node_modules/zone.js/dist/proxy.js:96:20 ZoneDelegate.prototype.invokeTask@node_modules/zone.js/dist/zone.js:235:23 Zone.prototype.runTask@node_modules/zone.js/dist/zone.js:136:28 drainMicroTaskQueue@node_modules/zone.js/dist/zone.js:368:25 ZoneTask/this.invoke@node_modules/zone.js/dist/zone.js:308:25
我想这可能是因为配置没有正确设置.我正在使用gulp将TypeScript预编译为JavaScript,我有以下项目结构：
|_ grails-app
|_ frontend
|_ angular
|_ app
| |_ components
| | |_ something
| | |_ something.component.ts
| | |_ something.component.html
| |_ model
| |_ test
| |_ app.module.ts
| |_ app.routing.ts
| |_ main.ts
|_ assets
|_ build
| |_ app
| |_ components
| | |_ something
| | |_ something.component.html
| | |_ something.component.js
| | |_ something.component.js.map
| |_
| |_
| |
|_ node_modules
|_ gulpfile.js
|_ karma.conf.js
|_ karma-test-shim.js
|_ systemjs.config
|_
|_
|
但是,如果我假设html文件是预编译的,并从测试中删除命令.compileComponents(),我会收到以下错误：
Firefox 48.0.0 (Mac OS X 10.11.0) Error: Cannot create the component SomethingComponent as it was not imported into the testing module!
Firefox 48.0.0 (Mac OS X 10.11.0) Error: This test module uses the component SomethingComponent which is using a "templateUrl",but they were never compiled. Please call "TestBed.compileComponents" before your test.
在karma-test-shim.js中,我有：
System.config({
baseURL: '/base/',paths: {
// paths serve as alias
'npm:': 'node_modules/'
},map: {
'app': '/base/build/app/','@angular/core': 'npm:@angular/core/bundles/core.umd.js','@angular/common': 'npm:@angular/common/bundles/common.umd.js','@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js','@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js','@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js','@angular/http': 'npm:@angular/http/bundles/http.umd.js','@angular/router': 'npm:@angular/router/bundles/router.umd.js','@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',// angular testing umd bundles
'@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',// other libraries
'rxjs': 'npm:rxjs'
},packages: {
'app': {
defaultExtension: 'js'
},'rxjs': {
defaultExtension: 'js'
}
}
});
我希望有人可以帮我弄明白,我在配置上做错了什么.
解决方法
您可以将基本路径i karma.conf.js定义为代理：
// Proxied base paths for loading assets
proxies: {
// required for component assets fetched by Angular's compiler
"/app/": '/base/build/app/'
},
