13º Projeto: React Testing Library

---

Project Description • Learning • Requirements • Stacks • How to run the application

---

Descrição do Projeto • Aprendizado • Requisitos • Tecnologias Utilizadas • Rodar a Aplicação

---

Project Description

I developed this project during my learning period at Trybe, where I wrote tests using the RTL library. The React application was developed by Trybe, and I focused on creating test code for this application.

In this project, I learned and put into practice:

• Using React-Testing-Library selectors (queries) in automated tests.
• Simulating events with React-Testing-Library in automated tests.
• Testing asynchronous logical flows with React-Testing-Library.
• Creating API mocks using fetch.
• Testing inputs.

Components to be tested in this project:

• ✅ App.js
• ✅ About.js
• ✅ FavoritePokemons.js
• ✅ NotFound.js
• ✅ Pokedex.js
• ✅ Pokemon.js
• ❌ PokemonDetails.js

Stacks

FrontEnd:

• RTL
• Jest

How to run the application?

• Clone the repository:
  git clone git@github.com:prtpj1/projeto-react-testing-library.git
• Access the project folder:
  cd projeto-react-testing-library
• Install the dependencies:
  npm install
• Run the tests:
  npm test
  Or, if you want to test a specific file:
  npm test ./src/tests/<filename>.test.js

_*NOTE: If you encounter any difficulties with the instructions and would like to provide feedback, feel free to send me a message.*_

---

Descrição do Projeto

Fiz este projeto durante meu período de aprendizagem na Trybe onde desenvolvi testes utilizando a biblioteca RTL. A aplicação em React foi desenvolvida pelo pessoal da Trybe. Eu apenas desenvolvi o codigo para testar esta aplicação.

Nesse projeto, aprendi e coloquei em prática:

• Utilizar os seletores (queries) da React-Testing-Library em testes automatizados.
• Simular eventos com a React-Testing-Library em testes automatizados.
• Testar fluxos lógicos assíncronos com a React-Testing-Library.
• Escrever testes que permitam a refatoração da estrutura dos componentes da aplicação sem necessidade de serem alterados.
• Criar mocks de APIs utilizando fetch.
• Testar inputs.

Componentes a serem testados neste projeto:

• ✅ App.js
• ✅ About.js
• ✅ FavoritePokemons.js
• ✅ NotFound.js
• ✅ Pokedex.js
• ✅ Pokemon.js
• ❌ PokemonDetails.js

Tecnologias Utilizadas

FrontEnd:

• RTL
• Jest

Como rodar a aplicação?

• Clone o repositório:
  git clone git@github.com:prtpj1/projeto-react-testing-library.git
• Acesse a pasta do projeto:
  cd projeto-react-testing-library
• Instale as dependências:
  npm install
• Rode os testes:
  npm test
  Ou se desejar testar um arquivo especifico:
  npm test ./src/tests/<nome do arquivo>.test.js

_*OBS: Se tiver alguma dificuldade com as instruções e quiser dar um feedback me mande uma mensagem*_