Como você testa componentes React, e o que você deliberadamente não testa?

Teste comportamento pela mesma superfície que o usuário tem: renderize o componente, consulte por role e nome acessível, interaja, e verifique o que aparece. Cubra a lógica que pode de fato quebrar, como renderização condicional, estados de erro e de vazio, e hooks customizados. Não teste detalhes de implementação como estado interno, prop drilling, ou que um componente filho foi chamado; esses testes quebram a cada refatoração e não pegam nada.

Minha regra é que um teste só deve falhar quando o comportamento visível para o usuário muda. Então eu renderizo o componente com a Testing Library, consulto por role e nome acessível, clico e digito como uma pessoa faria, e verifico o que está na tela. Isso tem um efeito colateral bom: se eu não consigo consultar por role, normalmente o markup tem um problema de acessibilidade. Para a rede eu intercepto na camada HTTP em vez de mockar minha própria camada de dados, porque mockar meu próprio módulo significa que eu estou testando o meu mock. A maior parte do valor vem da camada do meio, uma feature inteira renderizada com os filhos reais e um servidor falso, em vez de um teste por componente. O que eu não testo é estado interno, que um helper foi chamado, arquivos de snapshot de uma árvore inteira, ou estilo. Todos eles quebram em refatorações inofensivas e passam enquanto algo está genuinamente quebrado. Aí um número pequeno de testes ponta a ponta cobre os fluxos que o negócio não pode perder, como cadastro e checkout, e é isso.