首页 > 解决方案 > 提供 Angular 路由器获取“无法读取未定义的属性‘根’”

问题描述

我正在尝试测试一个按钮,当单击该按钮时,它会导航到我的主页,但是当我为 Router 类提供 Jasmine Spy 对象时,我得到一个“TypeError:无法读取未定义的属性'root'”。

describe('Error404Component', () =>
{
  let component: Error404Component;
  let fixture: ComponentFixture<Error404Component>;
  const routerSpy = jasmine.createSpyObj('Router', ['navigate']);

  beforeEach(async(() =>
  {
    TestBed.configureTestingModule({
      imports: [
        AppModule
      ]
    })
      .compileComponents();
  }));

  beforeEach(() =>
  {
    TestBed.overrideProvider(Router, { useValue: routerSpy });
    fixture = TestBed.createComponent(Error404Component);
    component = fixture.componentInstance;
    fixture.autoDetectChanges();
  });

  fit('should navigate', fakeAsync(() =>
  {
    const buttons = fixture.debugElement.queryAll(By.css('.button_link'));
    expect(buttons).toBeTruthy();

    const homeButton = buttons[0];
    (homeButton.nativeElement as HTMLButtonElement).click();

    fixture.detectChanges();
    tick();

    const spy = routerSpy.navigate as jasmine.Spy;

    expect(spy.calls.any()).toBeTruthy();
    expect(spy.calls.first().args[0][0]).toEqual(HOME_PATH);
  }));

});

标签: angularjasminekarma-jasmine

解决方案


您应该在使用 TestBedrouter时提供组件中使用的所有其他服务注入。configureTestingModule

 describe('Error404Component', () =>
  {

   class MockRouter {
     navigate = jasmine.createSpy('navigate');
   }
  let component: Error404Component;
  let fixture: ComponentFixture<Error404Component>;
  let routerSpy;

  beforeEach(async(() =>
  {
  routerSpy= new MockRouter();
    TestBed.configureTestingModule({
      imports: [
        AppModule
      ],
      providers: [{ provide: Router, useValue: routerSpy }],
      schemas: [NO_ERRORS_SCHEMA]
    })
      .compileComponents();
  }));

  beforeEach(() =>
  {
    fixture = TestBed.createComponent(Error404Component);
    component = fixture.componentInstance;
    fixture.autoDetectChanges();
  });

  fit('should navigate', fakeAsync(() =>
  {
    const buttons = fixture.debugElement.queryAll(By.css('.button_link'));
    expect(buttons).toBeTruthy();

    const homeButton = buttons[0];
    (homeButton.nativeElement as HTMLButtonElement).click();

    fixture.detectChanges();
    tick();

    const spy = routerSpy.navigate as jasmine.Spy;

    expect(spy.calls.any()).toBeTruthy();
    expect(spy.calls.first().args[0][0]).toEqual(HOME_PATH);
  }));

});

推荐阅读