Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to unit-test canActivate guard method of angular2 using Jasmine?

Sorry for asking this type of question. But I'm not able to find any blog or youtube tutorials on writing the canActivate guard file testing. Nor in the official documentation there is anything mentioned.

any help will be much appreciated.

like image 527
Sumit Khanduri Avatar asked Dec 19 '16 08:12

Sumit Khanduri


People also ask

How do you test NGRX reducers?

Test a reducer Reducers are so simple to test as they are pure functions. We just need to call the reducer function and pass in a fake piece of state and an action and then check the new state slice returns.

What is test bed in Jasmine?

TestBed is a mock environment to run Angular2 component tests without the browser.

What is the difference between canActivate and canActivateChild?

The differences If we directly navigate to the child route, the canActivate guard will also be executed. canActivateChild will always be executed while navigating to/between child routes. For example, if we're at a child route child/1 and we navigate to child/2 , the guard will get executed.


1 Answers

since no one answered my question, so I'm pasting my code snippet for the reference to help people who might get this 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);     }); }); 
like image 174
Sumit Khanduri Avatar answered Sep 18 '22 21:09

Sumit Khanduri