Обработка prompt окон

В автоматизированном тестировании веб-приложений часто встречаются ситуации, когда необходимо работать с модальными окнами браузера: alert, confirm и prompt. В JavaScript-приложениях prompt-окна особенно важны, так как позволяют пользователю вводить данные напрямую через браузерное модальное окно. WebdriverIO предоставляет встроенные методы для управления такими окнами, обеспечивая полный контроль над их поведением.


Отличия prompt от alert и confirm

  • Alert — простое уведомление с кнопкой «OK». Не требует ввода данных.
  • Confirm — окно с вариантами «OK» и «Cancel». Возвращает логическое значение: true при нажатии OK, false при Cancel.
  • Prompt — окно с полем для ввода текста и кнопками «OK» и «Cancel». Возвращает введённый текст или null, если нажата Cancel.

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


Методы WebdriverIO для работы с окнами

WebdriverIO предоставляет глобальные методы для взаимодействия с модальными окнами:

  1. browser.getAlertText() Возвращает текст текущего alert/confirm/prompt окна. Полезно для проверки содержимого prompt перед вводом.

  2. browser.sendAlertText(text) Используется только для prompt-окон. Позволяет ввести текст в поле ввода.

  3. browser.acceptAlert() Нажимает кнопку «OK» на любом модальном окне.

  4. browser.dismissAlert() Нажимает кнопку «Cancel».

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


Пример обработки prompt

describe('Prompt handling in WebdriverIO', () => {
    it('should input text into prompt and accept', async () => {
        await browser.url('/prompt-demo');

        // Вызываем prompt через JS
        await browser.execute(() => {
            window.prompt('Введите имя пользователя:', '');
        });

        // Получаем текст prompt
        const promptText = await browser.getAlertText();
        console.log('Prompt text:', promptText); // "Введите имя пользователя:"

        // Вводим текст в prompt
        await browser.sendAlertText('John Doe');

        // Подтверждаем prompt
        await browser.acceptAlert();

        // Проверяем результат на странице
        const result = await $('#result').getText();
        console.log('Result:', result); // "Вы ввели: John Doe"
    });

    it('should dismiss prompt without input', async () => {
        await browser.url('/prompt-demo');

        await browser.execute(() => {
            window.prompt('Введите имя пользователя:', '');
        });

        await browser.dismissAlert();

        const result = await $('#result').getText();
        console.log('Result:', result); // "Вы ввели: null"
    });
});

В этом примере демонстрируются два сценария: ввод текста и нажатие «OK», а также отмена prompt с помощью «Cancel». Метод execute используется для программного вызова prompt в тестируемом приложении.


Рекомендации по работе с prompt

  • Проверка наличия окна: перед вызовом методов sendAlertText, acceptAlert или dismissAlert полезно убедиться, что окно действительно открыто. Используется browser.isAlertOpen() (возвращает true/false).
if (await browser.isAlertOpen()) {
    await browser.sendAlertText('Test');
    await browser.acceptAlert();
}
  • Асинхронное выполнение: методы взаимодействия с prompt асинхронны. Всегда использовать await, чтобы избежать ошибок выполнения.

  • Логирование текста: получение текста окна через getAlertText() помогает убедиться в правильности ожидаемого сообщения и использовать его в assertions.

  • Тестирование разных сценариев: проверка как успешного ввода, так и отмены prompt повышает надежность тестов.


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

Попытка взаимодействия с prompt до его появления вызывает ошибку. Для безопасного выполнения можно использовать блок try-catch:

try {
    if (await browser.isAlertOpen()) {
        await browser.sendAlertText('Sample Text');
        await browser.acceptAlert();
    }
} catch (error) {
    console.error('Prompt не появился или уже закрыт', error);
}

Такой подход предотвращает падение теста при непредвиденных ситуациях.


Интеграция с assertion

Prompt часто используется для ввода данных, которые затем проверяются на странице. Например:

await expect($('#result')).toHaveText('Вы ввели: John Doe');

Совмещение методов WebdriverIO для работы с prompt и встроенных assertion позволяет создавать полные end-to-end сценарии для форм и модальных взаимодействий.


Особенности браузеров

  • Большинство современных браузеров полностью поддерживают методы WebdriverIO для prompt.
  • Некоторые headless-браузеры могут игнорировать prompt при автоматическом запуске. В таких случаях рекомендуется использовать методы execute для обхода или мокирования window.prompt.

Практические советы

  • Для повторного использования кода рекомендуется создать утилитный метод:
async function handlePrompt(inputText = '', accept = true) {
    if (await browser.isAlertOpen()) {
        if (inputText) await browser.sendAlertText(inputText);
        accept ? await browser.acceptAlert() : await browser.dismissAlert();
    }
}
  • Это упрощает сценарии тестирования с множественными вызовами prompt в разных тестах.

  • Проверка текста окна и введённого значения перед и после обработки повышает стабильность тестов и облегчает диагностику ошибок.


Обработка prompt окон является важной частью автоматизации интерфейсов с пользовательским вводом. В WebdriverIO она реализована через ясный и мощный набор методов, которые позволяют эффективно управлять всеми сценариями: ввод данных, подтверждение, отмена и проверка результатов.