Написание модульных тестов на TypeScript

В этой истории мы будем использовать TypeScript для модульного тестирования вместе с популярными фреймворками: Mocha / Chai, Jasmine или Jest. Вы определились с фреймворком и хотите писать модульные тесты на TypeScript, отлично! Мы рассмотрим изменения, необходимые для поддержки модульных тестов в TypeScript. В противном случае можно обратиться к документации по каждой из этих библиотек. Написание тестовых примеров в TypeScript во многом аналогично написанию тестовых примеров в JavaScript. Самая важная часть - это настроить так, чтобы тестовые примеры, написанные на TypeScript, можно было выполнять с использованием этих библиотек.

Исходный код доступен по адресу https://github.com/chiragrupani/TSUnitTestsSetup. Он содержит настройки и примеры для каждого из этих фреймворков.

Настройка очень проста, мы бы установили соответствующие тестовые фреймворки и их типы. Мы бы использовали ts-node (для Mocha и jasmine) и ts-jest (для Jest), чтобы добавить поддержку TypeScript. Мы бы использовали nyc для покрытия кода.

Мы следовали бы соглашениям: поместите исходные файлы JS / TS в папку src, а файлы машинописного текста - в папку tests.

По сути, это установка пакетов npm для TypeScript, Test framework (например, Jasmine / Mocha / Jest) и определение тестового сценария, необходимого для выполнения тестовых случаев, как описано далее. Наряду с выбранным пакетом фреймворка модульного тестирования, необходимо также установить соответствующие типы. Для выполнения тестов TS в Node нам нужно указать Scripts для test в package.json. Файл package.json находится в корне проекта и создается при выполнении npm init.

Для отладки тестов TypeScript json, указанный в разделе «Отладка VS Code» ниже в истории, необходимо добавить в configurations in launch.json, который можно создать, перейдя в меню «Отладка» и затем «Добавить конфигурацию в VS Code». Ниже приведены команды npm, тестовый сценарий и рецепт отладки кода VS для каждого фреймворка:

Мокко / Чай

Команда установки NPM

npm i -D chai mocha nyc ts-node typescript
npm i -D @types/chai @types/mocha

Тестовый сценарий

"scripts": {
    "test": "mocha -r ts-node/register tests/**/*.test.ts",
    "coverage": "nyc -r lcov -e .ts -x \"*.test.ts\" npm run test"
}

Отладка кода VS

{
      "type": "node",
      "request": "launch",
      "name": "Mocha Current File",
      "program": "${workspaceFolder}/node_modules/mocha/bin/_mocha",
      "args": [
        "--no-timeouts",
        "--colors",
        "${file}",
        "--require",
        "ts-node/register"
      ],
      "console": "integratedTerminal",
      "sourceMaps": true,
      "internalConsoleOptions": "neverOpen"
}

Образец теста

describe('calculate', function() {
  it('add', function() {
    let result = Calculator.Sum(5, 2);
    expect(result).equal(7);
  }); 
});

Жасмин

Команда установки NPM

npm i -D jasmine nyc ts-node typescript
npm i -D @types/jasmine

Тестовый сценарий

"scripts": {
  "test": "ts-node node_modules/jasmine/bin/jasmine --config=jasmine.json",
"coverage": "nyc -r text -e .ts -x \"tests/*.test.ts\" npm run test"
}

jasmine.json в корневом каталоге указывает путь для тестов, как показано ниже:

{
   "spec_dir": "tests",
   "spec_files": ["**/*[tT]est.ts"]
}

Отладка кода VS

{
      "type": "node",
      "request": "launch",
      "name": "Jasmine Current File",
      "program": "${workspaceFolder}/node_modules/jasmine/bin/jasmine",
      "args": [
        "${workspaceFolder}/TSOutput/tests/${fileBasenameNoExtension}.js"
      ],
      "preLaunchTask": "tsc: build - tsconfig.json",     
      "outFiles": ["${workspaceFolder}/TSOutput/**/*.js"],
      "console": "integratedTerminal",
      "internalConsoleOptions": "neverOpen"
}

Образец теста

describe('calculate', function() {
  it('add', function() {
    let result = Calculator.Sum(5, 2);
    expect(result).toBe(7);
  });
});

Шутка

Команда установки NPM

npm i -D jest ts-jest typescript
npm i -D @types/jest

Тестовый сценарий

"scripts": {
  "test": "jest",
  "coverage": "jest --coverage"
}

Отладка кода VS

{
      "type": "node",
      "request": "launch",
      "name": "Jest Current File",
      "program": "${workspaceFolder}/node_modules/.bin/jest",
      "args": ["${relativeFile}"],
      "console": "integratedTerminal",
      "internalConsoleOptions": "neverOpen",
      "windows": {
        "program": "${workspaceFolder}/node_modules/jest/bin/jest"
      }
}

Примечание. Тестовый сценарий здесь просто «шутка». Чтобы использовать TypeScript, мы определяем преобразование в новом файле конфигурации jest.config.js в том месте, где находится package.json resides

module.exports = {
  transform: {'^.+\\.ts?$': 'ts-jest'},
  testEnvironment: 'node',
  testRegex: '/tests/.*\\.(test|spec)?\\.(ts|tsx)$',
  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node']
};

Ключ testRegex, где мы сопоставляем файлы ts / tsx, заканчивающиеся на test / spec в папке tests. Он будет обработан ts-jest. Мы используем «узел» в «testEnvironment», поскольку мы выполняем тесты на узле (что делает его быстрее), иначе мы бы использовали значение «jsdom» по умолчанию.

Образец теста

describe('calculate', function() {
  it('add', function() {
    let result = Calculator.Sum(5, 2);
    expect(result).toBe(7);   
});

Это все, что нужно для настройки, тесты можно запустить, выполнив команду:

npm t

npm t - это ярлык для npm run test и получения результатов покрытия:

npm run coverage

Добавление тестового набора

Прежде чем добавлять модульные тесты, давайте сначала разберемся с Suite и Specs. Спецификация - это каждый отдельный тестовый пример, содержащий одно или несколько утверждений. Тестовый пример проходит, когда его ожидания верны. Обычно он определяется (на основе тестовой среды) с помощью itfunctions. он содержит два параметра - один - это имя тестового примера, а другая функция, содержащая утверждение. Suite представляет собой группу связанных спецификаций и обычно определяется с помощью describe, аналогичного it, и содержит множество своих функций. В приведенном выше примере тестового примера показано, как он определяется для каждой платформы.

Выполнение некоторого кода до (инициализация теста) и после (очистка) каждого тестового примера, имитация внешних объектов / служб и т. Д. Зависит от фреймворка, документация по фреймворку будет содержать необходимую информацию.

Спасибо за чтение, не стесняйтесь поделиться и нажать кнопку хлопка, если вы сочтете это полезным, и, пожалуйста, добавьте комментарии, если вам нужна дополнительная помощь в настройке тестовых примеров TypeScript или если я что-то пропустил.