Подтвердить что ты не робот

Покрытие кода для Typescript

Мы только что начали проект в Typescript, и нам нужно получить цифры покрытия кода.

Наши существующие проекты JavaScript используют Instanbul в Grunt для покрытия. Мы не уверены, как это сделать для TypeScript.

Существуют ли какие-либо инструменты для генерации покрытия кода из самого кода Typescript? Или мы запускаем инструмент Istanbul (или аналогичный) против генерируемого кода JavaScript.

4b9b3361

Ответ 1

Вы можете использовать Chutzpah для этого

С помощью Chutzpah вы можете запускать тесты из командной строки и интегрировать свои тесты с помощью Проводника по тестированию Visual Studio.

Chutzpah позволяет вам решить, хотите ли вы запускать тесты из .ts файлов, файлов .js,.html файлов или из всех них.

Когда вы устанавливаете (в Visual Studio/Tools/Options/Chutzpah) для запуска тестов из .ts файлов, вы сможете анализировать покрытие кода ваших сгенерированных файлов .js со ссылкой между сгенерированным кодом JavaScript и. ts, который сгенерировал его.

Это действительно упрощает работу с вашим кодом покрытия TypeScript, даже будучи кодом JavaScript, который проверяет реальный код.

Вы можете установить Chutzpah из Visual Studio/Tools/Extensions и обновлений.

Вы можете найти здесь более подробную информацию о покрытии кода с помощью Chutzpah.

Ответ 2

В команде TypeScript мы просто используем обычные инструменты для покрытия кода на скомпилированном JavaScript. Мы обнаружили, что это более чем достаточно, так как обычно для покрытия кода вы смотрите на общий охват% (который не изменяется значительно) или глубоко погружается на уровне выражения (что также существенно не изменяется).

Если вы нашли инструмент, который его поддерживал (пока я еще не знаю), теоретически можно использовать исходные карты, испускаемые компилятором, чтобы отобразить данные покрытия обратно в код TypeScript. Вероятно, это не стоит того.

Ответ 3

Обновление: август 2016 года

Теперь можно запустить Стамбул с исходным кодом TypeScript, используя Istanbul v1 (в настоящее время в альфа-стадии) вместе с TypeScript Node.

Далее предполагается, что вы используете Mocha в качестве тестовой среды и что весь тестовый код находится в стандартном каталоге test/.

Сначала установите требуемые пакеты:

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

Затем включите что-то вроде следующего в package.json:

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

Что это. Запустите npm test, и вы будете защищены.

Смотрите проект Deep Map для рабочего примера, в котором тестовые файлы хранятся в том же каталоге, что и исходный код. Ниже приведен пример вывода HTML:

Глубокое покрытие карты

Ответ 4

Спустя два года после того, как этот вопрос был опубликован, теперь есть remap-istanbul, который кажется многообещающим.

вы можете узнать больше об этом в Sitepen: Покрытие кода для TypeScript и других передаваемых языков

Как они пишут в проекте Github:

Пакет, который предоставляет возможность переназначения кода в Стамбуле информация к исходным позициям исходного кода на основе JavaScript Source Maps v3.

Когда я прочитаю документацию, проект возьмет ваше покрытие, основанное на istanbul, как вход для преобразования на основе исходной карты. Это звучит как дополнительный шаг, но я уверен, что это принесет пользу, чтобы вы могли избавиться от тех, которые были сгенерированы автогенерированными строками в отчете о покрытии.

Я считаю, что это именно то, что вам нужно.

Ответ 5

Запустите код покрытия сгенерированного javascript. Вы даже можете нанести 100% -ый охват, сообщив Стамбулу, чтобы игнорировать эти надоедливые строки, невозможные для вызова, которые typescript пишет.

Стамбул почитает такие комментарии, как /* istanbul ignore next */, поэтому я выполняю замену строки в моей задаче gulp, которая вводит комментарии istanbul игнорировать в автоматически сгенерированный код оболочки, который typescript пишет.

Вот задача gulp:

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
});

Вот сгенерированный код.

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 = {}));