Ir para o conteúdo principal

Introdução

[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 →

A família de pacotes @testing-library ajuda você a testar componentes de UI de forma centrada no usuário.

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

O problema

Você quer escrever testes mantíveis que ofereçam alta confiança de que seus componentes funcionam para seus usuários. Como parte desse objetivo, seus testes devem evitar detalhes de implementação para que refatorações (mudanças na implementação sem alterar funcionalidades) não quebrem seus testes nem atrasem você e sua equipe.

A solução

A biblioteca principal, DOM Testing Library, é uma solução leve para testar páginas web consultando e interagindo com nós DOM (seja simulados com JSDOM/Jest ou em navegadores reais). Suas principais utilidades envolvem consultar o DOM de modo similar a como usuários encontram elementos na página. Assim, a biblioteca ajuda a garantir que seus testes inspirem confiança de que sua aplicação funcionará quando utilizada por usuários reais.

A biblioteca principal foi adaptada para oferecer APIs ergonômicas em diversos frameworks, incluindo React, Angular e Vue. Há também um plugin para usar queries da testing-library em testes end-to-end com Cypress e uma implementação para React Native.

O que esta biblioteca não é

  1. Um test runner ou framework

  2. Específica para um framework de testes

DOM Testing Library funciona com qualquer ambiente que forneça APIs DOM, como Jest, Mocha + JSDOM ou navegadores reais.

O que você deve evitar com a Testing Library

A Testing Library encoraja você a evitar testar detalhes de implementação como os aspectos internos de um componente que você está testando (embora ainda seja possível). Os Princípios Orientadores desta biblioteca enfatizam a importância de focar em testes que se assemelhem de perto à forma como os usuários interagem com suas páginas web.

Você pode querer evitar estes detalhes de implementação:

  1. Estado interno de um componente

  2. Métodos internos de um componente

  3. Métodos de ciclo de vida de um componente

  4. Componentes filhos