Cypress - выберите опцию без использования текста или значения

Question

Это то, что я пытаюсь выбрать:

<select id="firstDate" name="firstDate" class="ab-abcd sdfg">
<option disabled="" value="">First day</option>
<option value="01.02.2019">01.02.2019</option>
<option value="01.02.2019">01.02.2019</option>
</select>

Эти даты будут меняться время от времени, поэтому есть способ выбрать опцию с помощью Cypress без использования

cy.get('#firstDate').select('01.01.2019')

?

Я также пытался с

cy.get('#firstDate').first()

, но это не работает.

Answer 1

Я думаю, что лучший способ изменить значение - через .select().Если вы попытаетесь принудительно щелкнуть опцию, она не изменит выбранное значение.

В чем причина изменения этих значений?Если они сгенерированы по запросу сервера, вы можете попытаться заглушить его , например .Если они сгенерированы с учетом текущей даты, вы можете попробовать , используя часы

Редактировать Узнав, что делает селекторы динамическими:

Чтобы исправить дату для ваших тестов и сделатьих можно сделать согласованными

// fix the date before rendering the select
const now = new Date(2019, 01, 15).getTime() //  2019-01-02 timestamp
cy.clock(now)

cy.visit('/index.html') // visit the page to test (or make actions that render the select)
cy.get('#firstDate').select('01.02.2019') // select one month beyond
cy.get('#firstDate').select('01.03.2019') // select two months beyond

Alex

Answer 2

Спасибо за ваши ответы.В то же время найдено решение, которое работает для меня:

    cy.get('#FirstDate')
   .find('option')
   .then($elm => $elm.get(1).setAttribute('selected', "selected"))
   .parent()
   .trigger('change')

Но я также опробую ваши предложения и сообщу вам, что произошло.

Answer 3

Вы были очень близки со второй попыткой, но вы получаете элемент select, а не элементы option.Попробуйте это:

cy.get('select#firstDate').click() // Open the dropdown
cy.get('select#firstDate > option')
  .eq(1) // The second option, because the first is a heading
  .click()