窥探ChangeDetectorRef.detectChanges

时间:2017-06-03 07:56:51

标签: angular

我正在尝试测试一个组件调用detectChanges注入ChangeDetectorRef

我已经逐步完成了代码并且它肯定被调用了,但看起来我在组件和测试中获得了不同的ChangeDetectorRef值。这是代码。我也尝试过评论过的间谍,但它也没有用。

it('should call ChangeDetectorRef.detectChanges from onFixedUpdate', () => {
    let changeDetectorService = fixture.debugElement.injector.get(ChangeDetectorRef, null);
    let spy = spyOn(changeDetectorService, 'detectChanges').and.callThrough();
    //let spy = spyOn(fixture.changeDetectorRef, 'detectChanges').and.callThrough();

    expect(spy).not.toHaveBeenCalled();

    fixture.componentInstance.onFixedUpdate(1);

    expect(spy).toHaveBeenCalled();
});

2 个答案:

答案 0 :(得分:1)

假设您在组件内部将注入的ChangeDetectorRef命名为cdr

it('should call ChangeDetectorRef.detectChanges from onFixedUpdate', () => {

   // grab the the reference to the ChangeDetectorRef (cdr) directly from the component
   let spy = spyOn((<any>fixture.componentInstance).cdr, 'detectChanges').and.callThrough();

   expect(spy).not.toHaveBeenCalled();

   fixture.componentInstance.onFixedUpdate(1);

   expect(spy).toHaveBeenCalled();
});

答案 1 :(得分:0)

我遇到了同样的问题并使用了Juan's answer to a similar SO question.

中描述的技术

基本要点是直接监视组件中已注入ChangeDetectorRef的属性。如果您已将此属性标记为私有(通常是这种情况),则可以通过将组件强制转换为any然后使用该属性在私有属性上创建间谍来解决此问题。

请注意我会简单地将此作为评论添加,但我没有足够高的代表 - 我希望这没关系!