Exercícios de Fixação – Aula 13 🧪
Exercício 01: Primeiro Teste
Instale o Vitest e o React Testing Library.
1. Crie um componente Titulo que apenas exibe um h1 com o texto "Olá Mundo".
2. Escreva um teste que verifica se o texto "Olá Mundo" está presente no documento.
Exercício 02: Testando Props
Crie um componente Card que recebe a prop nome.
1. Escreva um teste que passa um nome específico e verifica se ele é renderizado corretamente.
2. Use o screen.getByText com uma Expressão Regular (Regex) para ser insensível a maiúsculas/minúsculas.
🟡 Nível: Intermediário
Exercício 03: Testando Interação (Clique)
Crie um componente Contador.
1. O valor inicial deve ser 0.
2. Ao clicar no botão "Aumentar", o valor deve ir para 1.
3. Use o fireEvent.click ou userEvent.click para simular o clique no teste.
Exercício 04: Testando Estado Condicional
Crie um componente Mensagem que tem um botão de "Mostrar/Esconder".
1. Escreva um teste que verifica que a mensagem está oculta por padrão.
2. Simule o clique e verifique se a mensagem apareceu.
3. Verifique se ela some ao clicar novamente.