Рубрики
Без рубрики

Использование издеваний для тестирования в JavaScript с шумом

Quest – популярный, открытый тестовой основой для JavaScript. В этом руководстве мы будем использовать шутки, чтобы издеваться от HTTP-вызовов в наших тестах через пример сценария.

Автор оригинала: Allan Mogusu.

Вступление

Quest – популярный, открытый тестовой основой для JavaScript. Мы можем использовать jest для создания издеваний в нашем тесте – объекты, которые заменяют реальные объекты в наш код, пока оно тестируется.

В нашей предыдущей серии по методикам тестирования подразделения с использованием Sinon.js мы освещали, как мы можем использовать Sinon.js в приложения STUB, SPY и MOCK Node.js – особенно HTTP-вызовы.

В этой серии мы собираемся покрывать методы тестирования подразделения в Node.js, используя Jest Отказ Whest был создан Facebook и хорошо интегрирует со многими библиотеками JavaScript и Frameworks, таких как React, Angular и Vue, чтобы назвать несколько. Он имеет особое внимание простоте и производительности.

В этой статье мы рассмотрим, какие издеватели, то сосредоточены на том, как мы можем настроить шутку для приложения Node.js, чтобы издеваться на вызов HTTP в нашем тесте. Затем мы сравним, как мы используем jest и sinon, чтобы создавать издевательства для наших программ.

Что такое издевательства?

В тестировании подразделения издеваются, чтобы издевались нам возможность заглушать функциональность, предоставленные зависимостью, и средство, чтобы наблюдать, как наш код взаимодействует с зависимостью. Макеты особенно полезны, когда это дорого или нецелесообразно включать в себя зависимость непосредственно в наши тесты, например, в случаях, когда ваш код делает HTTP-вызовы на API или взаимодействуют с слоем базы данных.

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

Давайте теперь посмотрим, как мы можем использовать шутки для создания издеваний в Node.js.

Настройка шума в приложении Node.js

В этом руководстве мы настроим приложение Node.js, которое сделает HTTP-вызовы на API JSON, содержащие фотографии в альбоме. Jest будет использоваться, чтобы издеваться в призывы API в наших тестах.

Во-первых, давайте создадим каталог, под которым наши файлы будут наживать и переместиться в него:

$ mkdir PhotoAlbumJest && cd PhotoAlbumJest

Затем давайте инициализируем проект узла с настройками по умолчанию:

$ npm init -y

После инициализации проекта мы будем приступить к созданию index.js Файл в корне в каталоге:

$ touch index.js

Чтобы помочь нам с HTTP-запросы, мы будем использовать Axios Отказ

Настройка Axios.

Мы будем использовать Axios Как наш HTTP-клиент. Axios – это легкий, на основе обещания HTTP-клиент для Node.js, который также может использоваться веб-браузерами. Это делает его хорошо подходящим для нашего использования в случае использования.

Давайте сначала установимся:

$ npm i axios --save

Перед использованием Axios Мы создадим файл под названием Axiosconfig.js через который мы настроим клиент Axios. Настройка клиента позволяет нам использовать общие настройки через набор HTTP-запросов.

Например, мы можем установить заголовки авторизации для набора HTTP-запросов или чаще всего, базовый URL, который будет использоваться для всех HTTP-запросов.

Давайте создадим файл конфигурации:

touch axiosConfig.js

Теперь доступа к Axios и настроить базовый URL:

const axios = require('axios');

const axiosInstance = axios.default.create({
    baseURL: 'https://jsonplaceholder.typicode.com/albums'
});

module.exports = axiosInstance;

После установки BaseUrl Мы экспортировали Axios Экземпляр, чтобы мы могли использовать его через наше приложение. Мы будем использовать www.jsonplacholder.typicode.com Который является поддельным онлайн-API для тестирования и прототипирования.

В index.js Файл, который мы создали ранее, давайте определим функцию, которая возвращает список URL фото, учитывая идентификатор альбома:

const axios = require('./axiosConfig');

const getPhotosByAlbumId = async (id) => {
    const result = await axios.request({
        method: 'get',
        url: `/${id}/photos?_limit=3`
    });
    const { data } = result;
    return data;
};

module.exports = getPhotosByAlbumId;

Чтобы ударить нашу API, мы просто используем AXIOS.REQUEST () Метод нашего Axios пример. Мы проходим во имя метода, который в нашем случае является получить и URL Что мы вызовем.

Строка, которую мы переходим к URL поле будет объединено на BaseUrl от Axiosconfig.js Отказ

Теперь давайте настроим шутку для этой функции.

Настройка шума

Чтобы настроить шутку, мы должны сначала установить шутку в качестве зависимости в разработке, используя NPM :

$ npm i jest -D

-D Флаг – это ярлык для --save-dev , который говорит NPM сохранить его как зависимость в разработке.

Затем мы будем приступить к созданию файла конфигурации для jest под названием jest.config.js :

touch jest.config.js

Теперь в jest.config.js Файл, мы установим каталоги, в которых наши тесты будут проживать:

module.exports = {
    testMatch: [
        '/**/__tests__/**/?(*.)(spec|test).js',
        '/**/?(*.)(spec|test).js'
    ],
    testEnvironment: 'node',
};

TestMatch Значение – это массив глобальных моделей, которые шутят, которые будут использовать для обнаружения тестовых файлов. В нашем случае мы указываем, что любой файл внутри __tests__ каталог или где угодно в нашем проекте, который имеет либо .spec.js или же . test.js Расширение следует рассматривать как тестовый файл.

Примечание : В JavaScript часто встречается с помощью тестовых файлов с .spec.js Отказ Разработчики используют “Спец” как сокращение для «Спецификация» Отказ Последствия состоит в том, что тесты содержат функциональные требования или спецификации для реализации функций.

TestenVironment Значение представляет среду, в которой работает шума, то есть ли в Node.js или в браузере. Вы можете узнать больше о других допустимых вариантах конфигурации здесь Отказ

Теперь давайте изменим наш Package.json Тестовый скрипт, так что он использует шутки как нашего тестового бегуна:

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

Наша настройка сделана. Чтобы проверить, что наша конфигурация работает, создайте тестовый файл в корне для каталога, называемого index.spec.js :

touch index.spec.js

Теперь, в файле, давайте напишем тест:

describe('sum of 2 numbers', () => {
    it(' 2 + 2 equal 4', () => {
        expect(2 + 2).toEqual(4)
    });
});

Запустите этот код со следующей командой:

$ npm test

Вы должны получить этот результат:

 PASS  ./index.spec.js
  sum of 2 numbers
    ✓ 2 + 2 equal 4 (3ms)

Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   0 total
Time:        0.897s, estimated 1s
Ran all test suites.

С помощью Jest настроены правильно, теперь мы можем приступить к записи кода, чтобы издеваться на наш HTTP Call.

Издеваться над HTTP Call с шумом

В index.spec.js Файл, мы начнем свежим, удалив старый код и написав новый сценарий, который будет издеваться на HTTP Call:

const axios = require('./axiosConfig');
const getPhotosByAlbumId = require('./index');

jest.mock('./axiosConfig', () => {
    return {
        baseURL: 'https://jsonplaceholder.typicode.com/albums',
        request: jest.fn().mockResolvedValue({
            data: [
                {
                    albumId: 3,
                    id: 101,
                    title: 'incidunt alias vel enim',
                    url: 'https://via.placeholder.com/600/e743b',
                    thumbnailUrl: 'https://via.placeholder.com/150/e743b'
                },
                {
                    albumId: 3,
                    id: 102,
                    title: 'eaque iste corporis tempora vero distinctio consequuntur nisi nesciunt',
                    url: 'https://via.placeholder.com/600/a393af',
                    thumbnailUrl: 'https://via.placeholder.com/150/a393af'
                },
                {
                    albumId: 3,
                    id: 103,
                    title: 'et eius nisi in ut reprehenderit labore eum',
                    url: 'https://via.placeholder.com/600/35cedf',
                    thumbnailUrl: 'https://via.placeholder.com/150/35cedf'
                }
            ]
        }),
    }
});

Здесь мы впервые импортируем наши зависимости, используя требуется синтаксис. Поскольку мы не хотим делать какие-либо реальные сетевые звонки, мы создаем ручную макет нашего Axiosconfig используя jest.mock () метод. jest.mock () Метод принимает пункт модуля в качестве аргумента и дополнительная реализация модуля как Фабричный параметр Отказ

Для заводского параметра мы указываем, что наш издевательства, Axiosconfig , должен вернуть объект, состоящий из BaseUrl и Запрос () Отказ BaseUrl устанавливается на базовый URL API. Запрос () Является ли функция издевательства, которая возвращает массив фотографий.

Запрос () Функция, которую мы определили здесь, заменяет реальный AXIOS.REQUEST () функция. Когда мы называем Запрос () Метод, наш метод Mock будет называть вместо этого.

Что важно для заметок, это jest.fn () функция. Это возвращает новый Мачные функции И его реализация определяется в скобках. Что мы сделали через MockresWedValue () Функция предоставляет новую реализацию для Запрос () функция.

Как правило, это делается через Mockimlementation () Функция, хотя, так как мы действительно просто вернувшись только данные который содержит наши результаты – мы можем использовать функцию сахара вместо этого.

MockresWedValue () такой же, как Mockimlementation (() => Promise.resolve (стоимость)) Отказ

С макетом на месте давайте пойдем вперед и напишем тест:

describe('test getPhotosByAlbumId', () => {
    afterEach(() => jest.resetAllMocks());

    it('fetches photos by album id', async () => {
        const photos = await getPhotosByAlbumId(3);
        expect(axios.request).toHaveBeenCalled();
        expect(axios.request).toHaveBeenCalledWith({ method: 'get', url: '/3/photos?_limit=3' });
        expect(photos.length).toEqual(3);
        expect(photos[0].albumId).toEqual(3)
    });
});

После каждого тестового корпуса мы гарантируем, что jest.resetallmocks () Функция вызывается для сброса состояния всех изделок.

В нашем тестовом случае мы называем getphotosbyalbumid () Функция с идентификатором 3 как аргумент. Затем мы делаем наши утверждения.

Первое утверждение ожидает, что AXIOS.REQUEST () Способ был вызван, в то время как второе утверждение проверяет, что метод назывался правильными параметрами. Мы также проверяем, что длина возвращенного массива 3 И что первый объект массива имеет Альбумид 3 Отказ

Давайте запустим наши новые тесты с помощью:

npm test

Мы должны получить следующий результат:

PASS  ./index.spec.js
  test getPhotosByAlbumId
    ✓ fetches photos by album id (7ms)

Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   0 total
Time:        0.853s, estimated 1s
Ran all test suites.

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

SINON MODS против Jest Mocks

Sinon.js и jest имеют разные способы, которыми они приближаются к понятию издевательства. Ниже приведены некоторые из ключевых отличий к примечанию:

  • В Jest, Node.js модули автоматически насмехаются в ваших тестах, когда вы размещаете файлы MOCK в __mocks__ папка, которая рядом с node_modules папка. Например, если вы называете файл __mock __/fs.js тогда каждый раз ФС Модуль вызывается в вашем тесте, шума будет автоматически использовать издевательства. С другой стороны, с Sinon.js вы должны высмеивать каждую зависимость вручную, используя Sinon.Mock () Метод на каждом тесте, который ему нужен.
  • В шутке мы используем jest.fn (). Mockimlementation () Способ заменить издеванную реализацию функции с помощью неполадок. Хороший пример этого можно найти в документировании Whest здесь Отказ В Sinon.js мы используем mock.expects () метод для обработки этого.
  • Quest предоставляет большое количество методов для работы со своими макетными API и особенно с модулями. Вы можете просмотреть все они здесь Отказ Sinon.js, с другой стороны, имеет меньше методов для работы с издевателями и выставляют в целом проще упрощенного API.
  • SINON.JS MODS SINONON.JS MODS CORSS в рамках библиотеки SINONON.JS, которая может быть подключена и используется в сочетании с другими структурами тестирования, такими как Mocha и библиотеки утверждений, такие как Chai. Запытающиеся издевательства, с другой стороны, корабля как часть шума, которые также отправляются с собственными утверждениями API.

Макеты Sinon.js часто наиболее выгодны, когда вы тестируете небольшое приложение, которое может не требовать всей мощности структуры, такой как шума. Это также полезно, когда у вас уже есть настройка тестирования и необходимо добавить издевание на несколько компонентов в вашем приложении.

Однако при работе с большими приложениями, которые имеют много зависимостей, используя мощность MOD API JEST, наряду с его рамками, может быть значительно полезным для обеспечения постоянного опыта тестирования.

Заключение

В этой статье мы посмотрели, как мы можем использовать шутку, чтобы издеваться с HTTP Call с Axios Отказ Сначала мы настроили приложение для использования Axios Как наша библиотека HTTP-запроса, а затем настроить шутку, чтобы помочь нам с тестированием подразделения. Наконец, мы рассмотрели некоторые различия между Sinon.js и Jest Mocks, и когда мы могли бы лучше использовать.

Подробнее о Jest Mocks и как вы можете использовать их для более продвинутых случаев использования, проверьте их документацию здесь Отказ

Как всегда, код из этого руководства можно найти на Github Отказ

Читайте ещё по теме: