我的app.component有一个名为' environment'这是通过使用http服务设置的,下面是组件
app.component.ts
//import ..
@Component({
selector: 'my-app',
template: require('./app.component.html')
})
export class AppComponent {
myEnvironment: String;
workbenchBaseUrl : String = 'workbenchBaseUrl';
constructor(private _propertyService : PropertyService){
}
ngOnInit(): void {
this._propertyService.getValue(this.workbenchBaseUrl)
.subscribe(environment => this.myEnvironment = environment,
error => this.errorMessage = <any>error);
}
}
属性服务是一种异步的Http服务,它为myEnviroment变量提供了价值。我将此变量传递给子组件,即使用单向绑定和输入装饰器
的workflow-display.component这是我将它传递给子组件的方式
app.component .html
<!--container HTML hidden-->
<main class="col-sm-9 offset-sm-3 col-md-10 offset-md-2 pt-3 mh-100">
<workflow-display [environment] = "myEnvironment" #taskDisplay></workflow-display>
</main>
<!--container HTML hidden-->
工作流display.component
//import ..
@Component({
selector: 'workflow-display',
template: require('./workflow-display.component.html')
})
export class WorkflowDisplayComponent implements OnInit {
//some other variables hidden...
workbenchTaskPage: string = 'wsIndex';
@Input()
environment: String;
constructor(private _workflowService: WorkflowService) {
}
openTask(event: any, task: any) {
window.open(this.environment + this.workbenchTaskPage + "?taskId=" + task.taskId + "&activitiWorkflow=true");
}
}
现在我正在尝试为workdisplay.component编写单元测试以确保它的环境变量已设置,但我不知道如何测试它,因为它仅在父组件中的回调之后设置且未定义首先 。 这是我到目前为止在规范中写的
工作流display.spec
//import..
describe('WorkflowDisplayComponent (inline template)', () => {
let comp: WorkflowDisplayComponent;
let fixture: ComponentFixture<WorkflowDisplayComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ WorkflowDisplayComponent ], // declare the test component
providers: [WorkflowService,
MockBackend,
BaseRequestOptions,
{
provide: Http,
deps: [MockBackend, BaseRequestOptions],
useFactory:
(backend: XHRBackend, defaultOptions: BaseRequestOptions) => {
return new Http(backend, defaultOptions);
}
}
]
}).compileComponents();
fixture = TestBed.createComponent(WorkflowDisplayComponent);
comp = fixture.componentInstance; // BannerComponent test instance
}));
it('should have right URL', () => {
fixture.detectChanges();
expect((comp.environment + comp.workbenchTaskPage)).toEqual('http://dev.grc.coreworkbench.int.westgroup.com/grcworkbench/app/grcnewsalerts/wsIndex');
});
});
我在运行测试时得到的是
should have right URL FAILED
Expected 'undefinedwsIndex' to equal 'http://dev.grc.coreworkbench.int.westgroup.com/grcworkbench/app/grcnewsalerts/wsIndex'.
现在我看到子组件环境变量尚未定义,我不知道如何解决这个问题。应该测试应用程序组件,以确保其“我的环境”#39;设置变量或其他。