Cobertura de código com testes em TypeScript: melhores ferramentas e métricas

Treinador Online de Python para Iniciantes

Aprenda Python facilmente sem sobrecarga teórica. Resolva tarefas práticas com verificação automática e escreva código diretamente no navegador.

Start Course

Cobertura de código com testes em TypeScript: como parar de adivinhar e começar a medir

\n\n

Imagine que você está montando um mecanismo complexo com muitas engrenagens. Você tem certeza de que montou tudo corretamente, mas ao apertar o botão "Iniciar", ouve-se um rangido e o mecanismo trava. Situação familiar? No mundo do desenvolvimento TypeScript, esses "mecanismos" são nossas aplicações. E a cobertura de código com testes é a montagem de controle que mostra quais peças verificamos e quais deixamos ao acaso.

\n\n

Muitos desenvolvedores veem as métricas de cobertura com ceticismo: "A busca por porcentagens é um mal", "Cobertura de 100% não garante ausência de bugs". E isso é verdade. Mas, como qualquer ferramenta, a cobertura de código pode ser útil ou prejudicial — tudo depende de como você a utiliza. Neste artigo, vamos analisar como medir corretamente a cobertura em TypeScript, quais ferramentas existem para isso e como não transformar as métricas em um fim em si mesmas.

\n\n

O que é cobertura de código e por que TypeScript não é exceção

\n\n

Cobertura de código (code coverage) é uma métrica que mostra qual parte do código-fonte foi executada durante os testes. Em TypeScript, que é compilado para JavaScript, a medição da cobertura ocorre no nível do código compilado, mas as ferramentas modernas conseguem exibir lindamente os resultados em termos do código TS original.

\n\n

As principais métricas de cobertura que você precisa conhecer:

\n\n
    \n
  • Line coverage — porcentagem de linhas de código que foram executadas pelo menos uma vez.
  • \n
  • Branch coverage — porcentagem de ramificações (if/else, switch, operadores ternários) que foram testadas.
  • \n
  • Function coverage — porcentagem de funções/métodos que foram chamados.
  • \n
  • Statement coverage — porcentagem de instruções individuais (operadores) no código.
  • \n
\n\n

Para projetos TypeScript, a branch coverage é especialmente importante, pois a tipagem estrita não salva de erros lógicos em condições. Você pode tipificar corretamente todas as variáveis, mas esquecer o caso em que o array está vazio e a função espera pelo menos um elemento.

\n\n

Ferramentas para medir cobertura em TypeScript

\n\n

1. Istanbul (nyc) — o avô de todas as coberturas

\n\n

Istanbul é a ferramenta mais popular para medir cobertura de código JavaScript e TypeScript. Ela funciona como um utilitário independente (através do pacote nyc) ou como um módulo embutido em frameworks de teste.

\n\n

Para começar a trabalhar com Istanbul em um projeto TypeScript, instale:

\n\n
npm install --save-dev nyc typescript ts-node
\n\n

Crie um arquivo .nycrc para configuração:

\n\n
{\n  "extends": "@istanbuljs/nyc-config-typescript",\n  "all": true,\n  "include": ["src/**/*.ts"],\n  "exclude": ["src/**/*.test.ts", "src/**/*.spec.ts"],\n  "reporter": ["text", "html", "lcov"],\n  "check-coverage": true,\n  "branches": 80,\n  "lines": 85,\n  "functions": 85,\n  "statements": 85\n}
\n\n

Execução de testes com cobertura:

\n\n
npx nyc mocha --require ts-node/register src/**/*.test.ts
\n\n

O Istanbul gera relatórios no console (text) e na forma de páginas HTML, onde o código coberto é destacado em verde e o não coberto em vermelho. Isso é muito visual.

\n\n

2. Jest — tudo em um

\n\n

Jest é o framework de teste mais popular para TypeScript. Ele já inclui uma ferramenta de cobertura embutida baseada no Istanbul. Você não precisa instalar nada adicional.

\n\n

Configuração básica em jest.config.ts:

\n\n
import type { Config } from 'jest';\n\nconst config: Config = {\n  preset: 'ts-jest',\n  testEnvironment: 'node',\n  collectCoverage: true,\n  coverageDirectory: 'coverage',\n  coverageReporters: ['text', 'html', 'lcov'],\n  collectCoverageFrom: [\n    'src/**/*.ts',\n    '!src/**/*.test.ts',\n    '!src/**/*.spec.ts',\n    '!src/types/**/*.ts'\n  ],\n  coverageThresho                

Blogs

Book Recommendations