Мне всегда нравилась идея действий GitHub, потому что это означает меньше сторонних зависимостей от вашего потока CI / CD. Однако пользовательского интерфейса несколько не хватает по сравнению с другими поставщиками, такими как Circle CI, но со временем ситуация улучшается.
Здесь я буду использовать Cypress для тестирования полного сквозного потока веб-приложения, подключенного к имитируемому GraphQL API. Тот факт, что API - это GraphQL, затрудняет локальную заглушку с Cypress из-за того, что все запросы идут к одной и той же конечной точке. Поэтому я считаю, что издевательство над API - лучший способ.
Я сосредоточусь исключительно на действиях GitHub, а не на настройке самого приложения.
Держим все вместе
Во-первых, я использую монорепозиторий. Это важно, потому что это означает, что и мой клиент, и API могут быть доступны из одного рабочего процесса. Это повышает устойчивость ваших тестов, поскольку изменения в каждой части вашей инфраструктуры тестируются вместе. Это по сравнению с тестированием клиента на промежуточной конечной точке, где контракт между клиентом и API может быть нарушен.
Обзор GitHub Действия
На верхнем уровне вы будете запускать рабочий процесс. Они состоят из серии шагов; например, у вас может быть рабочий процесс, состоящий из трех этапов:
- Ознакомьтесь с нашим кодом
- Настроить Node.js
- Создайте и протестируйте свое приложение
Этот рабочий процесс можно было бы назвать «Тестовое приложение». Рабочий процесс определяется с использованием файлов .yml и должен быть сохранен в корне вашего монорепозитория под прямым файлом .github / workflow / test-app.yml.
Здесь у нас есть пример файла .yml для рабочего процесса.
В разделе s teps вы можете увидеть три упомянутых ранее шага.
Вы также можете увидеть здесь кнопку использует для некоторых шагов. Это фактическая часть действий действий GitHub. Это заранее написанные единицы кода, которые можно использовать на любом этапе. Примером может быть развертывание в AWS, сжатие образов или, в данном случае, проверка нашего кода и настройка Node.
-
Проведение сквозного теста
Итак, теперь давайте посмотрим, как мы можем использовать и наше приложение, и наш API вместе для выполнения наших сквозных тестов. Как упоминалось ранее, важно иметь монорепозиторий. Таким образом, мы можем изменить каталог для выполнения определенных шагов в фоновом режиме.
Чтобы запустить задачу в фоновом режиме, просто завершите команду амперсандом &
Например, я мог бы запустить свой макет API с yarn mock &, и рабочий процесс успешно продолжился бы с API, который теперь работает в вашем контейнере.
Для этого в действиях GitHub мы могли бы добавить новый шаг в рабочий процесс. Обратите внимание, как вы также можете добавлять переменные среды для определенных шагов.
Окончательный рабочий процесс, запускающий API и сквозное тестирование, будет выглядеть следующим образом:
Здесь вы можете увидеть, что у нас есть дополнительный шаг для запуска нашего API. Затем мы переходим к нашему клиентскому этапу, чтобы создать и протестировать клиента. Но API продолжает работать. Затем мы запускаем наш клиент, используя yarn start &, чтобы он также работал в фоновом режиме.
Теперь, когда мы запустим cypress withyarn cypress:run, будет запущен клиент и API для доступа.
Теперь у нас есть законченный рабочий процесс, в котором выполняется сквозное тестирование.
