es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Prueba las llamadas a API en la clase de servicio con Angular 12.

21 Jul, 2023 Programación

No soy un experto en pruebas de Angular y estoy teniendo problemas para escribir la clase de prueba correcta para el siguiente fragmento de código:

checkAuth(user: User): Observable<boolean> {
    const endpoint = `${environment.apiHost}/${environment.apiUrl}/${environment.apiVersion}/user`;
    return this.httpClient.post<apiresponse>(endpoint, user).pipe(
      map(response => {
        if (response.status === ApiResponseStatus.OK) {
          const authUser = response.payload as User;
          this._currentUserSubject.next(authUser);
          this._isAuthenticatedSubject.next(true);
          return true;
        } else {
          this._currentUserSubject.next({});
          this._isAuthenticatedSubject.next(false);
          return false;
        }
      })
    );
  }

Como puedes ver, este método llama a una API externa (que podría no estar disponible en el momento de ejecutar la prueba) y además debo proporcionar la parte de prueba para todos los casos de mapeo de respuestas después de que se devuelve el objeto Observable.

¿Te importaría darme un ejemplo de cómo debería crear la clase “spec.ts” para esto?

Gracias.

Alessio

Tags:  , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Estimado Alessio,

    Gracias por comunicarte. Entiendo tus preocupaciones acerca de probar el método checkAuth en Angular, especialmente considerando que utiliza una API externa. Aquí tienes un ejemplo de una clase spec.ts que prueba este método:

    import { TestBed } from '@angular/core/testing';
import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';

import { ApiService } from './api.service';
import { User } from './user.model';

describe('ApiService', () => {
  let service: ApiService;
  let httpMock: HttpTestingController;

  beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [HttpClientTestingModule],
      providers: [ApiService]
    });
    service = TestBed.inject(ApiService);
    httpMock = TestBed.inject(HttpTestingController);
  });

  afterEach(() => {
    httpMock.verify();
  });

  it('debería devolver true para un usuario válido', () => {
    const user: User = { username: 'test', password: 'password' };
    const endpoint = `${environment.apiHost}/${environment.apiUrl}/${environment.apiVersion}/user`;

    service.checkAuth(user).subscribe(authenticated => {
      expect(authenticated).toBe(true);
    });

    const req = httpMock.expectOne(endpoint);
    expect(req.request.method).toBe('POST');
    req.flush({ status: 'OK', payload: user });
  });

  it('debería devolver false para un usuario inválido', () => {
    const user: User = { username: 'test', password: 'wrongpassword' };
    const endpoint = `${environment.apiHost}/${environment.apiUrl}/${environment.apiVersion}/user`;

    service.checkAuth(user).subscribe(authenticated => {
      expect(authenticated).toBe(false);
    });

    const req = httpMock.expectOne(endpoint);
    expect(req.request.method).toBe('POST');
    req.flush({ status: 'ERROR' });
  });
});

    Permíteme explicarte qué sucede aquí. Primero, importamos y configuramos HttpClientTestingModule y HttpTestingController, que nos permiten simular solicitudes y respuestas HTTP. También proporcionamos el ApiService que estamos probando.

    En los bloques it, definimos los casos de prueba específicos que queremos ejecutar para el método checkAuth. Creamos un objeto User para usar como entrada y definimos el punto final esperado para la solicitud API. Llamamos al método checkAuth del service que estamos probando y nos suscribimos al Observable<boolean>resultante.

    Luego, utilizamos httpMock.expectOne(endpoint) para interceptar la solicitud HTTP y verificamos que el método de solicitud sea POST. Finalmente, utilizamos req.flush() para simular la respuesta API para esta solicitud. Proporcionamos un objeto con un campo status (ya sea OK o ERROR) y, para las respuestas exitosas, un campo payload con el usuario autenticado.

    Después de estos pasos, se ejecuta la función subscribe() y proporcionamos una afirmación para verificar que el valor authenticated devuelto por el método coincide con el valor esperado.

    Espero que este ejemplo te ayude a comprender cómo escribir una clase spec.ts para probar el método checkAuth. Si tienes alguna otra pregunta o inquietud, no dudes en hacérmelo saber.

    Saludos cordiales,
    [Tu nombre]

Comments are closed.