Unit testing Angular2 Cli测试(网页包)错误:“;错误:模板分析错误“;
这是我的AppModule:Unit testing Angular2 Cli测试(网页包)错误:“;错误:模板分析错误“;,unit-testing,angular,webpack,Unit Testing,Angular,Webpack,这是我的AppModule: import { BrowserModule } from '@angular/platform-browser'; import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { HttpModule } from '@angular/http'; import { AppCompone
import { BrowserModule } from '@angular/platform-browser';
import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { AppComponent } from './app.component';
import { CitiesComponent } from './cities/cities.component';
@NgModule({
declarations: [
AppComponent,
CitiesComponent
],
imports: [
BrowserModule,
FormsModule,
HttpModule,
],
providers: [],
bootstrap: [AppComponent],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class AppModule { }
CitiesComponent
是一个非常简单的模块。
我在AppComponent
中使用组件
应用程序构建和工作没有任何错误;但当我执行ng测试时
失败并出现错误:
Error: Template parse errors:
'app-cities' is not a known element:
1. If 'app-cities' is an Angular component, then verify that it is part of this module.
2. If 'app-cities' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schema' of this component to suppress this message. ("<main> <h1>Hello from Angular 2 App with Webpack</h1> <div class="ui segment raised"> Hello </div> [ERROR ->]<app-cities></app-cities> </main> "): AppComponent@0:99 in config/karma-test-shim.js (line 181)
parse@webpack:///~/@angular/compiler/bundles/compiler.umd.js:8813:0 <- config/karma-test-shim.js:181:50110
_compileTemplate@webpack:///~/@angular/compiler/bundles/compiler.umd.js:16978:0 <- config/karma-test-shim.js:186:8984
webpack:///~/@angular/compiler/bundles/compiler.umd.js:17065:0 <- config/karma-test-shim.js:186:10862
forEach@webpack:///~/core-js/modules/_typed-array.js:467:0 <- config/karma-test-shim.js:2:50965
s@webpack:///~/@angular/compiler/bundles/compiler.umd.js:17061:62 <- config/karma-test-shim.js:186:10831
_compileComponents@webpack:///~/@angular/compiler/bundles/compiler.umd.js:16887:0 <- config/karma-test-shim.js:186:6610
_compileModuleAndAllComponents@webpack:///~/@angular/compiler/bundles/compiler.umd.js:16828:37 <- config/karma-test-shim.js:186:4786
compileModuleAndAllComponentsSync@webpack:///~/@angular/compiler/bundles/compiler.umd.js:16804:0 <- config/karma-test-shim.js:186:4350
compileModuleAndAllComponentsSync@webpack:///~/@angular/compiler/bundles/compiler.umd.js:1:0 <- config/karma-test-shim.js:150:24366
_initIfNeeded@webpack:///~/@angular/core/bundles/core.umd.js:1:0 <- config/karma-test-shim.js:78:22512
createComponent@webpack:///~/@angular/core/bundles/core.umd.js:1:0 <- config/karma-test-shim.js:78:25044
createComponent@webpack:///~/@angular/core/bundles/core.umd.js:1:0 <- config/karma-test-shim.js:78:20648
webpack:///~/@angular/core/bundles/core-testing.umd.js:1:0 <- config/karma-test-shim.js:66:10991
invoke@webpack:///config/karma-test-shim.js:8711:32 <- config/karma-test-shim.js:24:40262
onInvoke@webpack:///~/zone.js/dist/proxy.js:75:0 <- config/karma-test-shim.js:38:1630
invoke@webpack:///config/karma-test-shim.js:8711:32 <- config/karma-test-shim.js:24:40216
run@webpack:///config/karma-test-shim.js:8711:32 <- config/karma-test-shim.js:24:34612
webpack:///~/zone.js/dist/jasmine-patch.js:28:0 <- config/karma-test-shim.js:52:655
execute@webpack:///config/karma-test-shim.js:9163:32 <- config/karma-test-shim.js:52:3370
execute@webpack:///config/karma-test-shim.js:9163:32 <- config/karma-test-shim.js:52:3370
webpack:///config/karma-test-shim.js:9163:32 <- config/karma-test-shim.js:52:3480
invokeTask@webpack:///config/karma-test-shim.js:8711:32 <- config/karma-test-shim.js:24:40940
runTask@webpack:///config/karma-test-shim.js:8711:32 <- config/karma-test-shim.js:24:35224
drainMicroTaskQueue@webpack:///~/zone.js/dist/zone.js:584:0 <- config/karma-test-shim.js:24:19813
s@webpack:///~/core-js/modules/_typed.js:25:0 <- config/karma-test-shim.js:2:22237
webpack:///~/core-js/modules/_typed-buffer.js:12:0 <- config/karma-test-shim.js:2:22359
u@webpack:///~/core-js/modules/_microtask.js:18:0 <- config/karma-test-shim.js:2:15867
错误:模板分析错误:
“应用程序城市”不是已知元素:
1.如果“app cities”是一个角度组件,则验证它是否是此模块的一部分。
2.如果“app cities”是一个Web组件,则将“CUSTOM_ELEMENTS_SCHEMA”添加到此组件的“@NgModule.SCHEMA”以抑制此消息。(“来自Angular 2应用程序的Hello,带有网页Hello[ERROR->]):AppComponent@0:99在config/karma-test-shim.js(第181行)中
parse@webpack://~/@angular/compiler/bundles/compiler.umd.js:8813:0您忘了将CitieComponent添加到TestModule,下面是我的一个测试示例
import {
ComponentFixture, TestBed, inject, async
} from '@angular/core/testing';
import { DebugElement } from '@angular/core';
import { By } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { RouterModule, RouterOutletMap } from '@angular/router';
let comp: AppComponent;
let fixture: ComponentFixture<AppComponent>;
let el: DebugElement;
describe('AppComponent', () => {
beforeEach(() => {
TestBed.configureTestingModule({
declarations: [AppComponent], // declare the test component
});
fixture = TestBed.createComponent(AppComponent);
comp = fixture.componentInstance; // AppComponent test instance
it('should instantiate the component', () => {
expect(fixture.debugElement).toBeDefined();
});
});
});
导入{
ComponentFixture,测试床,注入,异步
}来自“角度/核心/测试”;
从“@angular/core”导入{DebugElement};
从“@angular/platform browser”导入{By}”;
从“./app.component”导入{AppComponent};
从'@angular/router'导入{RouterModule,RouterOutletMap};
让comp:AppComponent;
let夹具:组件夹具;
设el:DebugElement;
描述('AppComponent',()=>{
在每个之前(()=>{
TestBed.configureTestingModule({
声明:[AppComponent],//声明测试组件
});
fixture=TestBed.createComponent(AppComponent);
comp=fixture.componentInstance;//AppComponent测试实例
它('应该实例化组件',()=>{
expect(fixture.debugElement).toBeDefined();
});
});
});
在TestBed.configureTestingModule
行中,您希望再次声明CitiesComponent,因为您正在测试的模块与实际模块不同。在您的app.component.spec.ts
中,您应该为CitiesComponent
声明:
import { TestBed, async } from '@angular/core/testing';
import { AppComponent } from './app.component';
import { CitiesComponent } from './cities/cities.component';
describe('AppComponent', () => {
beforeEach(() => {
TestBed.configureTestingModule({
declarations: [
AppComponent,
CitiesComponent // => add to here
],
});
TestBed.compileComponents();
});
//
});
你能公布你的测试结果吗。