Ожидание исчезновения элемента

В автоматизированном тестировании веб-приложений часто возникает необходимость дождаться исчезновения элемента с страницы. Это может быть индикатор загрузки, всплывающее окно, спиннер или любой другой динамический компонент, который появляется на короткое время. В Protractor для работы с такими сценариями используются ожидания (Expected Conditions).

Использование ExpectedConditions для исчезновения элемента

Protractor предоставляет модуль ExpectedConditions (сокращённо EC), который содержит множество предопределённых условий. Для ожидания исчезновения элемента используется метод invisibilityOf.

Пример базового синтаксиса:

const EC = protractor.ExpectedConditions;
const elementToDisappear = element(by.css('.loader'));

browser.wait(EC.invisibilityOf(elementToDisappear), 5000, 'Элемент не исчез за 5 секунд');

Пояснения:

  • EC.invisibilityOf(element) возвращает функцию, которая проверяет невидимость элемента или его отсутствие в DOM.
  • Второй параметр функции browser.wait — таймаут в миллисекундах.
  • Третий параметр — текст ошибки, которая будет выброшена, если ожидание не выполнено.

Проверка на полное удаление из DOM

Метод invisibilityOf учитывает два состояния элемента:

  1. Элемент невидим, но остаётся в DOM (display: none или visibility: hidden).
  2. Элемент полностью удалён из DOM.

Если требуется убедиться именно в полном удалении, можно использовать дополнительную проверку:

const elementToDisappear = element(by.css('.popup'));

browser.wait(async () => {
    const isPresent = await elementToDisappear.isPresent();
    return !isPresent;
}, 5000, 'Элемент не удалён из DOM за 5 секунд');

Этот подход позволяет быть уверенным, что элемент больше не существует на странице, а не только скрыт.

Сочетание с другими условиями

Часто перед исчезновением элемента требуется, чтобы он сначала появился. В этом случае можно комбинировать условия visibilityOf и invisibilityOf:

const EC = protractor.ExpectedConditions;
const loader = element(by.css('.loader'));

browser.wait(EC.visibilityOf(loader), 3000, 'Индикатор не появился');
browser.wait(EC.invisibilityOf(loader), 5000, 'Индикатор не исчез');

Такой подход обеспечивает корректную последовательность действий: сначала проверка появления, затем исчезновения.

Настройка таймаута и интервалов проверки

Protractor по умолчанию проверяет условие каждые 500 мс, пока не истечёт таймаут. Таймаут можно изменять в browser.wait, а также глобально через конфигурацию allScriptsTimeout или getPageTimeout:

browser.wait(EC.invisibilityOf(loader), 7000, 'Элемент не исчез за 7 секунд');

При необходимости можно создать обёртку для повторного использования:

async function waitForElementToDisappear(el, timeout = 5000) {
    const EC = protractor.ExpectedConditions;
    await browser.wait(EC.invisibilityOf(el), timeout, `Элемент ${el.locator()} не исчез за ${timeout} мс`);
}

Такой подход повышает удобство и читаемость тестов.

Обработка ошибок и исключений

Если элемент не исчез, browser.wait выбрасывает исключение TimeoutError. Для корректного логирования или продолжения выполнения можно использовать конструкцию try/catch:

try {
    await browser.wait(EC.invisibilityOf(loader), 5000);
} catch (err) {
    console.error('Ошибка: элемент не исчез', err);
}

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

Практические рекомендации

  • Для динамических элементов, таких как уведомления или спиннеры, всегда использовать ожидание исчезновения, чтобы предотвратить ошибки взаимодействия с элементами, которые появляются позже.
  • Не использовать browser.sleep(), так как это неэффективно и снижает стабильность тестов.
  • Создавать универсальные функции ожидания для повторного использования в разных тестах.
  • Комбинировать visibilityOf и invisibilityOf, чтобы обрабатывать полный жизненный цикл динамических элементов.

Заключение по практике

Ожидание исчезновения элемента является ключевой частью надежного автоматизированного тестирования в Protractor. Использование ExpectedConditions, правильная настройка таймаутов и обработка ошибок позволяют создавать стабильные и предсказуемые тесты для любых динамических интерфейсов.

Оглавление