How to unit-test canActivate guard Methode der angular2 mit Jasmin?

Sorry für die Frage diese Art von Frage. Aber ich bin nicht in der Lage zu finden, jeder blog-oder youtube-tutorials auf schreiben der canActivate guard-Datei testen. Noch in der offiziellen Dokumentation gibt es nichts erwähnt.

jede Hilfe wird sehr geschätzt.

  • Was genau würdest du gerne testen? Dass die canActivate() Methode in der guard ist in der Tat aufgerufen oder der code, der in den canActivate() Methode?
InformationsquelleAutor Sumit Khanduri | 2016-12-19
  1. 31

    da niemand meine Frage beantwortet, also werde ich einfügen mein code snippet für die Referenz, um den Menschen helfen, könnte diese situation.

    sampleLoggedIn.guard.ts

    import {Injectable} from '@angular/core';
import {Router, CanActivate} from '@angular/router';
import {StorageService} from '../storage.service';

@Injectable()
export class LoggedInGuard implements CanActivate {
    constructor(private router: Router, private storageService: StorageService) {
    }

    /**Overriding canActivate to guard routes
     *
     * This method returns true if the user is not logged in
     * @returns {boolean}
     */
    canActivate() {
        if (this.storageService.isLoggedIn) {
            return true;
        } else {
            this.router.navigate(['home']);
            return false;
        }
    }
}

    sampleLoggedIn.guard.spec.ts

    import {TestBed, async} from '@angular/core/testing';
import {FormsModule} from '@angular/forms';
import {HttpModule} from '@angular/http';
import {CommonModule} from '@angular/common';
import 'rxjs/Rx';
import 'rxjs/add/observable/throw';
import {Router} from '@angular/router';
import 'rxjs/add/operator/map';
import {LoggedInGuard} from './loggedin.guard';
import {StorageService} from '../storage.service';
import {CookieService} from 'angular2-cookie/core';

describe('Logged in guard should', () => {
    let loggedInGuard: LoggedInGuard;
    let storageService: StorageService;
    let router = {
        navigate: jasmine.createSpy('navigate')
    };

    //async beforeEach
    beforeEach(async(() => {
        TestBed.configureTestingModule({
            imports: [FormsModule, CommonModule, HttpModule],
            providers: [LoggedInGuard, StorageService, CookieService,
                {provide: Router, useValue: router}
            ]
        })
            .compileComponents(); //compile template and css
    }));

    //synchronous beforeEach
    beforeEach(() => {
        loggedInGuard = TestBed.get(LoggedInGuard);
        storageService = TestBed.get(StorageService);
    });

    it('be able to hit route when user is logged in', () => {
        storageService.isLoggedIn = true;
        expect(loggedInGuard.canActivate()).toBe(true);
    });

    it('not be able to hit route when user is not logged in', () => {
        storageService.isLoggedIn = false;
        expect(loggedInGuard.canActivate()).toBe(false);
    });
});
    • canActivate() Argumente erfordert. siehe diese Frage auf, wie Sie
    InformationsquelleAutor Sumit Khanduri
  2. 1

    Diese Frage ist ziemlich alt - aber wie ich war versuchen zu finden, einige detaillierte unit-Tests-Dokumentation selbst in diesem Augenblick, wollte ich nur meinen Ansatz hier. Im Allgemeinen, wenn es Abhängigkeiten in meine guard /service /Komponente /was auch immer, ich denke diese sollten alle verspottet und nicht die Reale Dienste verwendet werden soll. Als dieser Leistungen sind nicht das, was wir testen wollen, in unserer Einheit test für die Wache - wir wollen einfach nur, um zu testen, die Wache.
    So, hier ist ein Allgemeines Beispiel, wie ich es tun würde, für einen guard Rückkehr beobachten:

    import { MyGuard } from './path/to/your/guard';
import { TestBed } from '@angular/core/testing';
import { finalize } from 'rxjs/operators';

describe('MyGuard Test', () => {
    const createMockRoute = (id: string) => {
    return {
      params: { id: id }
    } as any;
  };

  const createMockRouteState = () => null;
  let guard: MyGuard;

  beforeEach(() => {
    TestBed.configureTestingModule({
      providers: [
        MyGuard,
      ]
    });

    guard = TestBed.get(MyGuard);
  });

  it('should not be able to activate invalid route', done => {
    const route = createMockRoute(null);
    const state = createMockRouteState();
    const res$ = guard.canActivate(route, state);
    res$.pipe(finalize(done)).subscribe(res => expect(res).toBeFalsy());
  });
});

    und das ist, was ich tun würde in deinem konkreten Fall (sollte die Arbeit mit Winkel-6, canActivate sollten auch 2 params):

    import { LoggedInGuard } from './loggedin.guard';
import { TestBed } from '@angular/core/testing';
import { Router } from '@angular/router';
import { StorageService } from '../storage.service';

describe('LoggedInGuard', () => {
  let guard: LoggedInGuard;

  beforeEach(() => {
    TestBed.configureTestingModule({
      providers: [
        LoggedInGuard,
        { provide: Router, useClass: { navigate: () => null } },
        { provide: StorageService, useClass: { } }
      ]
    });

    guard = TestBed.get(LoggedInGuard);
  });

  it('should not be able to activate when logged out', () => {
    const storageService = TestBed.get(StorageService);
    storageService.isLoggedIn = false;
    const res = guard.canActivate(null, null);
    expect(res).toBeFalsy();
  });

  it('should be able to activate when logged in', () => {
    const storageService = TestBed.get(StorageService);
    storageService.isLoggedIn = true;
    const res = guard.canActivate(null, null);
    expect(res).toBeTruthy();
  });
});
    • { provide: Router, useClass: { navigate: () => null } } verursachen könnte TypeError: ctor is not a constructor Fehler. Verwenden useValue statt useClass.
    InformationsquelleAutor Jay
Schreibe einen Kommentar