这里是我的组件方法：
initiateDetailsView(detailsData) {
this.router.navigate(['./personnel-details'], {
relativeTo: this.activatedRoute,
});
}
我的测试用例：
it('should navigate to details page', () => {
const routerNavigateSpy = spyOn(router, 'navigate');
component.initiateDetailsView({});
fixture.detectChanges();
expect(routerNavigateSpy).toHaveBeenCalledWith([
'./personnel-details',
{ relativeTo: 'clinic-admin/scok-personnel' },
]);
});
但是得到一个错误为：
Expected spy navigate to have been called with:
[ [ './personnel-details', Object({ relativeTo: 'clinic-admin/scok-personnel' }) ] ]
but actual calls were:
[ [ './personnel-details' ], Object({ relativeTo: Route(url:'', path:'') }) ].
如何测试relativeTo路由？
更新
fdescribe('ListPersonnelComponent', () => {
let component: ListPersonnelComponent;
let fixture: ComponentFixture<ListPersonnelComponent>;
let location: Location;
let activatedRoute:ActivatedRoute;
let router;
const routes = [
{
path: 'personnel-details',
component: PersonnelDetailsComponent,
relativeTo: activatedRoute,
},
];
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [
RouterTestingModule.withRoutes(routes),
SharedModule,
BrowserAnimationsModule,
HttpClientModule,
],
declarations: [ListPersonnelComponent],
providers: [PersonnelDataService],
}).compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(ListPersonnelComponent);
component = fixture.componentInstance;
router = TestBed.inject(Router);
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
it('should navigate to details page', () => {
const routerNavigateSpy = spyOn(router, 'navigate');
component.initiateDetailsView({});
fixture.detectChanges();
expect(routerNavigateSpy).toHaveBeenCalledWith([
'./personnel-details',
{ relativeTo: activatedRoute },
]);
});
});
获取错误为：
Variable 'activatedRoute' is used before being assigned.ts(2454)
fdescribe('ListPersonnelComponent', () => {
let component: ListPersonnelComponent;
let fixture: ComponentFixture<ListPersonnelComponent>;
let location: Location;
let activatedRoute:ActivatedRoute;
let router;
const routes = [
{ path: 'personnel-details',
component: PersonnelDetailsComponent,
// here is one issue, comment next line
// relativeTo: activatedRoute,
},
];
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [
RouterTestingModule.withRoutes(routes),
SharedModule,
BrowserAnimationsModule,
HttpClientModule,
],
declarations: [ListPersonnelComponent],
providers: [PersonnelDataService],
}).compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(ListPersonnelComponent);
component = fixture.componentInstance;
router = TestBed.inject(Router);
// grab the instance used for this test
activatedRoute = TestBed.inject(ActivatedRoute);
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
it('should navigate to details page', () => {
const routerNavigateSpy = spyOn(router, 'navigate');
component.initiateDetailsView({});
fixture.detectChanges();
expect(routerNavigateSpy).toHaveBeenCalledWith(
// this is an array of itself, then relativeTo is an object after
['./personnel-details'],
{ relativeTo: activatedRoute },
);
});
});
到目前为止，我在这方面找到的最好的资源是测试棱角分明的免费电子书。请随意询问其他测试问题并标记我。