No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Pruebas a Guardianes

11/20
Recursos

Aportes 2

Preguntas 0

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

Los guardianes son los que protegen el ingreso a cierta ruta cuando se aplica una condición, para hacer pruebas de los guardianes se debe hacer lo siguiente.

se puede ver como funciona el guardian con los diferentes servicios

auth.guard.ts

import { Injectable } from '@angular/core';
import { Router, ActivatedRouteSnapshot, CanActivate, RouterStateSnapshot, UrlTree } from '@angular/router';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';
import { TokenService } from './../services/token.service';
import { AuthService } from './../services/auth.service';

@Injectable({
  providedIn: 'root'
})

export class AuthGuard implements CanActivate {
  constructor(
    private tokenService: TokenService,
    private authService: AuthService,
    private router: Router
  ) {}

  canActivate(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {
    // const token = this.tokenService.getToken();
    // if (!token) {
    //   this.router.navigate(['/home']);
    //   return false;
    // }
    // return true;
    return this.authService.user$
    .pipe(
      map(user => {
        if(!user) {
          this.router.navigate(['/home']);
          return false;
        }
        return true;
      })
    )
  }
}

las pruebas de creación llevan mockin de los servicios utilizados dentro de auth guard

auth.guard.spec.ts

import { TestBed } from '@angular/core/testing';
import { Router } from '@angular/router';
import { AuthService } from '../services/auth.service';
import { TokenService } from '../services/token.service';
import { AuthGuard } from './auth.guard';

describe('Test for AuthGuard', () => {
  let guard: AuthGuard;
  let tokenService: jasmine.SpyObj<TokenService>;
  let authService: jasmine.SpyObj<AuthService>;
  let router: jasmine.SpyObj<Router>;

  beforeEach(() => {
    const tokenServiceSpy = jasmine.createSpyObj('TokenService', ['getToken']);
    const authServiceSpy = jasmine.createSpyObj('AuthService', ['user$']);
    const routerSpy = jasmine.createSpyObj('Router', ['navigate']);
    TestBed.configureTestingModule({
      providers: [
        AuthGuard,
        { provide: TokenService, useValue: tokenServiceSpy },
        { provide: AuthService, useValue: authServiceSpy },
        { provide: Router, useValue: routerSpy },
       ]
    });
    guard = TestBed.inject(AuthGuard);
    tokenService = TestBed.inject(TokenService) as jasmine.SpyObj<TokenService>;
    authService = TestBed.inject(AuthService) as jasmine.SpyObj<AuthService>;
    router = TestBed.inject(Router) as jasmine.SpyObj<Router>;
  });

  it('should be created', () => {
    expect(guard).toBeTruthy();
  });
});

Cree un user snippet para este tem de los espias:

"spy method":{
      "scope": "typescript",
      "prefix": "test-spyObj",
      "body": [
          "let $1: jasmine.SpyObj<$2>;",
          "const $1Spy = jasmine.createSpyObj('$2', ['$3']);", 
          "{ provide: $2, useValue: $1Spy },",
          "$1 = TestBed.inject($2) as jasmine.SpyObj<$2>"         
        ],
      "description": "spy method"
    },

claro luego hay que ubicar cada linea donde corresponde, pero ahorra mucho tiempo de copiar y pegar