找不到可监视的对象以进行 navigateBackToLanding

Question

在运行测试时，我收到此错误could not find an object to spy upon for navigateBackToLanding。

我已经搜索并完成了所有提到的步骤，但我仍然收到错误

 could not find an object to spy upon for navigateBackToLanding

不确定我在这里错过了什么。

component.ts

  ngOnInit () {
    this.bwcPageTemplateCommunicatorService.subheader.next({
      title: this.title,
      backAction: {
        label: 'back',
        callback: () => this.navigateBackToLanding()
      }
    });
  }

  public navigateBackToLanding () {
    this.router.navigate(['portal']);
  }

组件规格.ts

describe('CpDetailPageComponent', () => {
  let component: CpDetailPageComponent;
  let fixture: ComponentFixture<CpDetailPageComponent>;
  let onClickMock;
  beforeEach(async(() => {
    TestBed.configureTestingModule({
      schemas: [CUSTOM_ELEMENTS_SCHEMA],
      imports: [RouterTestingModule],
      declarations: [CpDetailPageComponent],
      providers: [
        BwcPageTemplateCommunicatorService,
        BwcTocService,
        BwcScrollSpyService,
        BwcScrollService
      ]
    });
    TestBed.compileComponents();
    fixture = TestBed.createComponent(CpDetailPageComponent);
    onClickMock = spyOn(component, 'navigateBackToLanding').and.callThrough();
  }));

  it('should call navigateBackToLanding method', () => {
    fixture.debugElement.query(By.css('button')).triggerEventHandler('click', null);
    expect(onClickMock).toHaveBeenCalled();
  });

});

HTML

<button class="bwc-subheader__button-back ng-star-inserted" mat-icon-button="" type="button" aria-label="back"></button>

Answer 1

嗯，这很简单：你永远不会在任何地方初始化变量component。因此，正如错误消息所说，没有对象可以监视，因为 component 是未定义的。

component = fixture.componentInstance;
onClickMock = spyOn(component, 'navigateBackToLanding').and.callThrough();