Introdução
Nos últimos anos, a técnica de codificação de desenvolvimento web mudou e os desenvolvedores começaram a adotar várias estruturas JavaScript devido aos seus recursos versáteis em vez de linguagens de programação convencionais como Java e PHP. A próxima grande questão era como testar o código escrito nessas novas estruturas.
Você sabe qual é a melhor estrutura de teste de JavaScript? É quase impossível dizer que uma determinada ferramenta de teste é a melhor, mas alguns nomes como JEST, Mocha, Karma e AVA costumam ser considerados os de melhor desempenho.
A maioria dos testadores não conhece o poder do AVA. Este artigo irá explicar os fundamentos do AVA e ajudá-lo a entender seus diferentes recursos, incluindo como criar um arquivo de caso de teste. Isso pode ajudá-lo a escolher a ferramenta certa para seu caso de teste específico.
Além do AVA, também falarei sobre linting e XO, uma nova ferramenta de linting. Este artigo deve dar uma ideia melhor sobre o que é linting e como ele é benéfico durante o teste.
AVA
AVA é um executor de teste de código aberto para Node.js que torna o teste de código fácil e conveniente e os casos de teste mais estáveis , legível e organizado. Foi desenvolvido por Sindre Sorhus e Kevin Mårtensson em 2014.
O AVA fornece saída de erro detalhada para casos de teste com um recurso chamado “Magic assert”, que trata os erros e os exibe de uma maneira simples e informativa. Ele também oferece suporte a novos recursos de linguagem. Ele dá controle total ao testador e sua sintaxe simples o torna popular em relação a outras ferramentas na mesma categoria.
Recursos do AVA
Alguns dos melhores recursos do AVA estão listados abaixo.
Teste paralelo em execução
O AVA executa casos de teste em paralelo por padrão, o que leva menos tempo em comparação com outras ferramentas. Executar em paralelo força o testador a garantir que todos os testes sejam completamente independentes uns dos outros, o que é sempre uma boa prática.
Apenas um
Outro grande recurso do AVA é que você tem a opção de executar apenas o teste no qual está trabalhando. Isso é útil se você tiver vários casos de teste com falha e quiser corrigi-los um por um.
Modo de observação
O AVA é capaz de identificar os arquivos de teste afetados e apenas executar novamente os testes nesses arquivos específicos. Isso é possível devido ao recurso “modo de relógio”, que é fantástico. Se você alterar um arquivo de caso de teste, ele executará novamente apenas esse arquivo. Se você alterar um arquivo de origem, ele executará novamente todos os casos de teste que dependem dele.
Suporte a plug-ins
O AVA contém seu próprio plug-in, projetado para ser flexível e configurável para diferentes casos de uso.
Função de isolamento do processo
Para cada arquivo de teste, o AVA inicia um novo processo Node.js, o que significa que você pode modificar com segurança o estado global sem afetar testes não relacionados. Ele também pode executar vários arquivos de teste, cada um em seu próprio processo.
Suporte observável
O suporte observável é um tipo de dados que pode ser usado para modelar fontes de dados baseadas em push, como soquetes, eventos DOM e intervalos de cronômetro, entre outros. É melhor usado se você quiser emitir vários valores de dados em fluxo. Ele pode ser composto com uma combinação de ordem superior e não começa a emitir dados até que um observador se inscreva.
Plugin do editor
O AVA tem vários plug-ins para se conectar a diferentes editores de texto, como Sublime, Atom e VS Code.
Desvantagens do AVA
Como toda ferramenta, o AVA também tem algumas desvantagens.
Uma das principais desvantagens é que o AVA não oferece suporte a testes de navegador, o que pode limitar seus casos de uso. Felizmente, a equipe de desenvolvimento do AVA está trabalhando para resolver esse problema.
O AVA também não tem nenhum suporte embutido para o DOM. E por ser uma ferramenta relativamente nova, o Ava ainda tem muitos problemas em aberto.
A comunidade ainda está crescendo, mas permanece pequena, então os documentos ou tutoriais são menos comparados a outras estruturas de teste.
Instalando AVA
O processo de instalação do AVA é rápido, bastando seguir alguns passos simples. Antes de começar, você deve instalar o Node.js para instalar o AVA.
Em seguida, insira este código no prompt de comando:
mkdir ava_folder cd ava_folder npm init ava
Isso criará uma pasta chamada ava_folder . A próxima linha de código cd ava_folder se moverá para dentro dessa pasta, e o último comando instalará o AVA. Haverá alguns novos arquivos na pasta.
Para verificar a instalação, abra o arquivo package.json , e se ele contiver o código abaixo (exceto a versão), tudo deve ser definido:
Se você preferir usar yarn, siga o comando abaixo:
yarn add ava--dev
Você também pode instalar o AVA manualmente com o seguinte comando:
npm install--save-dev ava
Crie seu arquivo de teste
Para criar o arquivo de teste, abra o diretório raiz onde o AVA está instalado e crie um arquivo com o nome SampleTest.js .
Escreva o código abaixo no arquivo apenas para fins de teste:
const SampleTest=require ('ava'); SampleTest ('foo', t=> { t.pass (); } );
SampleTest ('bar', assíncrono t=> { const bar=Promise.resolve ('bar'); t.is (barra de espera,'bar'); });
Execute o arquivo de teste
Uma vez que o arquivo de teste é criado, a próxima questão é como executá-los. Você pode usar o comando abaixo para executar:
npm SampleTest
Como mencionado antes, o AVA possui um modo de relógio inteligente. Para executar testes com o modo de observação habilitado, use o comando abaixo:
npx ava--watch
Passando um argumento para arquivos de teste
O AVA oferece uma opção para passar argumentos de linha de comando para arquivos de teste.
Você precisa de dois terminadores de argumento - ao invocar AVA por meio do script npm:
npm SampleTest----hello world
XO
XO é uma ferramenta de linting poderosa. Se você não está familiarizado com as ferramentas de linting, não se preocupe, vou explicá-las aqui.
Linting ajuda você a melhorar seu código analisando o código-fonte para sinalizar erros de programação, bugs, erros estilísticos e construções suspeitas. Linters podem tornar você e seu código mais produtivos, economizando tempo e dinheiro.
Recursos do XO
XO é uma das escolhas mais populares entre os linters devido aos seus muitos recursos. Ele evita e controla erros bobos de sintaxe ao escrever o código JavaScript. Adicionar XO à pasta do projeto é uma tarefa simples e pode ser realizada executando um comando de linha única.
Um dos melhores recursos é que ele corrige muitos problemas automaticamente com o comando simples xo--fix .
Outra grande qualidade do XO é que ele suporta diferentes plug-ins. Alguns dos plug-ins do editor incluem Sublime Text, Atom, Vim, TextMate 2, VSCode, Emacs e WebStorm. O XO também oferece suporte a plug-ins ESLint como unicorn , import , ava , node e muitos mais.
Arquivos TypeScript (.ts,.d.ts e.tsx) são suportados pelo XO. Suponha que você tenha vários arquivos para configurar-não há necessidade de especificar caminhos de arquivo para lint, porque o XO lints todos os arquivos.js automaticamente (exceto caminhos comumente ignorados).
XO tem grande suporte no lado do banco de dados. Ele pode gerar código Go para um esquema de banco de dados ou uma consulta personalizada. É uma ferramenta de linha de comando e funciona usando metadados e consultas de introspecção SQL para identificar os tipos e relacionamentos dentro de um esquema e aplicar um conjunto padrão de modelos Go aos relacionamentos descobertos.
Atualmente, ele pode gerar tipos para tabelas, procedimentos armazenados, enums e consultas SQL personalizadas para diferentes bancos de dados, como PostgreSQL, Oracle, MySQL, Microsoft SQL Server e SQLite3.
Instalando o XO
O XO requer Node.js, por isso é recomendado instalar o Node.js antes de instalar o XO.
Para instalar por meio do console, use o comando abaixo:
instalação npm-global xo
Você também pode instalar o XO manualmente usando o comando abaixo no prompt de comando:
npm init xo
Depois de instalado em um diretório específico, encontre o arquivo package.json. Se o arquivo contiver o mesmo código ilustrado abaixo (exceto a versão), a instalação foi bem-sucedida:
Teste de código usando XO
Nesta seção, você aprenderá como testar o código Node.js usando o XO. Para fins de demonstração, escreveremos casos de teste para um aplicativo que adiciona dois números juntos e usaremos o plug-in do Visual Studio para executar o teste.
Primeiro, crie uma pasta para escrever o código. Na captura de tela abaixo, você pode ver que criei uma pasta com o nome TESTSAMPLEXO .
Execute o comando abaixo no terminal do Visual Studio:
Npm init-y
Depois que o comando acima é executado, o arquivo package.json deve ser semelhante a esta captura de tela:
Agora crie um arquivo de teste como sum.js na mesma pasta, criada nas etapas anteriores. Deve ser assim:
A próxima etapa é adicionar o XO ao diretório ( TESTSAMPLEXO ) . Para fazer isso, execute o seguinte comando:
npm init xo
Mais um arquivo precisa ser criado com o nome sum.text.js (no meu caso) no mesmo diretório. Escreva os casos de teste conforme mostrado abaixo na imagem:
Finalmente, é hora de executar o comando de teste. Use a sintaxe abaixo para executar o caso de teste:
teste
npm
Se ocorrer um erro durante a execução do comando, limpe-os um por um de acordo com as instruções mostradas.
Cada vez depois de limpar o erro, você deve executar o comando npm test no prompt de comando ou terminal, e a saída do teste será mostrada como abaixo:
Conclusão
Neste artigo, você aprendeu sobre AVA, uma ferramenta de teste para JavaScript, e XO, uma ferramenta de linting. Agora você está familiarizado com o poder dessas ferramentas.
XO é uma ferramenta útil para melhorar e refinar o código e detectar bugs antes que se tornem problemas maiores.
Conforme explicado anteriormente, vale a pena tentar o AVA. Combina a facilidade de uso do Jasmine com a simplicidade da fita. Ele oferece suporte a aplicativos JavaScript front-end e back-end e pode tornar o teste de código JS muito fácil.
A postagem Teste de código e linting usando AVA e O XO apareceu primeiro no LogRocket Blog .
