Как я могу ввести значение в каждое поле ввода?

#cypress

Вопрос:

HTML:

 <!-- Block 1-->
<div class="row">
  <div>
    <span>Type</span>
  </div>
  <div>
    <iput class="ant-select-dropdown-menu-item" placeholder="Input value"></iput>
  </div>
</div>
<!-- Block 2-->
<div class="row">
  <div>
    <span>Type</span>
  </div>
  <div>
    <iput placeholder="Input value"></iput>
  </div>
</div>
<!-- Block ..N -->
<div class="row">
  <div>
    <span>Type</span>
  </div>
  <div>
    <iput placeholder="Input value"></iput>
  </div>
</div>

JS:

 for(let i = 0; i < 4; i  ) {
  cy.contains('div', 'Type')
    .next()
    .find('div')
    .eq(i)     
    .click({ multiple: true })

  cy.get('.ant-select-dropdown-menu-item')
    .eq(i)
    .type(`value ${i}`)
}

Существует множество блоков с полем ввода для каждого.
Я хочу ввести значение для каждого из них.
Я делаю цикл, но значение вводится только в первом входном значении. Как я могу решить эту проблему для каждого поля ввода?

Ответ №1:

Вы можете найти все экземпляры элементов, а затем использовать .each() их для перебора.

 cy.contains('div', 'Type')
  .each(($el, index) => {
    cy.wrap($el).siblings('div').click();
    cy.get('.ant-select-dropdown-menu-item').eq(index).type(`value ${index}`);
})

1. значение вводится только при первом вводе

2. У вас есть отдельный список входных данных, которые вы хотите использовать? Или есть несколько возвращаемых значений .ant-select-dropdown-menu-item ? Если это так, вы можете использовать .each() и это get . Я обновлю свой ответ, если это так.

3. Значение вводится в первое поле ввода каждый раз, когда круг

4. Итак, вы хотите повторить все .ant-select-dropdown-menu-item , что найдете?

Ответ №2:

Учитывая , что это элемент ввода <input placeholder="Input value"></input> , вы можете напрямую подать each заявку на это. Я буду рассматривать input в качестве селектора, так как у меня нет точного HTML.

 cy.get('input').each(($ele, index) => {
  cy.wrap($ele).type(`value ${index}`)
})

1. Ваш код похож на предыдущий ответ, и он не работает

2. Код, который я написал, основан на предположении, которое я упомянул в ответе. Чтобы получить точный ответ, пожалуйста, добавьте точный HTML-код страницы, а также укажите, какую ошибку вы получаете.

3. Я не получаю ошибок. У меня проблема в том, что значение вводилось ТОЛЬКО в первом поле ввода каждого цикла

4. добавьте точный HTML-код страницы

5. Мой код не требует дивов. Он непосредственно выполняет итерацию в поле ввода. Поэтому, если код, как вы упомянули в вопросе, в точности похож на исходный HTML, то приведенный выше код должен работать идеально

Ответ №3:

 for(let i = 0; i < 4; i  ) {
      cy.get('*[class^="row "]')
        .eq(i)
        .contains('div', 'Type')
        .next()
        .find('div')
        .eq(i)
        .click({ multiple: true });

    cy.get('.ant-select-dropdown-menu-item')
      .eq(i)
      .type(`value ${i}`)
 }