时间戳

首页 > 解决方案 > Angular，使用路由器导航时测试哪个组件是实例化的

angular - Angular，使用路由器导航时测试哪个组件是实例化的

问题描述

我想知道在导航到路线时是否有办法测试哪个组件被实例化。

我有这条路线：

const routes: Routes = [{path: ':anyString', component: AnyStringComponent}];

我想用 unit-test 进行测试：

router.navigate(['azdfz4896']);
// expect instantiated component to be AnyStringComponent

有没有办法测试它？

标签： angularunit-testingangular5

解决方案

您可以模拟ActivatedRoute并尝试：

route.snapshot._routeConfig.component.name

从快照中获取组件名称

激活路由模拟：

export class MockActivatedRoute implements ActivatedRoute{
 component : Type<any>|string;
 snapshot : ActivatedRouteSnapshot;
 url : Observable<UrlSegment[]>;
 params : Observable<Params>;
 queryParams : Observable<Params>;
 data : Observable<Data>;
 outlet : string;
 ...  
}

...

你的测试

router = TestBed.get(Router);
location = TestBed.get(Location);
router.initialNavigation();
....
it('navigate to "search" takes you to /search', fakeAsync(() => {
  route = new MockActivatedRoute();
  router.navigate(['azdfz4896']);
  tick();
  expect(location.path()).toBe('/azdfz4896');
  expect(route.snapshot.component.name).toBe('AnyStringComponent');
}));

希望对你有帮助

推荐阅读