当尝试导航到特定路线时,Angular 5 - 路由测试失败了Jasmine

时间:2018-01-30 10:17:35

标签: angular unit-testing routing jasmine angular5

我使用Angular 5,我正在使用Jasmine& amp;测试角度服务。噶。 我有一个身份验证服务,其功能包括可以重定向到登录页面的功能。如果用户未经过身份验证,我会调用它。

我尝试这个功能,它做了一个简单的“router.navigate ['login']”,但我有以下错误:

Chrome 62.0.3202 (Linux 0.0.0) AuthenticationService should redirect to login page FAILED
        Expected '' to be '/login'.
            at Object.<anonymous> home/user/Git/astre-fo/src/app/services/authentification.service.spec.ts:171:29)
            at Object.<anonymous> home/user/Git/astre-fo/node_modules/@angular/core/esm5/testing.js:411:1)
            at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invoke home/user/Git/astre-fo/node_modules/zone.js/dist/zone.js:388:1)
            at ProxyZoneSpec.webpackJsonp.../../../../zone.js/dist/proxy.js.ProxyZoneSpec.onInvoke home/user/Git/astre-fo/node_modules/zone.js/dist/proxy.js:79:1)
Chrome 62.0.3202 (Linux 0.0.0): Executed 17 of 17 (1 FAILED) (0 secs / 1.922 secs)
Chrome 62.0.3202 (Linux 0.0.0) AuthenticationService should redirect to login page FAILED
        Expected '' to be '/login'.
            at Object.<anonymous> home/user/Git/astre-fo/src/app/services/authentification.service.spec.ts:171:29)
            at Object.<anonymous> home/user/Git/astre-fo/node_modules/@angular/core/esm5/testing.js:411:1)
            at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invoke home/user/Git/astre-fo/node_modules/zone.js/dist/zone.js:388:1)
Chrome 62.0.3202 (Linux 0.0.0): Executed 17 of 17 (1 FAILED) (2.031 secs / 1.922 secs)

authentication.service.spec.ts:

import {AuthenticationService} from './authentification.service';
import {async, fakeAsync, TestBed, tick} from '@angular/core/testing';
import {UserService} from './user.service';
import {RouterTestingModule} from '@angular/router/testing';
import {HttpClientTestingModule, HttpTestingController} from '@angular/common/http/testing';
import {Router} from '@angular/router';
import {Location} from '@angular/common';
import {routes} from '../app.routes';
import {AppModule} from '../app.module';
import {AppComponent} from '../app.component';

describe('AuthenticationService', () => {

  let service: AuthenticationService;
  let httpMock: HttpTestingController;

  let location: Location;
  let router: Router;
  let fixture;

  beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [
        AppModule,
        HttpClientTestingModule,
        RouterTestingModule.withRoutes(routes)
      ],
      providers: [
        AuthenticationService,
        UserService
      ],
    });

    service = TestBed.get(AuthenticationService);
    httpMock = TestBed.get(HttpTestingController);

    router = TestBed.get(Router);
    location = TestBed.get(Location);

    fixture = TestBed.createComponent(AppComponent);
    router.initialNavigation();
  });

  it('should redirect to login page', fakeAsync(() => {

    service.redirectToLogin();

    tick(50);
    fixture.detectChanges();

    expect(location.path()).toBe('/login');
  }));

});

authentication.service.ts:

import { Injectable } from '@angular/core';
import {HttpClient} from '@angular/common/http';
import {UserService} from './user.service';
import {Router} from '@angular/router';
import {Location} from '@angular/common';

@Injectable()
export class AuthenticationService {

  constructor(
    private httpClient: HttpClient,
    public userService: UserService,
    private router: Router,
    private location: Location
  ) { }

  public redirectToLogin() {
    this.router.navigate(['login']);
  }
}

app.routes.ts:

import { Routes, RouterModule } from '@angular/router';
import { LoginComponent } from './login/login.component';
import { AuthGuardService } from './services/auth-guard.service';
import { SearchComponent } from './search/search.component';

export const routes: Routes = [
    { path: '', redirectTo: 'search', pathMatch: 'full'},
    { path: 'login', component: LoginComponent },
    { path: 'search', component: SearchComponent, canActivate: [AuthGuardService] }
];

export const routing = RouterModule.forRoot(routes);

有没有人有想法?

2 个答案:

答案 0 :(得分:1)

this.router.navigate(['/login']);

传递/它将起作用

答案 1 :(得分:0)

我找到了一个解决方案:使用诺言!

  it('should redirect to login page', fakeAsync(() => {

    service.redirectToLogin().then(() => {
      expect(location.path()).toBe('/login');
    });
  }));

如果某人有更好的解决方案,或者我的解决方案不正确,请告诉我:)