javascript - official - Cobertura de código para Typescript

typescript official documentation

Question

Acabamos de comenzar un proyecto en Typescript y necesitamos obtener cifras de cobertura de códigos.

Nuestros proyectos de JavaScript existentes usan Instanbul en Grunt para cobertura. No estamos seguros de cómo replicar esto para TypeScript.

¿Existen herramientas para generar cobertura de código desde el propio código de TypeScript? O ejecutamos la herramienta de Estambul (o similar) contra el código JavaScript generado.

Answer 1

Actualización: agosto 2016

Ahora es posible ejecutar Estambul contra el código fuente de TypeScript usando Istanbul v1 (actualmente en la etapa alfa) junto con el nodo TypeScript .

Lo siguiente asume que está utilizando Mocha como marco de prueba y que todo el código de prueba está bajo el directorio de test/ estándar.

Primero, instale los paquetes requeridos:

npm install --save-dev mocha ts-node
npm install --save-dev --save-exact [email protected]

Luego incluye algo como lo siguiente en tu package.json :

"scripts": {
   "test": "istanbul cover -e .ts _mocha -- --compilers ts:ts-node/register"
}

Eso es. Ejecute la npm test y estará cubierto.

Vea mi proyecto de Deep Map para ver un ejemplo de trabajo en el que los archivos de prueba se guardan en el mismo directorio que el código fuente. Aquí hay una muestra de la salida HTML:

Answer 2

Dos años después de la publicación original de esta pregunta, ahora hay un remap-istanbul que parece prometedor.

Puede leer más sobre esto en Sitepen: Cobertura de código para TypeScript y otros lenguajes recopilados

Como escriben en el proyecto Github :

Un paquete que brinda la capacidad de reasignar la información de cobertura del código de Estambul a sus posiciones originales de origen en función de los mapas fuente de JavaScript v3.

Mientras leo la documentación, el proyecto tomará su cobertura generada por Estambul como entrada para la conversión basada en el mapa fuente. Esto parece un paso adicional, pero estoy seguro de que se beneficiará para que pueda deshacerse de esas líneas autogeneradas transpiladas en el informe de cobertura.

Creo que esto es exactamente lo que necesitarás.

Answer 3

Ejecutar la cobertura de código contra el javascript generado. Incluso puede alcanzar el 100% de cobertura diciéndole a Estambul que ignore esas molestas líneas imposibles de llamar que escribe a máquina.

Estambul honra los comentarios como / * istanbul ignore next * /, así que lo que hago es ejecutar una cadena de reemplazo en mi tarea truculenta que inyecta los comentarios de istanbul ignore en el código de envoltorio generado automáticamente que escribe TypeScript.

Aquí está la tarea trilla:

var gulp = require(''gulp''),
    replace = require(''gulp-replace''),
    ts = require(''gulp-typescript''),

gulp.task(''scripts'', function () {
    //compile typescript into javascript
    gulp.src(''src/**/*.ts'')
        .pipe(ts({
            declarationFiles: false,
            removeComments: false
        }))

        //write comments to tell istanbul to ignore the code inside the iife parameters
        .js.pipe(replace(/(}/)/()(.*/|/|.*;)/g, ''$1/* istanbul ignore next */$2''))

        //write comments to tell istanbul to ignore the extends code that typescript generates
        .pipe(replace(/(var __extends = /(this && this.__extends/))/g, ''$1/* istanbul ignore next */''))

        //write all of the compiled javascript files to a build folder so we can use them for tests and coverage
        .pipe(gulp.dest(''dist/src''))

        //...the rest of your build process
});

Aquí está el código generado.

var __extends = (this && this.__extends)/* istanbul ignore next */ || function (d, b) {
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
    function __() { this.constructor = d; }
    __.prototype = b.prototype;
    d.prototype = new __();
};
var animalApi;
(function (animalApi) {
    var dogs;
    (function (dogs) {
        var BlackLab = (function (_super) {
            __extends(BlackLab, _super);
            //class code...
        });
        dogs.BlackLab = BlackLab;
    })(/* istanbul ignore next */dogs = animalApi.dogs || (animalApi.dogs = {}));
})(/* istanbul ignore next */animalApi || (animalApi = {}));

Answer 4

En el equipo de TypeScript, solo usamos herramientas regulares de cobertura de código en el JavaScript compilado. Descubrimos que esto es más que suficiente, ya que, por lo general, para la cobertura del código, está considerando el% de cobertura total (que no cambia significativamente) o es profundo en el nivel de expresión (que tampoco cambia significativamente).

Si encuentra una herramienta que la soporte (aún no conozco ninguna), en teoría podría usar los mapas de origen emitidos por el compilador para asignar los datos de cobertura al código de TypeScript. Probablemente no valga la pena.

Answer 5

He creado una muestra para generar cobertura de código para archivos mecanografiados utilizando la cobertura de karma y el procesador de karma tipográfico.

https://github.com/nitinbhatia-dev/karma-typescript-coverage

Answer 6

Puedes usar Chutzpah para eso

Con Chutzpah puede ejecutar sus pruebas desde la línea de comandos e integrar sus pruebas con Visual Studio Test Explorer.

Chutzpah le permite decidir si desea ejecutar las pruebas desde archivos .ts, archivos .js, archivos .html o desde todos ellos.

Cuando se configura (en Visual Studio / Tools / Options / Chutzpah) para ejecutar pruebas desde archivos .ts, podrá analizar la cobertura del código de sus archivos .js generados, con un enlace entre el código JavaScript generado y el archivo .ts que lo generó.

Es realmente fácil trabajar en la cobertura de su código TypeScript, incluso siendo el código JavaScript el código real bajo prueba.

Puede instalar Chutzpah desde Visual Studio / Tools / Extensions y actualizaciones.

Puede encontrar here más detalles sobre la cobertura de códigos usando Chutzpah.