角度单元测试 ngOninit答案

【问题标题】：angular unit test ngOninit角度单元测试 ngOninit
【发布时间】：2018-10-22 06:15:03
【问题描述】：

测试台配置是

  TestBed.configureTestingModule({
            declarations: [ EditPersorgaComponent, ArrayFromIntPipe, TeamFilterPipe ],
            schemas: [ NO_ERRORS_SCHEMA ],
            imports: [  HttpClientModule, NgbModule.forRoot(), TranslateModule.forRoot({
                loader: {
                  provide: TranslateLoader,
                  useFactory: HttpLoaderFactory,
                  deps: [HttpClient]
                }
              })],
            providers: [
                { provide: Renderer2, useValue: renderer2Stub },
                { provide: NavigationService, useValue: navigationServiceStub },
                { provide: DatepickerFormater, useValue: datepickerFormaterStub },
                { provide: NgbModal, useValue: ngbModalStub },
                { provide: PersorgaService, useValue: persorgaServiceStub },
                { provide: ActivatedRoute, useValue: activatedRouteStub },
                { provide: ActionsSubject, useValue: actionsSubjectStub },
                { provide: ToasterService, useValue: toasterServiceStub },
                { provide: TranslateService, useValue: translateServiceStub },
                { provide: AppConfirmService, useValue: appConfirmServiceStub }
            ]
        });
        fixture = TestBed.createComponent(EditPersorgaComponent);
        comp = fixture.componentInstance;
    });

我想在 Angular 2+ 中测试 ngOninit

  ngOnInit() {
    this.navigationService.menuStore$.dispatch(new SetFromArray({
      widgetName: 'elementPersonalOrg', data: NavigationService.getMenuElement('elementPersonalOrg').sub
    }));

    this.selectedDate = this.dpFormatter.convertToNgbDateStruct(new Date());
  }

我试过单元测试

describe('ngOnInit', () => {
    it('makes expected calls', async( () => {
        const navigationServiceStub: NavigationService = fixture.debugElement.injector.get(NavigationService);
        spyOn(navigationServiceStub, 'menuStore$');
        comp.ngOnInit();
        expect(navigationServiceStub.menuStore$).toHaveBeenCalled();
    }));
});

我收到类似的错误

TypeError：无法读取未定义的属性“id” 失败：无法读取未定义的属性“debugElement”

有人可以帮我解决这个问题吗？谢谢

【问题讨论】：

好像fixture 是未定义的，你能分享一些上面的代码吗？夹具分配在哪里？
我已经分享了代码
据我所知，`TestBed.configureTestingModule` 应该在describe 部分，fixture 分配也是如此

标签： angular unit-testing angular2-testing

【解决方案1】：

在您的组件实例之后，您需要为您的组件在加载时需要的东西设置 ID。这通常在测试台配置完成之前在 beforeEach 之外完成。

如果此页面的路由需要某种类型的 id，则可能就是这样，并且需要在配置测试台之前进行处理。如果没有看到您的组件，这很难回答。

查看您的组件并查看在初始化时加载了哪些项目。另外，我建议删除 NO_ERRORS_SCHEMA。这将隐藏您可能不想隐藏的实际错误。

另一种可能性是编译组件的时间。尝试先将 fakeAsync 添加到您的 TestBed 配置所在的 beforeeach 中。

beforeEach(async(() => { // testbed configure here   }));

【讨论】：