Each command in cypress is not iterating all elements in a drop down

Question

I am trying to iterate and click each element of this dropdown but some how my code is skipping the second element and working fine for all other elements.

cy.xpath('//*[@id="apimatic-widget"]/div/div/div[2]/div[1]/div/div[2]/ul').click()

                  cy.get('.rc-menu.rc-menu-sub.rc-menu-vertical').find('li').each(($ele)=>{
                   cy.xpath('//*[@id="apimatic-widget"]/div/div/div[2]/div[1]/div/div[2]/ul').click()
                    cy.wrap($ele).click()
                    cy.wait(2000)
                  })

in first step i am clicking on dropdown widget then in next step i am getting all the element in each, then in each every time i click on dorpdown widget to click on specific element. for second element it is wraping the correct element but clicking on first element.other than that its working fine for all the element.

Answer 1

You can do something like this. This will go over the list elements and select it one by one.

cy.get('#apimatic-widget').click() //to open dorpdown
cy.get('li.rc-menu-item').its('length').as('len') //save the length in alias
cy.get('#apimatic-widget').click() //to close dorpdown
cy.get('@len').then((len) => {
  for (var i = 0; i < len; i++) {
    cy.get('#apimatic-widget').click()
    cy.get('li.rc-menu-item').eq(i).click()
  }
})