Особенности Chrome

Protractor — инструмент для end-to-end тестирования Angular-приложений, тесно интегрированный с WebDriver и браузером Chrome. Понимание особенностей работы с этим браузером позволяет создавать стабильные и быстрые тесты.

Конфигурация ChromeDriver

Для работы с Chrome Protractor использует ChromeDriver, который является мостом между тестами и браузером. В конфигурационном файле (protractor.conf.js) указывается браузер и его параметры:

capabilities: {
    browserName: 'chrome',
    chromeOptions: {
        args: ['--disable-infobars', '--start-maximized', '--headless'],
        prefs: {
            'profile.default_content_setting_values.notifications': 2
        }
    }
}
  • --disable-infobars отключает уведомления Chrome о том, что браузер управляется автоматизированной программой.
  • --start-maximized запускает окно на весь экран, что важно для тестов с элементами, зависящими от размеров окна.
  • --headless позволяет запускать Chrome без графического интерфейса, ускоряя выполнение тестов на CI-серверах.
  • prefs управляют пользовательскими настройками, например, отключением всплывающих уведомлений.

Особенности работы с элементами

Chrome имеет собственные особенности рендеринга, что влияет на поиск и взаимодействие с элементами:

  • Shadow DOM: современные компоненты могут использовать Shadow DOM. Для доступа к элементам внутри него нужно применять JavaScript-выражения через browser.executeScript.
  • Анимации и рендеринг: Chrome выполняет плавные анимации CSS. Без их отключения или ожидания элементов тесты могут быть нестабильными. Используется browser.wait с ExpectedConditions для синхронизации.
const EC = protractor.ExpectedConditions;
const button = element(by.id('submitBtn'));
browser.wait(EC.elementToBeClickable(button), 5000);
button.click();

Управление вкладками и окнами

Chrome поддерживает несколько вкладок, каждая из которых имеет уникальный идентификатор окна (windowHandle). Protractor позволяет переключаться между ними:

browser.getAllWindowHandles().then(handles => {
    browser.switchTo().window(handles[1]);
});

Важно учитывать, что Chrome иногда задерживает обработку событий при открытии новых вкладок, поэтому часто используется дополнительное ожидание после getAllWindowHandles.

Настройка производительности и стабильности

Для крупных тестовых наборов рекомендуется оптимизация настроек Chrome:

  • Отключение GPU: --disable-gpu уменьшает нагрузку на систему и предотвращает баги рендеринга.
  • Отключение кэширования: --disable-application-cache предотвращает влияние старых данных на тесты.
  • Управление размером окна и DPI: важно для тестов, зависящих от визуальных элементов, чтобы все элементы попадали в видимую область.

Логи и отладка

Chrome предоставляет детальные логи через chromeOptions:

chromeOptions: {
    args: ['--enable-logging', '--v=1'],
    perfLoggingPrefs: {
        enableNetwork: true,
        enablePage: true
    }
}
  • --enable-logging включает запись действий браузера.
  • perfLoggingPrefs позволяет собирать сетевые и производственные логи, полезные для анализа медленных запросов и ошибок рендеринга.

Интеграция с CI/CD

Chrome и Protractor хорошо интегрируются с системами непрерывной интеграции:

  • --headless позволяет запускать тесты на сервере без графического интерфейса.
  • Опции типа --no-sandbox необходимы для контейнеризированных сред, таких как Docker.
  • Логи Chrome можно сохранять в отдельные файлы для последующего анализа.

Особенности версий

Chrome и ChromeDriver должны быть совместимы. Несовпадение версий приводит к сбоям тестов. Protractor не всегда автоматически управляет версией ChromeDriver, поэтому важно использовать пакет webdriver-manager и выполнять его обновление перед запуском:

webdriver-manager update --versions.chrome 114.0.5735.90

Работа с расширениями и профилями

Chrome поддерживает пользовательские профили и расширения, что позволяет тестировать приложения в условиях реальных настроек:

chromeOptions: {
    args: ['user-data-dir=/path/to/custom/profile', '--load-extension=/path/to/extension']
}

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

Вывод

Эффективное тестирование с Protractor в Chrome требует учёта особенностей рендеринга, анимаций, управления окнами и версий ChromeDriver. Корректная настройка параметров chromeOptions и использование ожиданий делают тесты стабильными, предсказуемыми и быстрыми, что особенно важно при автоматизации больших Angular-приложений.

Оглавление