diretrizes de teste com jest

Instruction file imported from TallysHenrike/loja-starian (.github/instructions/diretrizes de teste com jest.instructions.md). Copyright stays with the author.

Diretrizes Específicas do Jest para Projetos Angular

1. Configuração e Limpeza de Testes

O Jest oferece métodos para configurar e limpar o ambiente de testes antes e depois de cada execução.

• beforeAll(fn, timeout): Use para executar uma função antes de todos os testes no bloco. Ideal para configurações globais que são caras e só precisam ser feitas uma vez.
• afterAll(fn, timeout): Use para executar uma função após todos os testes no bloco. Útil para liberar recursos globais.
• beforeEach(fn, timeout): Use para configurar o ambiente antes de cada teste. Ideal para inicializar o estado do componente ou serviço utilizando TestBed.
• afterEach(fn, timeout): Use para limpar o estado após cada teste. Útil para evitar efeitos colaterais entre os testes.

2. Estruturação de Testes

• describe(name, fn): Use para agrupar testes relacionados. Ajuda a organizar e categorizar testes por funcionalidades ou módulo.
• describe.each(table)(name, fn, timeout): Use para executar o mesmo conjunto de testes com diferentes conjuntos de dados. Útil para testes parametrizados.

3. Execução de Testes

• it(name, fn, timeout): Use para definir um caso de teste. É a unidade básica de teste no Jest.
• it.each(table)(name, fn, timeout): Use para executar o mesmo teste com diferentes conjuntos de dados. Facilita a criação de testes parametrizados.

4. Uso de Mocks

Em projetos Angular, evite mockar services internos, mesmo que eles se comuniquem com APIs externas. Em vez disso, foque em mockar a comunicação externa diretamente. Isso garante que a lógica interna do service seja testada de forma realista.

• Exemplo com HttpClient:

// users.service.ts
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';

export interface User {
	id: number;
	name: string;
}

@Injectable()
export class UsersService {
	constructor(private readonly http: HttpClient) {}

	public list(): Observable<User[]> {
		return this.http.get<User[]>('/api/users');
	}
}

Você pode mockar o HttpClient usando o HttpTestingController do Angular:

// users.service.spec.ts
import { TestBed } from '@angular/core/testing';
import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
import { UsersService, User } from './users.service';

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

	// Configuração antes de cada teste
	beforeEach(() => {
		TestBed.configureTestingModule({
			imports: [HttpClientTestingModule],
			providers: [UsersService],
		});

		service = TestBed.inject(UsersService);
		httpMock = TestBed.inject(HttpTestingController);
	});

	// Limpeza após cada teste
	afterEach(() => {
		httpMock.verify();
	});

	describle('list', () => {
		it('deve listar os usuários', () => {
			const resposta: User[] = [
				{ id: 1, name: 'João' },
				{ id: 2, name: 'Maria' },
			];

			service.list().subscribe((users) => {
				expect(users).toEqual(resposta);
			});

			const req = httpMock.expectOne('/api/users');
			expect(req.request.method).toBe('GET');
			req.flush(resposta);
		});
	});
});