Методы взаимодействия: clear()

Метод clear() в Protractor используется для очистки содержимого элементов ввода, таких как текстовые поля (input) или текстовые области (textarea). Этот метод играет ключевую роль при тестировании форм, где необходимо удалять предзаполненные значения перед вводом новых данных. В отличие от обычного присвоения значения через sendKeys(''), clear() выполняет действие, максимально приближенное к поведению пользователя.

Основной синтаксис

element(by.css('селектор')).clear();
  • element(by.css('селектор')) — локатор элемента на странице.
  • clear() — метод, удаляющий текущее содержимое элемента ввода.

Метод возвращает Promise, что требует использования async/await для корректного выполнения в асинхронной среде JavaScript.

await element(by.id('username')).clear();

Использование с sendKeys()

После очистки поля часто требуется ввести новые данные. Метод clear() удобно комбинировать с sendKeys():

const usernameInput = element(by.id('username'));

await usernameInput.clear();
await usernameInput.sendKeys('newUser123');

Важный момент: последовательность clear → sendKeys гарантирует, что старые данные полностью удалены перед вводом новых.

Особенности работы метода clear()

  1. Работа с элементами, содержащими значение по умолчанию Если поле имеет предзаполненное значение, clear() полностью его удаляет. Например:

    <input type="text" id="email" value="test@example.com">
    await element(by.id('email')).clear();

    После выполнения clear() значение поля будет пустой строкой.

  2. Неочевидные случаи с readonly и disabled

    • Если элемент имеет атрибут readonly, метод clear() не будет работать, поскольку поле не редактируется.
    • Если элемент disabled, метод также не выполнит очистку, так как браузер блокирует ввод.

  3. Асинхронная природа метода Все действия Protractor асинхронны, поэтому clear() следует использовать с await или через цепочки then():

    element(by.id('inputField')).clear().then(function() {
    element(by.id('inputField')).sendKeys('New value');
});

Интеграция с ожиданиями

Часто необходимо убедиться, что поле стало пустым перед дальнейшими действиями. Для этого используют ExpectedConditions:

const EC = protractor.ExpectedConditions;
const input = element(by.id('username'));

await input.clear();
await browser.wait(EC.textToBePresentInElementValue(input, ''), 5000);

Здесь browser.wait гарантирует, что поле действительно пустое перед выполнением следующих шагов теста.

Работа с несколькими элементами

Метод clear() можно использовать не только с одиночными элементами, но и с коллекциями:

const inputs = element.all(by.css('.form-input'));

await inputs.each(async function(input) {
    await input.clear();
});

Каждое поле в коллекции будет очищено последовательно.

Проблемы совместимости

  • В некоторых браузерах старых версий clear() может не удалять содержимое полностью, особенно если используются специальные символы или форматированные поля.
  • Для полей типа contenteditable метод clear() не применим, потребуется использовать sendKeys с комбинацией клавиш Ctrl+A + Delete:
await editableField.sendKeys(protractor.Key.chord(protractor.Key.CONTROL, "a"), protractor.Key.DELETE);

Резюме по clear()

  • Полностью очищает содержимое элементов ввода.
  • Асинхронный метод, требует await или обработки Promise.
  • Эффективно комбинируется с sendKeys() для ввода новых данных.
  • Не работает с readonly и disabled полями, а также с contenteditable.
  • Может использоваться для одиночных элементов и коллекций через each().
  • Рекомендуется проверять результат очистки через ExpectedConditions.

Метод clear() является базовым инструментом для точного контроля над формами в тестах Protractor и обеспечивает надёжное удаление данных перед вводом новых значений.

Оглавление