Как сделать тестирование интеграции для (Angularjs) веб-приложений

Я разрабатываю Webapp. Он состоит из 2 частей. A node сервер останова и клиент с угловым клиентом.

Приложение структурировано таким образом: Rest Server ↔ Api Module ↔ Angular App

Сервер в настоящее время хорошо протестирован. У меня есть тесты модулей и интеграционные тесты. Интеграционные тесты обращаются к реальной базе данных и вызывают остальные api по http. Я думаю, что это такой высокий уровень, который он может получить для тестирования сервера. Интеграционные тесты также выполняются быстро. Я довольно уверен, что способ проверки сервера достаточно для моего варианта использования, и я доволен результатами.

Однако я изо всех сил пытаюсь проверить приложение angularjs. У меня есть модульные тесты для соответствующих директив и модулей. Написание их не было проблемой.

Я хотел бы написать интеграционные тесты, которые охватывают пользовательские сценарии. Что-то вроде сценария регистрации: пользователь посещает веб-сайт, переходит к форме регистрации и отправляет форму с данными.

Команда angularjs переходит из ng-сценариев в protractor. Транспортир использует Selenium для проведения тестов. Поэтому есть две области: область приложения и область проверки.

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

Откажитесь от модуля Api
Макет сервера останова
Использовать полный сервер

Макет модуля Api

В этом случае мне не нужно будет устанавливать сервер. Все взаимодействия выполняются в браузере

Преимущество:

Сервер не требуется

Неудобство:

Api находится в области браузера, и мне приходится вмешиваться в это.

Мне действительно нравится это решение, но мне сложно издеваться над Api. Api необходимо изменить в области браузеров. Поэтому мне нужно отправить модификацию из теста в браузер. Этот можно сделать, однако я не вижу, как я мог запускать утверждения типа mockedApi.method.wasCalledOnce() в области проверки

Макет сервера останова

Преимущество:

Клиент не изменится
Только одна область действия для

Неудобство:

Нужно настроить маршруты останова

Я мог бы создать полный сервер Mock Rest в nodejs. Тестеры-транспортеры записываются в nodejs, поэтому управление сервером может быть выполнено в тесте. Прежде чем запустить тест, я могу сказать серверу, как реагировать. Что-то вроде этого: server.onRequest({method: 'GET', url: '/'}).respondWith('hello world')

Тогда я мог делать утверждения типа wasCalledOnce

Использовать полный сервер с базой данных

Каждый тест работает с полным сервером и может добавлять элементы в базу данных. После каждого теста можно просмотреть ожидаемые элементы в базе данных

Преимущество:

Можно с уверенностью сказать, что если эти тесты запущены, приложение будет функционировать в проверенном случае использования

Неудобство:

Я уже провел довольно интенсивный интеграционный тест с остальным сервером. Это похоже на повторение этого же вопроса.
Настройка зависит от полного сервера

Текущее заключение

Издевательствование Api полностью отделяет сервер и клиент.
Использование Mock Api было бы более высоким уровнем тестирования, но для этого требовался поддельный сервер
Выполнение полного теста интеграции даст лучшую надежность, но это также сильно зависит от кода сервера.

Что я должен выбрать? Что бы вы сделали?

Ответ 1

Я думаю, что я ответил на этот же вопрос в группе Google Protractor google. Я почти такой же, как и вы, не желая ни одного сервера, но желая всего моего тестового кода в одном месте (в Protractor), а не разбивая между Protractor и браузером. Чтобы включить это, я взял дело в свои руки и разработал прокси-сервер для службы $httpBackend, которая работает в Protractor. Это позволяет настроить службу $httpBackend, как если бы она выполнялась в Protractor. Я работаю над этим какое-то время и его разумно полно. Было бы здорово, если бы вы могли взглянуть и сообщить мне, не хватает ли чего-нибудь важного.

https://github.com/kbaltrinic/http-backend-proxy

Ответ 2

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

Подробнее здесь: http://www.syntaxsuccess.com/viewarticle/angular-integration-tests

Ответ 3

Это отличный вопрос, который не имеет никакого отношения к определенному инструменту. Мне пришлось столкнуться с такой же проблемой в большом проекте "greenfield" (т.е. с нуля).

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

Вы сами предложили правильный ответ: # 2 заглушите остальной сервер. # 1 является feseable, но скоро будет слишком сложно разрабатывать и поддерживать, # 3 - отличная идея, но не имеет никакого отношения к тестированию пользовательского интерфейса и проверке UI.

Чтобы достичь высокой надежности вашего интерфейса, независимо от вашего бэкэнда, просто закройте остальной сервер, т.е. создайте глупый простой сервер REST, который будет идемпотентным, i. е. ВСЕГДА ответят на одно и то же сообщение на один HTTP-запрос. Сохранение принципа идемпотенции сделает разработку и испытание очень, очень легким, чем любой другой вариант.

Затем для одного теста вы проверяете только то, что отображается на экране (проверьте верхнюю часть) и что отправляется на сервер (проверьте нижнюю часть), чтобы полный стек пользовательского интерфейса тестировался только один раз.

Полный ответ на вопрос должен заслужить всю статью в блоге, но я надеюсь, что вы почувствуете, что делать с того, что я предлагаю.

С наилучшими пожеланиями

Ответ 4

Это отличный вопрос. Вот как я это сделаю:

Поскольку у вас уже есть модульные тесты angular для соответствующих директив и модулей, это идеально.

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

Итак, почему бы просто не добавить некоторые тесты интеграции на высоком уровне, которые включают в себя angular и ваш сервер одновременно.

Если вы можете избежать насмешек, почему бы не сохранить работу, чтобы поддерживать дополнительный код, если это возможно.

Также хорошо читать: http://blog.ericbmerritt.com/2014/03/25/mocking-is-evil.html

Ответ 5

Смысл REST-сервера - лучший, более чистый вариант, на мой взгляд. Попробуйте Mountebank (http://www.mbtest.org). Удивительный инструмент виртуализации.