Миграция с Protractor на другие фреймворки

Protractor долго считался стандартом тестирования Angular-приложений, предоставляя фирменные механизмы синхронизации с Angular, поддержку Page Object, удобные matchers и работу через WebDriverJS. После окончания активной поддержки и рекомендаций сообщества перейти на другие решения возникла задача миграции существующих тестовых проектов. Главная сложность здесь не только в замене API, но и в пересмотре архитектуры тестов, инфраструктуры запуска и CI-конвейера.

Критерии выбора нового фреймворка

При оценке альтернатив учитывались несколько факторов:

Модель взаимодействия с браузером. WebDriver против нативной автомации (Chrome DevTools) или гибридных решений.
Поддержка Angular. Наличие механизмов ожидания рендеринга и событий change detection.
Стратегия ожиданий. Неявные delay редко работают стабильно; предпочтительны автоматические или явные ожидания.
Интеграция с CI. Простая сборка Docker, headless-режимы, параллельный запуск.
Документация и сообщество. Чем шире экосистема, тем легче обслуживание.

По итогам анализа наиболее распространёнными целями миграции стали Cypress, Playwright и WebdriverIO.

Миграция на Cypress

Особенности Cypress по сравнению с Protractor

Cypress работает в одном процессе с приложением через DevTools-протокол, что даёт более точный контроль над состоянием DOM и автоматизацию ожиданий. В отличие от Protractor, Cypress не использует WebDriver, а синхронизирует команды через внутреннюю очередь.

Ключевые отличия:

Команды Cypress асинхронны по дизайну и не используют async/await.
Механизм автоожиданий исключает необходимость browser.sleep и ExpectedConditions.
Поддерживается стабильный headless и параллельный запуск через облачные платформы.

Типичные точки несовместимости

Page Object. Cypress допускает, но не поощряет классическую объектную модель; предпочтение отдаётся функциональному стилю.
Работа с сетью. Intercept заменяет работу с backend stub и ускоряет тесты.
Работа с окнами и вкладками. Поддержка ограничена по сравнению с WebDriver.

Стратегия миграции

Разделение тестов на E2E и component tests.
Переписывание ожиданий на cy.get, cy.contains, cy.intercept.
Перенос хуков Jasmine на Mocha (before, after, beforeEach, afterEach).

Миграция на Playwright

Отличительные свойства Playwright

Playwright предлагает многобраузерную автоматизацию с полной поддержкой Chromium, Firefox и WebKit без WebDriver. Асинхронная модель и автоматические ожидания делают синхронизацию простой даже без Angular-специфичных механизмов.

Принципиальные преимущества:

Сильное API для network-mocking.
Многоконтекстность и обходные стратегии для тестов, требующих множественных вкладок или окон.
Расширенные возможности тайм-тревела и трассировки.

Переход с ExpectedConditions

Protractor опирается на ExpectedConditions и browser.wait. Playwright устраняет необходимость таких конструкций, так как большинство методов (click, fill, waitForNavigation) имеют встроенные ожидания.

Инфраструктурные изменения

Разделение конфигурации на проекты (desktop, mobile, locales).
Введение trace и video артефактов в CI.
Переход с Jasmine на встроенный тест-раннер или Jest.

Миграция на WebdriverIO

Пр continuity WebDriver-модели

WebdriverIO остаётся ближе всего к Protractor с точки зрения парадигмы WebDriver. Это важно при сложных сценариях многобраузерности и интеграциях. Для Angular ожиданий нет, однако использование waitUntil и кастомных ожиданий закрывает большую часть потребностей.

Сильные стороны

Богатая экосистема плагинов.
Интеграция с Appium для мобильного тестирования.
Возможность использования Cucumber и BDD.

Анализ точек стыка с Angular

При миграции часто возникает вопрос отсутствия аналога browser.waitForAngular. Современные фреймворки исходят из предположения, что Angular (особенно начиная с версии 12+) обновляет DOM фактически синхронно. В редких ситуациях применяются:

ожидания по селекторам (waitForSelector)
ожидания по событиям сети
ожидания по состоянию приложения (через public API или Data-attributes)

Сложные ожидания change detection переносятся в приложение: вынос загрузочных индикаторов, явные статусы, соглашения о готовности UI.

Перенос тестовой архитектуры

Важные изменения:

Логическая декомпозиция тестов на более короткие и независимые сценарии.
Отказ от глобальных команд browser в пользу тест-локализованных контекстов.
Переписывание async-логики и отказ от control flow, который использовался Protractor до перехода на async/await.

CI и инфраструктурные аспекты

Cypress и Playwright предоставляют headless-режимы из коробки и легко упаковываются в Docker-образы.
WebdriverIO требует настройки Selenium Grid или использование сервиса Selenoid.
В GitLab CI и GitHub Actions удобно использовать готовые контейнеры с браузерами.

Обновление экосистемы отчётности

При замене Protractor заменяются инструменты:

Jasmine reporter → Mocha reporter / Allure
Protractor screenshots → встроенные screenshot-механизмы Cypress/Playwright
Видео и трассировки → преимущественно Playwright и Cypress

Календарный подход к миграции

Этапность:

Инвентаризация текущих тестов: объём, сложность, стабильность.
Идентификация критичных сценариев (регрессионных, smoke).
Выбор платформы и пилотная реализация небольшой части тестов.
Параллельный запуск Protractor и нового фреймворка.
Перенос инфраструктуры (CI, отчёты, Docker).
Полное выключение Protractor.

Такой режим позволяет сократить риски срыва регрессионного цикла.

Проблематика совместимости и типичные ловушки

Проблемы с загрузчиками SPA и авторизацией.
Сложности со стейтом между тестами.
Излишний coupling тестов к структуре DOM без data-hooks.
Длительные операции с сетью, которые проще стабилизировать interceptом.

Практика внедрения альтернатив

Наиболее часто выбираются:

Cypress для стабильных UI-регрессий и высокоскоростной обратной связи.
Playwright для сложных сценариев, мультивкладок, локалей и мультимодальных тестов.
WebdriverIO для проектов, где требуется совместимость с Appium или сохранение WebDriver-экосистемы.

Основные выводы по архитектурным изменениям

Опора на автоматические ожидания новых фреймворков уменьшает хрупкость тестов.
Явная фиксация сети и данных уменьшает нестабильность и делает тесты быстрее.
Наличие трассировки, видео и скриншотов облегчает расследование падений.
Декомпозиция сценариев и отказ от крупных монолитных тестов ускоряет ран.

Переосмысление роли E2E тестов

После ухода Protractor акцент смещается в сторону баланса: часть логики переносится в компонентные тесты, проверка сложных потоков остаётся на уровне E2E, а API-слой становится самостоятельным тестовым контуром. Такой подход уменьшает зависимость от UI и снижает стоимость сопровождения тестов.