TestBed + Spies

Clase 11 de 25 • Curso de Angular: Unit Testing para Servicios

Miguel Angel Coy Triana

student•

En mi caso me estaba fallando la prueba "should call to getValue from ValueService" porque no había eliminado o comentado la constante interna de la prueba unitaria "const valueServiceSpy" y me generaba el siguiente error: "Error: Expected undefined to be 'fake value'". Al comentar la constante constante tomo el valor del valueServiceSpy que se encuentra en el scope global y no la del scope de la prueba unitaria y ahí si pasa sin problema.

  it('should call getValue from spy of ValueService', () => {
    // const valueServiceSpy = jasmine.createSpyObj('ValueService', ['getValue']);
    valueServiceSpy.getValue.and.returnValue('fake value');
    // const masterService = new MasterService(valueServiceSpy);
    expect(service.getValue()).toBe('fake value');
    expect(valueServiceSpy.getValue).toHaveBeenCalled();
    expect(valueServiceSpy.getValue).toHaveBeenCalledTimes(1);
  });

Ivan Manrique

student•

Gracias crack, tenia mas de 20 min revisando, a nicolas se le olvido ese pequeño detalle jeje.

Elcira Ibarra

student•

En ésta parte del video se ve el codigo como queda despues de haber eliminado lo que daba error. Justo este step 8 no existe en github.

Franklin Gil

student•

No entiendo nada, solo se que todo esta saliendo bien!

Reinaldo Mendoza

student•

🤣

Marcos Galaviz

student•

Buen dia super curso sin embargo tengo confusion para poder llevar a la practica estos conceptos al mundo real donde hay servicios con metodos mas complejos, ojala alguien pueda ayudarme a comprender mejor, les dejo un ejemplo, tengo dentro de un servicio este metodo, ¿como deberia testearlo?

  public getWalletRewards() {
    return this.getLoyaltyRewards().then((rewards: IReward[]) => {
      const dispatch = {
        type: AppStateActions.WALLET_REWARDS,
        payload: rewards
      };
      this.store.dispatch(dispatch);
      return dispatch;
    });
  }

intente con algo asi pero estoy atorado, ¿como podria hacer este test? muchas gracias:

//Error

it('return loyalty rewards', (doneFn) =>{   
  const mockDispatch={}
  service.getWalletRewards().then((data) => {
    expect(data.payload.length).toBeGreaterThan(0);
    doneFn()
  })
})

Rigoberto Arriaza

student•

Este enlace de GitHub no funciona

Edward Alexis Uceda Jara

student•

por qué coloca el 'and' después del llamar a la función getvalue??

Jorge Luis Silva Medina

student•

Hola Edward es una funcion propia anidada del spy con la cual podemos realizar diferentes comportamientos cuando esa funcion fake sea llamada.

Jovanny Ruiz

student•

A veces siento que explica tan confuso :v

Cesar Elías Armendariz Ruano

student•

TestBed unido con los spies nos ayudara para resolver la inyección de dependencias. Tomando como ejemplo a master service

master.service.spec.ts

import { TestBed } from '@angular/core/testing';
import { MasterService } from './master.service';
import { ValueService } from './value.service';

describe('MasterService', () => {

    let masterService: MasterService;
    let valueServiceSpy: jasmine.SpyObj<ValueService>;

  beforeEach(() => {
    const spy = jasmine.createSpyObj('ValueService', ['getValue']);
    TestBed.configureTestingModule({
       providers: [ MasterService,
                  { provide: ValueService, useValue: spy }
                  ]
    });
    masterService = TestBed.inject(MasterService);
    valueServiceSpy = TestBed.inject(ValueService) as jasmine.SpyObj<ValueService>;
  });

  it('should be created', () => {
    expect(masterService).toBeTruthy();
  });
  
   it('should call to getValue from ValueService', () => {
    const valueServiceSpy = jasmine.createSpyObj('ValueService', ['getValue']);
    valueServiceSpy.getValue.and.returnValue('fake value');
    expect(masterService.getValue()).toBe('fake value');
    expect(valueServiceSpy.getValue).toHaveBeenCalled();
    expect(valueServiceSpy.getValue).toHaveBeenCalledTimes(1);
  });
});

TestBed + Spies

Introducción

Unit testing para servicios en Angular

Jest vs. Jasmine: entornos de testing para Angular

Fundamentos de unit testing en Angular

Tu primera prueba en Angular

Explorando matchers

Reporte de coverage

Mocha Report

Testing en servicios

Pruebas unitarias para servicios

Servicios con dependencias

Spies

Angular TestBed

TestBed + Spies

Proyecto

Setup y maquetación del proyecto

Product Service Http

Testing en consultas HTTP

HttpClientTestingModule

Generando Mocks

Pruebas para GET

Pruebas maliciosas para GET

Pruebas para POST

Pruebas para PUT y DELETE

Bonus

Pruebas a errores

Pruebas con interceptores

Pruebas al login

Pruebas a la API del navegador

GitHub Actions

Próximos pasos

Toma el Curso de Angular: Unit Testing para Componentes