Question

如何测试routerLink？

我试过

p.hasClass("opened")

但是href var为null。我也尝试过.nativeElement.href 并给我一个空字符串

Answer 1

为了编译routerLink指令，路由器模块（更具体地说，它的测试种类，因为实际路由不应该在测试中发生）应该导入到测试台：

import { RouterTestingModule } from '@angular/router/testing';

...

TestBed.configureTestingModule({
  imports: [RouterTestingModule]
});

考虑到组件模板中有<a routerLink="/login"></a>，这应该是真的：

const href = debugEl.query(By.css('a')).nativeElement.getAttribute('href');
expect(expect(href)).toEqual('/login');

考虑到routerLink接受复杂配置，href断言可能还不够。即使它依赖于应该被信任的RouterTestingModule，它也是黑盒子测试。

更具体的方法是测试routerLink输入本身。考虑到组件模板中存在<a [routerLink]="['/login']"></a>并且导入了RouterTestingModule，这应该是真的：

import { RouterLinkWithHref } from '@angular/router';

...

const linkDebugEl = debugEl.query(By.css('a'));
const routerLinkInstance = linkDebugEl.injector.get(RouterLinkWithHref);
expect(routerLinkInstance['commands']).toEqual(['/login']);
expect(routerLinkInstance['href']).toEqual('/login');

这不需要RouterTestingModule;如果需要测试RouterLink输入，commands指令可以用适当的伪指令替换。

Answer 2

你需要监视路由器。

const router = TestBed.get(router); //Get the router from the TestBed.
const spy = spyOn(router, 'navigate'); //Register a Spy on the router navigate function

expect(spy).toHaveBeenCalledWith(['login']); //Check if the router has been called with 'login'

此外，您应该在测试中使用RouterTestingModule而不是使用应用程序。

Router Testing Module

如果需要，您可以使用自己的路线进行设置。（来自Angular测试文档）

 beforeEach(() => {
  TestBed.configureTestModule({
    imports: [
      RouterTestingModule.withRoutes(
       [{path: '', component: BlankCmp}, {path: 'simple', component: SimpleCmp}])]
      )
    ]
  });
});

查看有关Angular Testing

的更多信息

Angular单元测试如何测试routerLink

2 个答案: