Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

[Dúvida] Posso fazer o render no beforeEach?

Olá.

Nesta e em outras aulas, quase sempre repetimos o mesmo render em cada suíte de testes. Algo como:

render(
    <RecoilRoot>
        {/* <AlgumComponente /> */}
    </RecoilRoot>
)

Gostaria de saber se, caso minha suíte de testes utilize o mesmo render em todos os testes, posso colocar esse render dentro do beforeEach()? Ou não seria uma boa prática? É que às vezes fica tão repetitivo, apesar de deixar mais fácil de ler o que o teste faz...

Obrigado.

1 resposta
solução!

E aí Matheus, tudo bem? Sua pergunta é muito boa!

Em geral, isso é mais uma preferência pessoal, mas a forma como o componente funciona influencia essa estratégia. Você pode precisar renderizar o seu componente em diferentes contextos (props, Redux mockado, provedor mockado...). Renderizar o componente no beforeEach pode ser mais rápido, mas torna mais difícil alterar as condições do teste.

Na minha experiência, como regra geral, componentes visuais são renderizados no próprio teste, porque quero testar diferentes conjuntos de props para cobrir todos os casos. Como são componentes "dumb", esses testes geralmente são rápidos. Isso é "teste de unidade real": testando a entrada e saída de uma função pura.

Para componentes smart/maiores, geralmente testo um grupo de componentes juntos (o que é mais um teste de integração), tenho que configurar integrações (gestão de estado, serviços http...) e os testes tendem a se assemelhar a cenários que você veria no Cypress, com interações do usuário. Para esses testes, renderizo uma vez no beforeEach e escrevo testes mais longos. Acabo com um tempo de execução de teste muito mais longo, mas com um alto nível de confiança (próximo do que E2E forneceria).

Isso é mais ou menos o que https://kentcdodds.com/blog/write-tests diz (como entendo), e até agora parece ser uma abordagem sólida.