Проблема:

  • В некоторых редких случаях, когда мы автоматизируем приложения, мы сталкиваемся с такими полями, как "DatePicker", которые установлены "только для чтения".
  • Это также можно автоматизировать, однако давайте будем честными и согласимся, что это утомительная работа, особенно когда нам нужно выбрать какую-то конкретную дату в прошлом или будущем.
  • Более того, не стоит обращать внимание и прилагать усилия и время, по крайней мере, всякий раз, когда доступен лучший подход или обходной путь, который может сэкономить много времени и усилий.

Решение:

  • Теперь, что, если я скажу, что мы можем удалить этот атрибут только для чтения, а затем мы можем писать дату так же, как при обычном наборе текста. Вы будете в восторге, верно?
  • Да, мы можем удалить этот атрибут только для чтения с помощью jQuery в паре строк кода, и это в основном все.
  • Здесь я объясню на примере для Puppeteer с фреймворком CodeceptJS, однако логика останется такой же и для других фреймворков. Просто синтаксис изменится.

Пример:

<input type="text" class="column_activeFrom" id="stu" readonly="readonly">
  • Выше приведен пример объекта DatePicker, который мы будем использовать для объяснения.
  • Поскольку jQuery — это многофункциональная библиотека, разработанная для облегчения удовлетворения потребностей JS для веб-сайтов.
  • метод removeAttr — один из встроенных методов удалит атрибут readOnly для указанного элемента, поэтому мы можем напрямую ввести дату, которая ранее была ограничена.

Синтаксис: $(селектор).removeAttr(атрибут)

Здесь,

  • Селектор = элемент, который мы хотели изменить. В этом примере это селектор или локатор для DatePicker.
  • Атрибут = используется для указания одного или нескольких атрибутов, которые необходимо удалить. Несколько атрибутов можно разделить с помощью оператора пробела. В нашем случае это «Только для чтения».

Теперь нам нужно определить локатор/селектор для нашего элемента Datepicker. У нас есть много возможных способов. Здесь я показываю три пути,

  1. С идентификатором: #stu
  2. С тегом: вход
  3. С классом: input.column_activeFrom

С помощью Puppeteer с CodeceptJS:

I.executeScript(function () {
 $('input.column_activeFrom').removeAttr("readonly");
});

Надеюсь, это поможет, и спасибо за чтение!

Ссылки: