mercredi 30 mai 2018

How to count DOM elements in Cypress assertion

I'm trying to count the number of options in a select element, and the number of elements of a certain class in the DOM.

I need to compare the two totals for a Cypress assertion.

I can select the options I need, and iterate over them with each(), and increment a counter that way. However, it's asynchronous, and it's also a clumsy solution. I'm certain that the object yielded by my cy.get() has a length property, I just can't seem to get at it.

Here is one of the things I expected to work. It logs undefined to the console.

cy.get('div[data-cy-type="group-component"]:first').as('firstGroup');
cy.get('@firstGroup').find('[name=group_id]').as('groupSelect');
console.log(cy.get('@groupSelect').children('option').length);

I know my alias is good and my cy.get() is yielding the correct select element.

If I do something like this:

cy.get('@groupSelect').children('option').each(function(){
    console.log(i++);
});

then it will iterate over each option. But it's asynchronous so not very helpful in this flow.

Aucun commentaire:

Enregistrer un commentaire