Índice:

Principais Stacks no mercado para testes unitários em Vue.js

Índice:

Apesar de algo antigo os testes unitários tem sido enfatizado cada vez mais pelos amantes da programação, ainda há uma certa resistência por parte de alguns desenvolvedores em implementá-los, porque bons testes são difíceis de ser escritos e podem até requerer uma refatoração do código. Por esse motivo esta prática pode parecer contra-produtivo e isso pode minar o objetivo de se desenvolver um bom programa de testes em seus projetos. Pensando nisso vamos desenvolver uma série de dois artigos voltados a testes unitários para Vue.js. Neste primeiro vamos passar por conceitos gerais e no segundo lançaremos alguns testes, discutindo a idéia geral por trás deles. Nosso objetivo não é exaurir o tema, o que seria muito impossível, mas gerar interesse e engajamento nesse tema. Ao término você será capaz de criar seus testes e saberá um caminho para trilhar.

Em termos de desenvolvimento ágil de software existem duas abordagem, o desenvolvimento orientado a testes e o desenvolvimento orientado ao comportamento. 

O desenvolvimento orientado a testes busca criar testes antes de escrever o código, assim os testes inicialmente devem falhar para que o programador reescreva o código até que o teste passe. Esse ciclo é conhecido como Red-Green-Refactor. A validação do código nesse caso ficaria para os testes, o que gerou uma crítica e promoveu o surgimento do desenvolvimento orientado ao comportamento do usuário. Nessa abordagem busca-se validar através do comportamento do usuário.

A grande vantagem não é simplesmente o desenvolvimento de testes, mas o fato de forçar o programador a pensar em design, regras de negócio e qualidade de código antes de sair escrevendo. Ainda se tem a garantia de que qualquer alteração no código não vá quebrar o código já escrito.

Escolha abordagem mais apropriada

Definida a abordagem utilizada no desenvolvimento deve-se buscar misturar testes unitários, de integração e de interface de usuário. Neste pool de testes a grande maioria será unitário, que são testes voltados para pequenas porções de código. Teste de integração devem ser o segundo mais comum e de interface de usuário os menos comuns. Isso acontece devido ao custo associado a cada tipo de testes. Testes unitários são baratos e rápido de se executar enquanto testes de interface de usuário são caros e lentos.

Todos estes princípios também são válidos quando falamos de frameworks, como Vue.js, React, Angular, entre outros. É totalmente possível testar componentes de forma unitária, integrada ou diretamente na interface. Nesse artigo focaremos especificamente no framework do Vue.js.

O Vue.js possui uma biblioteca padrão de testes, o Vue Test Utils. Com ele é possível escolher o suas bibliotecas de test runner, assertion e doubles. De forma breve, um test runner é o que vai ler seus arquivos de teste e executá-los. Bibliotecas de assertion são responsáveis por criar estados específicos para seus testes e doubles são usados quando precisamos substituir uma parte/objeto do software em produção por outro, estas partes muitas vezes são coisas de terceiros, como módulos, e a responsabilidade de testá-los não é nossa.

Há alguns conceitos que devemos saber antes de iniciar no mundo de testes, vamos a eles antes de escrever o código propriamente dito de forma simples e dinâmica, citando exemplos nos diversos frameworks.

Conceitos principais

Runners

Test runners são bibliotecas que pegarão seus testes, de acordo com a configuração definida por você, e os executaram. A saída (relatório) dos testes também é sua responsabilidade. São exemplos de Test Runners: Jest, Karma, Mocha, ADA, Cypress, entre outros.

Assertion

Bibliotecas de assertion são responsáveis por verificar se os estados criados pelos seus testes estão de acordo com o esperado. Um exemplo clássico de biblioteca de assertion em JavasScript é o ChaiJs, ele oferece as funções expect, should e assert. O NodeJs também possui um assert nativo.

Os dublês – test fakes, spies, stubs e mocks

Fakes e spies são funções que recebem argumentos, retornam valores, this e lançam exceções. Fakes tem implementações reais diferentes do código em produção, spies chamam as implementações reais que estão em produção. Stubs são funções (spies) com um comportamento pré-programado. Mocks são métodos falsos com comportamentos e retornos pré-programados.

Frameworks/Test Runners

Nessa seção passaremos pelos principais test runners, bibliotecas de assertion e doubles. Para tanto considere o seguinte componente como exemplo.

Jasmine [https://jasmine.github.io/]

Segundo a documentação Jasmine é um framework de desenvolvimento orientado ao comportamento para testes em Javascript (BDD). Vem com tudo que é necessário para testes, não requerendo nenhum pacote adicional.

AVA [https://github.com/avajs/ava]

AVA é um test runner para Node JS com uma API concisa, com intuito de se ter uma curva de aprendizagem pequena, e saída de erros detalhada. Tem uma proposta interessante, pois nasceu com a ideia de rodar testes de forma concorrente. Abraça novas features da linguagem e isolamento de processo.

Mocha JS [https://mochajs.org/]

Mocha é um framework de testes rico de Node.js e browser, fazendo testes assíncronos simples e divertidos. É um dos mais famosos e usados atualmente. Tem suporte para a instalação para bibliotecas de assertions, como o chai, expect, should, entre outros e também para doubles, como sinon.js. Na prática o mocha é algo pequeno que será personalizado de acordo com o usuário com outras bibliotecas.

JEST [https://jestjs.io/]

JEST se destaca por ser completo, vem com tudo necessário para testar. A suíte conta com uma incrível facilidade de mocar dados, funções ou módulos inteiros. É rápido e um dos mais usados atualmente no desenvolvimento das aplicações.

Conclusão

Vimos brevemente que é há um grande ecossistema e diversas possibilidades para testes unitários utilizando Vue.js, que trata a questão de forma flexível e nos deixa escolher um framework de teste do nosso gosto. Nos próximos artigos vamos demonstrar com alguns testes como aplicar cada ferramenta.

Publicado por:
Compartilhe:

Posts relacionados

métrica developer experience

Entender e otimizar a developer experience é crucial para o sucesso de qualquer projeto de software. Uma experiência positiva pode impulsionar a produtividade e a satisfação da equipe, elementos chave

developer experience

A developer experience, ou DX, é um conceito cada vez mais importante no cenário de desenvolvimento de software. Mas por que a experiência do desenvolvedor é tão importante? Como ela

estimativa de software

Estimar software vai muito além de apenas chutar prazos. É sobre sincronizar de forma inteligente os esforços de desenvolvimento, garantindo que cada recurso seja usado onde realmente importa. Pensando nisso,