角度5-我们如何测试路由器。navigate([id],{relativeTo:this._activatedRoute}])

时间:2018-07-06 07:09:07

标签: angular jasmine karma-runner

我想在茉莉,业力中测试此功能。什么是测试此功能的首选方法。

function test(payload){ this._router.navigate([this.result.id], {relativeTo: this._activatedRoute}) }

我已经为此编写了规格测试。

it('navigate to redirects', function(){
    let router=TestBed.get(Router);
    let spy = spyOn(router,"navigate");
    
    const payload: any = {
      event:{
        body:{
          result:{
            collections: 0,
            data: [],
            errors: [],
            errors_count: 0,
            meta: {},
            upload_id: "r1q3oFQfX"
          }
        }
      }
     };

   // console.log("##################id=",payload.event.body.result.upload_id);
    component.test(payload);
    fixture.detectChanges();
    expect(spy).toHaveBeenCalledWith([payload.event.body.result.upload_id])
  });

我也创建了假类

class RouterStub{
  navigate(params){
    console.log("parames",params)
  }
}

并也添加到configuraTestModule

 providers: [
    {provide: ENGINE_CONFIG,Store,Actions,Router,useValue:routerStub,

    }]

1 个答案:

答案 0 :(得分:1)

让我假设您在组件中使用了(_router:路由器)。

因此在您的测试中将添加这些行

RSpec.configure do |config|
  config.before(:each, type: :system, js: true) do
    driven_by :selenium_chrome_headless_no_sandbox
  end
end

上面的代码将帮助您使用仅包含您要测试的功能的假类来模拟Router服务。
那你就

class MockRouterService {
  navigate() { }
}

const mockRouterService = new MockRouterService();

TestBed.configureTestingModule({
  imports: [
    ...,
    RouterTestingModule,
  ],
  providers: [
    {
      provide: Router,
      useValue: mockRouterService,
    },
  ],
})
.compileComponents();

或者您可以像这样测试更具体

it('should call navigate', () => {
  spyOn(mockRouterService, 'navigate');
  component.test(abc);
  expect(mockRouterService.navigate).toHaveBeenCalled();
});