В SimpleReach у нас есть очень большое количество внутренних конечных точек API, и каждая из них может возвращать десятки полей данных в наше приложение Ember.js. Для проведения интеграционных тестов мы начали со статических фикстур, но очень скоро огромное количество полей и конечных точек стало подавляющим.

Я очень хотел что-то вроде VCR for Rails, но, увы, в мире фронтенда пока нет ничего подобного.

Тем не менее, Chrome предоставил отличный хак для использования. В сетевых инструментах разработчика вы можете щелкнуть правой кнопкой мыши и выбрать «сохранить как HAR с содержимым». Это сохранит запись всех сетевых запросов, которые произошли с тех пор, как вы открыли инструмент. Вуаля, мгновенная запись всех сетевых запросов, произошедших на сайте.

После того, как вы сохранили HAR, вам нужен способ программного обслуживания информации. Sinon.js имеет фиктивный сервер, который будет отвечать сохраненным JS на основе входящих запросов. Настройка выглядит примерно так:

Теперь, пока объект передается в «server.respondWith», сервер будет отвечать на него.

Чтобы файл HAR хорошо воспроизводился с Sinon, я разветвил приложение под названием Mockbuilder. Mockbuilder позволяет добавить файл HAR в папку, и он автоматически преобразует его во что-то, что хорошо работает с Sinon. Форк позволяет указать URL-адрес для перезаписи внутренних запросов и место, где должен находиться новый фиктивный файл. Таким образом, вы можете сразу же отправить их в фиктивную папку в вашем приложении.

Это не только значительно упрощает написание интеграционных тестов JavaScript, но и является отличным способом создания полностью автономных демонстраций вашего приложения. Просто нажмите, сохраните файл HAR, а затем, установив новые макеты, вы можете щелкнуть таким же образом, и он будет использовать записи вместо фактических запросов. Идеально подходит для отделов продаж, которые хотят иметь гарантию, что все будет работать так, как они ожидали.

Презентация ниже.