Работа с браузерными комбинациями

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

1. Основы работы с клавишами

WebdriverIO использует объект browser для управления сессией и объект Keys для работы с специальными клавишами. Ключевые моменты:

  • Метод keys() позволяет отправлять нажатия клавиш в текущую активную область браузера.
  • Поддержка модификаторов: Control, Shift, Alt, Meta (Command на Mac).
  • Последовательные нажатия можно передавать в виде массива.

Пример отправки простой клавиши:

await browser.keys('Enter');

Для комбинаций с модификаторами используется массив:

await browser.keys(['Control', 'a']); // Выделить весь текст
await browser.keys('Control');       // Нажать Control
await browser.keys('a');             // Нажать 'a'
await browser.keys('NULL');          // Отпустить Control

Метод 'NULL' освобождает все удерживаемые модификаторы.

2. Работа с текстовыми вводами

Для полей ввода важно правильно комбинировать обычные символы и специальные клавиши:

const input = await $('#username');
await input.setValue('admin');       // Ввод текста напрямую
await input.addValue(['Tab', 'password123']); // Перемещение на следующее поле и ввод
  • setValue очищает поле перед вводом.
  • addValue добавляет текст к существующему содержимому.
  • Можно комбинировать текст и клавиши для создания сложных сценариев.

3. Комбинации клавиш для управления страницей

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

await browser.keys(['Control', 't']); // Открыть новую вкладку
await browser.keys(['Control', 'w']); // Закрыть текущую вкладку
await browser.keys(['Control', 'r']); // Перезагрузить страницу
await browser.keys(['ArrowDown']);    // Прокрутка вниз
await browser.keys(['PageUp']);       // Прокрутка вверх

Для Mac клавиша Meta используется вместо Control.

4. Модификаторы в комбинациях

Комбинации с несколькими модификаторами обрабатываются через массив:

await browser.keys(['Control', 'Shift', 'n']); // Новое окно в режиме инкогнито
await browser.keys('NULL');                    // Сброс модификаторов

Важно всегда использовать 'NULL', иначе WebdriverIO будет считать модификаторы удерживаемыми и возможны непредсказуемые результаты.

5. Сценарии с динамическими клавиатурными комбинациями

Иногда требуется вводить сложные последовательности, включая задержки или циклические действия:

const sequence = ['a', 'b', 'c', 'Backspace', 'd'];
for (const key of sequence) {
    await browser.keys(key);
}

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

6. Кросс-браузерные нюансы

  • Не все комбинации одинаково поддерживаются в разных браузерах. Например, Alt+Tab не может быть перехвачена браузером для переключения окон.
  • Специальные клавиши (F1-F12, Home, End) могут вести себя по-разному в Chrome, Firefox и Edge.
  • Для сложных сочетаний рекомендуется проверять поведение на целевых браузерах.

7. Интеграция с элементами страницы

Метод keys() можно комбинировать с выборкой элементов через $ и $$:

const inputField = await $('#search');
await inputField.click();
await browser.keys(['Control', 'a']); // Выделение всего текста
await browser.keys('Backspace');       // Удаление текста

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

8. Примеры практических комбинаций

  1. Выделение и копирование текста
await browser.keys(['Control', 'a']);
await browser.keys(['Control', 'c']);
await browser.keys('NULL');
  1. Переключение между вкладками
await browser.keys(['Control', 'Tab']); // Следующая вкладка
await browser.keys(['Control', 'Shift', 'Tab']); // Предыдущая вкладка
await browser.keys('NULL');
  1. Сценарий ввода с корректировкой
await $('#username').setValue('admni');
await browser.keys('Backspace'); // Исправление ошибки
await browser.keys('n');         // Корректный символ

9. Рекомендации по организации тестов

  • Использовать отдельные функции для часто применяемых комбинаций.
  • Всегда очищать модификаторы через 'NULL'.
  • В сложных сценариях вводить небольшие задержки между нажатиями для стабильности.
  • Проверять кросс-браузерность, особенно для нестандартных клавиш.

Работа с клавишами в WebdriverIO позволяет создавать надежные и реалистичные автоматизированные сценарии, которые имитируют поведение настоящего пользователя, обеспечивая гибкость тестирования интерфейсов и сложных взаимодействий.

Оглавление