WebdriverIO + Puppeteer. Double gun – double fun
Download as PPTX, PDF0 likes209 views
Документ описывает интеграцию WebDriver и Puppeteer для автоматизации тестирования браузеров с использованием стандартного протокола W3C. В нём обсуждаются основные возможности, такие как управление браузером через JavaScript, использование Chrome DevTools Protocol и совместимость с различными браузерами. Также упоминается Selenoid как решение для управления контейнерами с браузерами и поддержка интеграции с Puppeteer для более высокой производительности тестов.
WebdriverIO + Puppeteer. Double gun – double fun
- 1. Webdriver + Puppeteer Double gun - double fun Oleksandr Khotemskyi, 2020 xotabu4.github.io
- 2. Александр Хотемской • Software Development Engineer in Test • Independent Contractor • 8+ лет автоматизации тестирования и смежных областях • Основной стек технологий - JavaScript/TypeScript, NodeJS xotabu4.github.io
- 3. WebDriver W3C protocol Что это и как работает?
- 4. Что это? • Это стандартизированный протокол управления браузерами • Можно управлять разными браузерами одинаковыми командами • Можно управлять браузером из разных языков программирования • Разработчики браузера если хотят быть полностью w3c standarts compatible – должны реализовать это API
- 7. Your tests code Selenoid Servers Load Balancer Server (GGR) Selenium Server on Mac OS X
- 8. Chrome Debug Protocol Что это и как работает?
- 9. Chrome DevTools • Инструмент для разработчиков • Включен в Chrome с самых первых версий • Может практически полностью контролировать что происходит в браузере • Может инспектировать различные аспекты работы страницы • Может внедрятся и исполнять свои команды в браузере
- 13. WebSockets • Chrome Debug Protocol использует WebSockets как транспорт • Одно из основных отличий что WebSocket это двухсторонний протокол передачи данных • Быстрей чем HTTP • Обе стороны могут инициировать отправку данных, а не только клиент
- 14. Puppeteer • JS библиотека • Запускает и подключается к браузеру и управляет им через Chrome Debug Protocol • Может скачивать Chromium браузер автоматически • По сути - высокоуровневая клиентская библиотека для работы с Chrome Debug Protocol
- 17. WebDriver + CDP
- 18. Chrome NodeJS ChromeDriver Web Server WebApplication HTTP (W3C WebDriver) PuppeteerWebdriver HTTP WebSocket WebSocket (CDP) WebSocket (CDP)
- 19. Настройка • Нужно запустить браузер с помощью WebDriver как обычно, но с дополнительной capability --remote- debugging-port=xxxx • Перед стартом тестов - вызвать puppeteer.connect и указать наш remote-debugging-port • Присвоить созданный объект Browser (от puppeteer) в глобальную переменную (опционально)
- 22. Возможности • Обратная совместимость с существующими тестами • Дополнительные puppeteer команды теперь доступны в тестах • Когда важна скорость - можно выбирать быстрый puppeteer клиент • Для стабильности и максимальной эмуляции пользователя - webdriver клиент
- 23. CSS and JS code coverage
- 24. CSS and JS code coverage
- 27. Browser and Page events
- 28. Browser and Page events
- 30. Selenoid + Webdriver + Puppeteer • Selenoid (а также GGR) может перенаправлять CDP запросы внутрь контейнера с Chrome браузером • Для этого нам нужно указать для подключения URL формата: ws://selenoid.example.com:4444/devtools/<ses sion-id> • Это позволяет использовать существующую тестовую ферму для подключения и webdriver и puppeteer
- 34. Other browsers • Есть поддержка Firefox в 2.1.0 • Есть инициатива - compatibility.remotedebug.org - по адаптации chrome debug protocol на другие браузеры • Потенциально это будет работать и для нового Chromium-EDGE • microsoft/playwright - новый проект, основывается на наработках puppeteer, поддерживает больше браузеров, и имеет похожее API
- 36. Существующий WDIO-devtools-service: https://github.com/webdriverio/webdriverio/blob/master/packages/wdio- devtools-service/src/index.js Puppeteer API: https://pptr.dev/ Низкоуровневый CDP API: https://chromedevtools.github.io/devtools- protocol/ Selenoid и CDP: https://aerokube.com/selenoid/latest/#_accessing_browser_developer_t ools Code coverate HTML report для Puppeteer: https://github.com/istanbuljs/puppeteer-to-istanbul Всякие вкусности для Chrome Debug Protocol: https://github.com/ChromeDevTools/awesome-chrome-devtools
Editor's Notes
- #2: WebdriverIO + Puppeteer. Double gun - double fun В мире автоматизации давным-давно успешно используют W3C Webdriver HTTP протокол. С его помощью реализовано множество проектов и библиотек на различных языках (selenide, protractor, webdriverio и тысячи других). Но так же в последнее время все больше и больше команд решают использовать Chrome Debug Protocol, в частности инструмент Puppeteer. Он основан на WebSockets, и имеет свои особые возможности - двухсторонняя связь, возможность подписки на события в браузере, и многое другое. В этом докладе мы посмотрим возможности обоих протоколов, поэкспериментируем и совместим их вместе в одном проекте, чтобы заставить браузер работать на полную и взять лучшее от двух каналов связи.
- #21: WDIO
- #26: Request/Response interception
- #34: PROTRACTOR