CODEWITHSUNDEEP
cypress
Александр
Александр

Reputation: 317

How can I input value in the each input field?

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}`)
}

There are many bloks with input field for each. I want to input value for each. I make cycle but value is inputted only in the first input value. How can I solve this for each input field?

Upvotes: 0

Views: 793

Answers (3)

Александр
Александр

Reputation: 317

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}`)
 }

Upvotes: 0

Alapan Das
Alapan Das

Reputation: 18650

Considering this is the input element <input placeholder="Input value"></input>, you can directly apply each on this. I will consider input as the selector as I don't have the exact HTML.

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

Upvotes: 1

agoff
agoff

Reputation: 7125

You could find all instances of the elements and then use .each() to iterate over them.

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}`);
})

Upvotes: 1

Related Questions