如何解决如何在ngOnit方法内编写用于订户和超时的测试用例?
我使用以下ngOnit方法在angular8应用程序中有一个类
ngOnInit(): void {
this.setCustomizedValues();
this.sub = PubSub.subscribe('highlightEntity',(subId,entityIdentifier: string) => {
document.querySelector(entityIdentifier).classList.add('highlight');
setTimeout(() => {
document.querySelector(entityIdentifier).classList.remove('highlight');
},2000);
});
}
我已经初始化了以下测试用例
describe('aComponent',() => {
let httpCallerServiceStub = jasmine.createSpyObj('httpCallerServiceStub',['get']);
let fixture: ComponentFixture<aComponent>;
let componentInstance: aComponent;
localStorage.clear();
beforeEach(() => {
TestBed.configureTestingModule({
declarations: [aComponent],providers: [
{
provide: HttpCallerService,useValue: httpCallerServiceStub
}],imports: [CommonModule,CmcSpinnerModule,NgbModule],}).compileComponents();
fixture = TestBed.createComponent(aComponent);
componentInstance = fixture.componentRef.instance;
fixture.autoDetectChanges();
});
describe('ngOnInit method',() => {
beforeEach(() => {
fixture.componentInstance.customized = {};
});
it('should initialize with minimum input',() => {
// Triggers ngOnInit
fixture.detectChanges();
expect(fixture.componentInstance.customized).toEqual({});
});
});
所以当我运行它时,它会随机抛出以下错误
"message": "An error was thrown in afterAll\nTypeError: Cannot read property 'classList' of null\n at <Jasmine>\n at webpack:///components/aComponent/aComponent.ts:33:53
这是文件的建议
因此,在此之后,无论我提前写了多少测试,问题仍然保持不变,有时可行,有时不可行。
您能告诉我ngonit内部的pubsub.subscriber和超时怎么办吗?
解决方法
由于您对DOM
感到困惑,因此ngOnInit
可能为时过早。 DOM
尚未绘制。尝试将逻辑移至ngAfterViewInit
ngAfterViewInit() {
this.sub = PubSub.subscribe('highlightEntity',(subId,entityIdentifier: string) => {
document.querySelector(entityIdentifier).classList.add('highlight');
setTimeout(() => {
document.querySelector(entityIdentifier).classList.remove('highlight');
},2000);
});
}
要测试setTimeout
,可以使用fakeAsync
和tick
。
import { fakeAsync,tick } from '@angular/core/testing';
...
it('should initialize with minimum input',fakeAsync(() => {
// Triggers ngOnInit
fixture.detectChanges();
// do your assertions for ngAfterViewInit
// make 2s pass in a fake way
tick(2000);
// do your assertions for the setTimeout callback
expect(fixture.componentInstance.customized).toEqual({});
}));
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。