React Testing Library - Testes da Pokédex

Descrição

Neste projeto, foram desenvolvidos testes automatizados para uma aplicação React previamente construída e configurada com Jest e React Testing Library. A aplicação implementa uma Pokédex completa, e o objetivo deste exercício foi criar testes robustos que garantissem a corretude dos componentes sem a necessidade de alterar a implementação original.

Funcionalidades Testadas

• Renderização correta dos componentes da Pokédex.
• Testes de navegação e alternância entre Pokémon.
• Simulação de eventos (cliques, navegação, filtros).
• Testes assíncronos com uso de findBy*.
• Validação de elementos, textos e estados esperados.
• Testes de inputs, filtros e detalhes dos Pokémon.
• Cobertura de componentes reutilizáveis e testáveis.

Demonstração do Projeto

Projeto focado de testes em React, sem interface interativa.

Tecnologias Utilizadas

• React: Biblioteca JavaScript para construção de interfaces visuais.
• Jest: Framework de testes para JavaScript.
• React Testing Library: Ferramenta para testes focada no comportamento do usuário.

Estrutura do Projeto

A estrutura principal do projeto segue o padrão:

/
├── src/
│   ├── components/
│   ├── pages/
│   ├── routes/
│   ├── services/
│   ├── types/
│   └── tests/
├── public/
│   └── 
├── index.html
├── package-lock.json
├── package.json
├── tsconfig.json
└── README.md

Contato

Willian Gonçalves | LinkedIn | Github | Portfólio | Email

Créditos

Este projeto avaliativo foi desenvolvido durante o curso de Desenvolvimento Web Full Stack da Trybe.

English Version

React Testing Library - Pokédex Tests

Description

This project focuses on writing automated tests for a fully implemented React Pokédex application. All tests were written using Jest and React Testing Library, ensuring component correctness without modifying the original implementation.

Features Tested

• Correct rendering of Pokédex components.
• User navigation and Pokémon switching.
• Event simulation (clicks, filters, navigation).
• Async flows tested with findBy* queries.
• Input and state validation.
• Reusable and refactor-safe test suite.

Project Demonstration

Project focused on testing in React, without an interactive interface.

Technologies Used

• React: UI library for building user interfaces.
• Jest: JavaScript testing framework.
• React Testing Library: Testing utilities focused on user behavior.

Project Structure

The main project structure follows the pattern:

    /
    ├── src/
    │   ├── components/
    │   ├── pages/
    │   ├── routes/
    │   ├── services/
    │   ├── types/
    │   └── tests/
    ├── public/
    │   └── 
    ├── index.html
    ├── package-lock.json
    ├── package.json
    ├── tsconfig.json
    └── README.md
    

Contact

Willian Gonçalves | LinkedIn | Github | Portfolio | Email

Credits

This project was developed as part of the Web Development Full Stack program at Trybe.