Testes com Jest - Primeiros passos

Anderson Malheiro de Carvalho — Thu, 14 Jul 2022 21:43:45 +0000

Todo programador em algum momento da sua carreira se depara com o desafio de escrever testes para o seu código. Quando chega esse momento provavelmente você pensará: “Como diabos eu vou fazer isso?”. Sim, escrever testes não é uma tarefa fácil, principalmente quando você está começando nesse mundo.

A habilidade de testar códigos é uma das mais importantes quando você está procurando um novo emprego na área de desenvolvimento. Vai por mim, (digo isso por experiência própria), saber escrever testes vai te dar vários pontos a mais naquele processo seletivo que você tanto almeja passar.

Mas enfim, sem mais delongas, vamos ao que interessa. Provavelmente você está pensando: “Anderson, então você está me dizendo que eu preciso escrever mais código para testar meu código?”

Sim, é isso mesmo, você vai escrever código para testar o teu código. (Tem uma galera que é meio maluca e escreve testes para testar se os testes estão implementados 🤔).

Nessa série de posts vou tentar fazer uma introdução aos testes, focados nas linguagens Javascript e TypeScript com o framework Jest.

Na área de testes temos um conceito chamado Pirâmide de Testes, introduzido por Mike Cohn no seu livro Succeeding with Agile. Essa pirâmide agrupa os tipos de testes pela sua complexidade e custo, dos mais simples na base aos mais complexos e custosos no topo.

No base da pirâmide temos os testes unitários. Como da para imaginar, esses testes são focados em unidades pequenas do código como funções, classes ou componentes, verificando se essas unidades funcionam como deveriam, retornam os resultados esperados e assim por diante. No próximo nível temos os testes de serviço ou testes de integração, onde checamos como várias partes do sistema se comportam em conjunto, como vários componentes ou se uma API consegue obter dados de um banco. Por fim, na última camada temos os testes end-to-end ou E2E, onde testamos a aplicação como um todo, executando fluxos e checando se funcionam como deviam.

No nosso caso, vamos focar nos testes unitários por enquanto. Vamos lá!

Para configurar o seu projeto para utilizar o Jest como ferramenta de testes primeiramente precisamos adicioná-lo como dependência no projeto com o seguinte comando:

# com npm
npm i --save-dev jest

# ou com yarn
yarn add -D jest

O próximo passo é adicionar um script no package.json para executar nossos testes:

{
 ...
    "scripts": {
    "test": "jest"
  }
}

Pronto! Com isso já conseguimos executar nossos testes.

Tá, mas e agora, como escrevo um teste? 🤔

Basicamente o Jest entende como arquivos de teste arquivos com extensão .spec.js ou .test.js, mas por fins de organização e compatibilidade vamos utilizar a extensão .test.js pois normalmente os testes E2E feitos com Cypress utilizam a primeira forma por padrão.

Então vamos supor que você tenha uma função bem simples que soma 2 valores, assim:

// sum.js

function sum(a, b) {
  return a + b;
}

module.exports = sum;

Para implementar um teste, o Jest oferece basicamente dois métodos que permitem testar algo, que são o it() e o test(). Ambos funcionam da mesma forma e recebem os mesmos dois argumentos, uma string com a descrição do teste e uma função de callback com a implementação do teste. A única coisa que deve se levar em consideração na hora de escolher qual dos dois utilizar é a forma como você vai escrever a descrição do teste, para que fique mais legível e de acordo com o método escolhido. Por exemplo:

// na leitura ficaria: "deve somar dois números"
it("should sum two numbers", () => {...})

ou

// na leitura ficaria: "testa se essa função soma dois números"
test("if this function sum two numbers", () => {...})

Sacou? A diferença está basicamente na leitura do código. Você deve se atentar a escrever uma sentença que faça sentido na hora de ler junto com o método, pois os testes também podem ajudar no entendimento do funcionamento do sistema 😉.

Continuando, como vimos o método recebe uma descrição e uma função de callback como argumentos. Nessa função devemos implementar o nosso teste e, para um teste ser realmente um teste, nós devemos obviamente testar algo 😬. Se liga:

const sum = require("./sum");

it("should add 2 + 2 and return 4", () => {
  const result = sum(2, 2);
});

Se escrevemos só isso, nosso teste não checa nada, só chama a função e pronto. Para fazer realmente testar algo o Jest nos provê mais um método, chamado expect() que faz essas asserções pra nós. Sendo assim, nosso código deveria ficar desta forma:

const sum = require("./sum");

it("should add 2 + 2 and return 4", () => {
  const result = sum(2, 2);
  expect(result).toEqual(4);
});

O método expect() recebe um argumento que seria o valor ou expressão que você quer checar e oferece várias funções de verificação que são chamadas em cadeia e você deve utilizá-las para checar algo relacionado àquele valor. No nosso caso utilizamos a função toEqual() que recebe um argumento, o valor esperado, e checa se o parâmetro passado no expect é igual a ele.

E assim escrevemos o nosso primeiro teste. Bem simples não é?

É isso galera. Nos próximos posts vou trazer mais conceitos e dicas sobre o funcionamento do Jest ✌.

Testando datas mais facilmente com Jest

Anderson Malheiro de Carvalho — Thu, 30 Jun 2022 14:01:05 +0000

Quem desenvolve em Javascript | Typescript (e outras linguagens também 😜) sabe a dor de cabeça que é trabalhar com datas.

Uma coisa é certa, do juninho ao sênior em algum momento você vai precisar formatar uma data (e não vai saber 😬) ou vai ficar (muito) estressado porque o diabo da data que você criou está ficando com 3 horas a menos (kkk).

O primeiro problema é normal. Já o segundo se deve a forma como o Node trabalha com timezones. Nesse caso, ao criar um objeto Date com o comando new Date('2022-05-21') e tentar utilizar algum método como .toString(), o Node vai trazer esse valor acrescido (ou subtraído) do valor timezone da nossa máquina (normalmente aqui no Brasil seria de -3 horas). Por isso ocorre de criarmos uma data e ao tentarmos exibí-la, o valor retornado ser a data do dia anterior às 21h.

Exemplo:

const date = new Date('2022-05-21')

date.toString() // deveria retornar Sat May 21 2022 00:00:00
// mas retorna Fri May 20 2022 21:00:00

Para resolver esse problema na execução de testes com Jest e evitar programações alternativas 🤭, podemos fazer uma simples configuração que lhe salvará vários fios de cabelo.

Vamos lá. Primeiramente precisamos criar um arquivo de configuração global para o jest (não é o jest.config). O nome não importa mas nesse exemplo vamos chamá-lo de globalJestSetup.ts e ele terá uma simples função exportada como default.

Nesse arquivo estamos simplesmente dizendo para o Jest sempre utilizar a timezone UTC, assim ao trabalhar com datas não haverá o problema de termos o valor diferente dependendo da timezone.

Feito isso agora só precisamos adicionar esse arquivo nas configurações do Jest (no arquivo jest.config) como mostrado na imagem abaixo, utilizando o atributo globalSetup:

Lembrando que o nome que você deu ao arquivo deve ser igual ao usado na configuração do Jest.

E é basicamente isso. Agora ao fazer seus testes, as datas sempre terão o valor que você esperava hehe, independente do ambiente em que eles sejam executados.

Bônus:
Você pode adicionar um teste que verifica se essa configuração funcionou realmente:

DEV Community: Anderson Malheiro de Carvalho

Testes com Jest - Primeiros passos

Testando datas mais facilmente com Jest