Автоматизируем запуск UI тестов с помощью GitHub Actions

Все знают, что нужно писать тесты, регулярно запускать их на CI/CD в каждом коммите в develop. Но как это сделать, если у нас UI тесты? Ведь нам нужен браузер, мощные аппаратные ресурсы для запуска, а главное: как мы поймем, где ошибка, если не будем видеть прогон тестов глазами? В рамках доклада поговорим про то, как настроить прогон Java / Selenide тестов на CI/CD и в кластере k8s.

Transcript

1. Автоматизируем запуск UI тестов с помощью GitHub Actions Романов Алексей, IT Enduro
2. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 ПЛАН ДОКЛАДА Зачем это вам вообще нужно? Selenium vs. Selenide vs. Selenoid: разбираемся в терминах. Пишем тест на Selenide: Page Object и его друзья. Проверка на этапе сборки: запускаем наше приложение в Docker и настраиваем запуск тестов на Github Actions с помощью Aerokube Selenoid. Подключаем Allure для вывода отчетов. Проверка после деплоя: обновляем приложение в кластере k8s и запускаем тесты с помощью Aerokube Moon. Вместо выводов: а стоило ли оно того?
3. В индустрии более 12 лет. Co-founder Ed-Tech стартапа IT Enduro. 9 лет преподовал в МГТУ им. Н.Э.Баумана. Основная специализация – разработка Java / Kotlin. Работаю в роли Software Архитектора более 7 лет. Мы с вами встречались на других конференциях 🙂 РОМАНОВ АЛЕКСЕЙ
4. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 ЗАЧЕМ ЭТО ВООБЩЕ НУЖНО ВАМ? Автоматизированные тесты – всегда хорошо. Они ускоряют процесс разработки и повышают качество результата. Эти тесты должны запускаться регулярно, иначе в них не будет смысла. UI тесты проверяют поведение системы со стороны пользователя. Написание и поддержка UI тестов дорогая, следовательно, нам важно, чтобы они нам приносили максимальную пользу. А значит нам надо их встроить в CI/CD.
5. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 SELENIUM VS. SELENIDE VS. SELENOID 5 Selenium Web Driver – представляет собой драйвер браузера, то есть программную библиотеку, которая позволяет разрабатывать программы, управляющие поведением браузера. Selenium Grid – это кластер, включающий в себя несколько Selenium- серверов. Selenide – это фреймворк, разработанный для автоматизации тестирования с помощью Selenium Web Driver. Solenoid – решение для управления Docker-контейнерами, в которых есть все необходимые программы и драйверы для тестирования в браузерах.
6. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 ПОЧЕМУ НЕ SELENIUM WEBDRIVER? Selenium WebDriver – это инструмент для управления браузером, а не инструмент для тестирования. Нестабильность тестов, вызванная динамическим контентом: JavaScript, Ajax, Timeouts и т.д. Сложность кода, вызванная необходимостью использовать wait_until / sleep в тестах.
7. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 ПОЧЕМУ SELENIDE? val element = WebDriverWait(driver, 10) .until(ExpectedConditions .presenceOfElementLocated(By .cssSelector("input[data-id='username']"))) element.click() $(cssSelector("[data-id='username']")).click() Selenium Selenide
8. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 JAVA VS. JAVASCRIPT Java – это как JavaScript
9. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 PAGE OBJECT Для каждой страницы тестируемого приложения создаётся отдельный объект, методы которого инкапсулируют логику работы с отдельными элементами. Считается, что Page Object позволяет избежать дублирования локаторов в тестах.
10. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 PAGE OBJECT 1. class GoogleSearchPage { 2. fun search(query: String): GoogleResultsPage { 3. $(By.name("q")).setValue(query).pressEnter() 4. return page(GoogleResultsPage::class.java) 5. } 6. } 7. 8. class GoogleResultsPage { 9. fun results() = $$("#ires li.g") 10.} https://ru.selenide.org/documentation/page-objects.html
11. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 PAGE OBJECT 1. val searchPage: GoogleSearchPage = 2. open("https://google.com", GoogleSearchPage::class.java) 3. val resultsPage = searchPage.search("selenide") 4. resultsPage.results().shouldHave(size(10)) 5. resultsPage.results()[0] 6. .shouldHave(text("Selenide: Concise UI Tests in Java")) https://ru.selenide.org/documentation/page-objects.html
12. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 СОБИРАЕМ И ЗАПУСКАЕМ https://github.com/romanow /frontend-todo-list https://github.com/romanow /backend-todo-list
13. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 $ docker compose \ -f docker-compose.yml \ -f docker-compose.frontend.yml \ up -d --wait СОБИРАЕМ И ЗАПУСКАЕМ
15. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 1. @Test 2. @Order(1) 3. fun login() { 4. open(TODO_LIST_URL) 5. LoginPageResults().loginModal().exists() 6. LoginPage().authorize() 7. } 8. 9. @Test 10. @Order(2) 11. fun items() { 12. val page = TodoListPage() 13. val results = TodoListPageResults() 14. results.loader().shouldBe(hidden) 15. 16. val item = page.addNewItem() 17. results.item(item.uid).shouldHave(text(item.text)) 18. 19. page.removeItem(item) 20. results.item(item.uid).shouldNot(exist) 21. } СОБИРАЕМ И ЗАПУСКАЕМ 15
16. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 $ brew install --cast chromedriver $ ./gradlew selenide СОБИРАЕМ И ЗАПУСКАЕМ
18. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 ЗАПУСКАЕМ НА CI/CD ??? ???
19. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 ЗАПУСКАЕМ НА CI/CD 1. Запускаем необходимые сервисы с помощью Docker Compose. Локальный запуск 1. С помощью Seneloid внутри Docker запускаем браузер в headless режиме. 2. Запускаем тесты, указав 
 selenide.remote = http://localhost:4444/wd/hub. Запуск UI тестов
20. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 ЗАПУСКАЕМ НА CI/CD Solenoid – это реализация идей Selenium Hub с помощью Docker для запуска контейнеров.
21. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 GITHUB ACTIONS GitHub Actions — это платформа непрерывной интеграции и непрерывной поставки (CI/CD), которая позволяет автоматизировать конвейер сборки, тестирования и развертывания.
23. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 ЗАПУСКАЕМ НА CI/CD 1. ui-tests: 2. name: UI Test 3. runs-on: ubuntu-latest 4. needs: build 5. steps: 6. - name: Run containers 7. run: | 8. docker compose \ 9. -f docker-compose.yml \ 10. -f docker-compose.frontend.yml \ 11. -f docker-compose.selenoid.yml \ 12. up -d --wait 13. 14. - name: Pull Chrome image 15. run: docker pull selenoid/vnc:chrome_125.0 16. 17. - name: Run Selenium Tests 18. timeout-minutes: 5 19. run: ./gradlew selenoid .github/work fl ows/build.yml
24. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 ЗАПУСКАЕМ НА CI/CD 1. version: "3.9" 2. services: 3. selenoid: 4. image: aerokube/selenoid:1.11.2 5. container_name: selenoid 6. command: [ "-conf", "/etc/selenoid/browsers.json", 7. "-container-network", "common" ] 8. ports: 9. - "4444:4444" 10. healthcheck: 11. test: [ "CMD", "wget","http://localhost:4444/ping" ] 12. interval: 10s 13. timeout: 5s 14. retries: 5 15. volumes: 16. - ./docker/selenoid/:/etc/selenoid/ 17. - /var/run/docker.sock:/var/run/docker.sock docker-compose.selenoid.yml
25. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 ПОДКЛЮЧАЕМ ALLURE
26. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 ПОДКЛЮЧАЕМ ALLURE 1. @TestMethodOrder(OrderAnnotation::class) 2. class TodoListTest { 3. 4. @Test 5. @Order(1) 6. @Step("Авторизация") 7. fun login() {...} 8. 9. @Test 10. @Order(2) 11. @Step("Добавление и удаление элементов") 12. fun items() {...} 13. 14. companion object { 15. @BeforeAll @JvmStatic 16. fun allure() { 17. SelenideLogger.addListener("AllureSelenide", AllureSelenide()) 18. } 19. } 20.}
27. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 27 GitHub Pages — это общедоступные статические веб-страницы, размещенные и опубликованные через GitHub. GITHUB PAGES
28. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 ПОДКЛЮЧАЕМ ALLURE 1. publish-allure: 2. name: Publish allure report 3. steps: 4. ... 5. - name: Build test report 6. uses: simple-elf/allure-report-action@v1.7 7. if: always() 8. with: 9. gh_pages: gh-pages 10. allure_history: allure-history 11. allure_results: build/allure-results 13. - name: Publish test report 14. uses: peaceiris/actions-gh-pages@v4 15. if: always() 16. with: 17. github_token: ${{ secrets.GITHUB_TOKEN }} 18. publish_branch: gh-pages 19. publish_dir: allure-history
30. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 ЗАПУСК ТЕСТОВ В KUBERNETES ??? ???
31. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 ЗАПУСК ТЕСТОВ В KUBERNETES 1. Запустить кластер Kubernetes. * 2. Установить новую версию приложения. Deploy Очистка ресурсов 1. Удалить старую версию приложения. 2. Остановить кластер Kubernetes. * Запуск UI тестов 1. Устанавливаем Moon Operator в кластер Kubernetes. 2. Запускаем тесты, указав 
 selenide.remote = http://moon.romanow-alex.ru/wd/hub.
32. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 ЗАПУСК ТЕСТОВ В KUBERNETES Moon - решение для организации автоматизированного тестирования веб-приложений в настольных и мобильных браузерах на основе протокола Selenium WebDriver, работающее в кластере Kubernetes.
33. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 ЗАПУСК ТЕСТОВ В KUBERNETES
35. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 ВЫВОДЫ Автоматизированные тесты – всегда хорошо. Они ускоряют процесс разработки и повышают качество результата. UI тесты проверяют поведение системы со стороны пользователя, следовательно, они позволяют в автоматизированном виде контролировать, что перед релизом ничего не развалилось. Проекты Aerokube Selenoid и Moon позволяют легко настроить прогон UI тестов.
36. © IT Enduro «Автоматизируем запуск UI тестов с помощью GitHub Actions», 2024 @romanow romanowalex @it_enduro it-endu.ro ПОДПИСКА И КОЛОКОЛЬЧИК 36 БЛАГОДАРЮ ЗА ВНИМАНИЕ ПРИМЕР: TODO LIST