Search code examples
javascriptautomationdrop-down-menucypress

Getting option is not iterable error in Cypress


I have a drop down element with 4 options, I want to verify all of them using below code. But I am getting option is not "Iterable" error.

it('Verify the value of Request Type drop down', function() 
    {
        cy.get('#MailForm > div:nth-child(6) > select').find('option').then(option => {
        const actual = [...option].map(o => o.value)
        expect(actual).to.deep.eq(["Sales Request"])

      })
    })

If I remove the ... from

const actual = [...option].map(o => o.value) and pass const actual = [option].map(o => o.value), it giving Array [undefined] error.

can someone please suggest me.

HTML Code:

<select name="request_type" required="required" class="form-control"><option value="">Select Request Type</option>
<option value="Sales Lead">Sales Lead</option>
<option value="Add Insurance">Add Insurance</option>
<option value="Price Match">Price Match</option></select>

Solution

  • You only have one option "Sales Request", which is why it's not iterable.

    Check the length of options

    cy.get('#MailForm > div:nth-child(6) > select').find('option')
      .then($options => {
        const actuals = $options.length > 1 ? [...$options].map(o => o.value)
          : [$options[0].value]
    
        expect(actuals).to.deep.eq(["Sales Request"])