小编Sii*_*aba的帖子

测试使用setInterval或setTimeout的Angular2组件

我有一个相当典型的简单ng2组件,它调用服务来获取一些数据(轮播项目).它还使用setInterval每隔n秒在UI中自动切换轮播幻灯片.它运行得很好,但是当运行Jasmine测试时,我得到错误:"不能在异步测试区域内使用setInterval".

我尝试在this.zone.runOutsideAngular(()=> {...}中包装setInterval调用,但错误仍然存​​在.我认为改变测试以在fakeAsync区域中运行会解决问题,但后来我得到一个错误,说不允许在fakeAsync测试区内进行XHR调用(这确实有意义).

如何同时使用服务发出的XHR调用和间隔,同时仍能测试组件?我正在使用ng2 rc4,由angular-cli生成的项目.提前谢谢了.

我的组件代码:

constructor(private carouselService: CarouselService) {
}

ngOnInit() {
    this.carouselService.getItems().subscribe(items => { 
        this.items = items; 
    });
    this.interval = setInterval(() => { 
        this.forward();
    }, this.intervalMs);
}
Run Code Online (Sandbox Code Playgroud)

而且来自Jasmine规范:

it('should display carousel items', async(() => {
    testComponentBuilder
        .overrideProviders(CarouselComponent, [provide(CarouselService, { useClass: CarouselServiceMock })])
        .createAsync(CarouselComponent).then((fixture: ComponentFixture<CarouselComponent>) => {
            fixture.detectChanges();
            let compiled = fixture.debugElement.nativeElement;
            // some expectations here;
    });
}));
Run Code Online (Sandbox Code Playgroud)

javascript unit-testing jasmine typescript angular

14
推荐指数
1
解决办法
5765
查看次数

标签 统计

angular ×1

jasmine ×1

javascript ×1

typescript ×1

unit-testing ×1