Ir para o conteúdo principal

Biblioteca de Testes para Angular

[Tradução Beta Não Oficial]

Esta página foi traduzida por PageTurner AI (beta). Não é oficialmente endossada pelo projeto. Encontrou um erro? Reportar problema →

Angular Testing Library é construída sobre a DOM Testing Library adicionando APIs para trabalhar com componentes Angular. A partir da versão 17 da ATL, você também precisa instalar o @testing-library/dom:

npm install --save-dev @testing-library/angular @testing-library/dom

Ou você pode usar o comando ng add. Isso configura seu projeto para usar a Angular Testing Library, incluindo também a instalação do @testing-library/dom.

ng add @testing-library/angular

O problema​

Você quer escrever testes sustentáveis para seus componentes Angular. Como parte desse objetivo, você quer que seus testes evitem detalhes de implementação dos seus componentes, focando em proporcionar a confiança necessária para sua finalidade. Além disso, você quer que sua base de testes seja sustentável a longo prazo, para que refatorações dos componentes (mudanças na implementação, não na funcionalidade) não quebrem seus testes e não atrasem você e sua equipe.

A solução​

A Angular Testing Library é uma solução extremamente leve para testar componentes Angular. Ela fornece funções utilitárias simples sobre a DOM Testing Library de forma a incentivar melhores práticas de teste. Seu princípio orientador principal é:

Quanto mais seus testes se assemelharem à forma como seu software é usado, mais confiança eles podem te dar.

Em vez de lidar com instâncias de componentes Angular renderizados, seus testes trabalharão com nós DOM reais. Os utilitários desta biblioteca facilitam consultar o DOM da mesma forma que um usuário faria: encontrar elementos de formulário pelo texto do rótulo (como um usuário faria), localizar links e botões pelo seu texto (como um usuário faria). Ela também expõe uma forma recomendada de encontrar elementos por data-testid como uma "saída de emergência" para elementos onde o conteúdo textual e o rótulo não fazem sentido ou não são práticos.

Esta biblioteca incentiva seus aplicativos a serem mais acessíveis e permite que seus testes se aproximem de como um usuário utilizaria seus componentes, o que proporciona mais confiança de que seu aplicativo funcionará quando um usuário real o utilizar.

A Angular Testing Library:

  • Reexporta as funções utilitárias query e fireEvent da DOM Testing Library

  • Encapsula as funções fireEvent do seu componente para chamar automaticamente detectChanges() após um evento ocorrer

  • É independente de framework de testes, funcionando em qualquer framework