Iniciando com Jest: Parte 1 - Configuração

Esse é o primeiro artigo de uma série em que abordaremos como testar o nosso código javascript utilizando a biblioteca Jest. Nesse primeiro artigo prepararemos o nosso ambiente, desde a instalação do Nodejs até a configuração do Jest em nosso projeto.

  • Iniciando com Jest: Parte 1 - Configuração
  • Iniciando com Jest: Parte 2 - Primeiro teste (wip)

Antes de botar a mão na massa, falaremos um pouco sobre o Jest e porque utilizá-lo.

Jest é uma biblioteca desenvolvida pelo Facebook que fornece uma estrutura completa para desenvolvimento de testes. Se você já teve a oportunidade de fazer testes javascript, sabe o quão trabalhoso é configurar uma stack de testes no seu projeto. Podemos escolher entre diversas opções, algumas das bibliotecas mais conhecidas são: Karma, Jasmine, Instalbul, Chai, Mocha, Sinon, etc…

Esse foi um dos principais motivos pelo qual o Jest se popularizou, ele nos permite executar testes sem configurar nada. Por padrão o Jest executa todos os arquivos *.spec.js, *.spec.jsx, *.test.js e *.test.jsx e todos os arquivos *.js e *.jsx dentro de pastas __tests__.

Além disso, nós também não precisamos de integrações com outras bibliotecas para criar mocks, spies e coverage de código. Tudo é disponibilizado por ele!

Dentre essas vantagens, não podemos esquecer dos testes de snapshots.

O Jest nos permite gerar um arquivo que representa o estado atual de um determinado componente ou estrutura de dados e realiza a comparação do estado novo com o gerado previamente. Caso ocorra alguma alteração nesse arquivo ele nos avisará e mostrará o que foi alterado.


Agora que já sabemos os pontos positivos, chegou o grande momento!

Executaremos alguns comandos nessa etapa de configuração. Criei o snippet abaixo com todos os comandos utilizados para facilitar o acompanhamento:

O primeiro requisito é instalar o Nodejs em nossa máquina. Para isso, basta acessar o site https://nodejs.org/en/ e escolher a opção de download de acordo com o seu sistema operacional. No meu caso, estou utilizando Ubuntu 18.04.

Para verificar se tudo foi instalado corretamente, abra o seu terminal/prompt e execute os comandos abaixo:

Com o Nodejs instalado, podemos criar o nosso projeto. Como utilizaremos esse projeto nos próximos artigos, irei versionar o código aqui.

A primeira coisa a fazer na criação de um projeto é definir o package.json, assim podemos configurar suas dependências. Para isso, basta executar o comando npm init.

Agora que já criamos o nosso package.json, instalaremos o Jest como dependência de desenvolvimento.

NodeJs configurado na máquina, projeto criado e Jest instalado… Falta pouco! Nessa última etapa, nós criaremos em nosso package.json scripts para executar o Jest.

Nós criaremos três scripts test, test:watch e test:coverage. O script test será responsável por chamar o jest sem passar argumentos, já o script test:watch faz com que o jest fique escutando por alterações em nossos arquivos e por fim, o test:coverage executará todos os nossos testes gerando um relatório detalhado de quais arquivos estão cobertos de testes.

Configurar scripts é uma tarefa bem simples, basta abrir o nosso package.json, criar a seção “scripts”(caso não exista), escrever o nome do script e quais instruções serão executadas quando o script for chamado.

Para concluir essa primeira etapa, chamaremos o script test para verificarmos se o Jest está configurado corretamente em nosso projeto.

Assim que executamos esse comando, o Jest nos informa que não encontrou testes e exibe a configuração padrão dele. A configuração testMatch exibe uma regex utilizada para encontrar os arquivos que são testes e a testPathIgnorePatterns nos diz quais patterns são ignorados na hora de executar os testes.

Espero que vocês tenham gostado dessa primeira etapa e percebido o quão fácil é aplicar o Jest em um projeto. No próximo artigo nós criaremos o primeiro teste com Jest e desbravaremos as funções disponibilizadas por sua API.