Question

我正在用Angular开发日期范围选择器组件，并且很难测试输入值是否错误。

我的ngOnInit（）做一个check for min/max date values。

当我尝试写test for this case

时

茉莉花回来了

期望的函数引发RangeError，但引发TypeError：无法读取未定义的属性“ ngZone”。

研究S.O.帖子，导致我创建了mock NgZone class并在TestBed中提供了该内容，这只会导致出现更多问题，例如“订阅未定义”。

我认为这可能是由于EventEmitter引起的，但是我尝试将其删除，但我收到了同样的错误。

首先，如何解决NgZone错误？有一些S.O.有关该主题的文章，但我似乎不多。

第二，如果传入错误值，如何正确测试ngOnInit()的行为是否符合预期？

更新

即使通过隔离输入验证功能，我仍然无法检查该功能是否引发错误。相反，我不得不检查detectChanges()，这是调用其他所有功能的函数：

expect(() => fixture.detectChanges()).toThrow();

Answer 1

NgZone服务用于访问Api，以支持在ZoneJS空间内外运行代码。但是，如果在测试中发现使用它有用，则可以使用以下方法创建服务的实例：

let ngService = Testbed.get(NgZone)

如果您打算测试组件的生命周期ngOnInit（），则Angular通过使用ComponentFixture在Testbed API中为此提供了工具，您可以控制生成变更检测以触发ngOnInit的方式，如下所示：

describe('tests', () => {

  let component: MyComponent;
  let fixture: ComponentFixture<MyComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
        imports: [ ],
        declarations: [ MyComponent ],
    }).compileComponents();
    fixture = TestBed.createComponent(MyComponent);
    component = fixture.componentInstance;

  }));


  it('simple test', async(() => {
    fixture.detectChanges(); // triggers cd and passes through component lifecycle ngOnInit

  }));

});

测试Angular组件时未定义NgZone

1 个答案: