Menu
How to check if an element has multiple classes? Couldn't find anything on the official docs, only:
cy.get('form').find('input').should('have.class', 'disabled')
or
expect($el).to.have.class('foo')
When inserting multiple class names, I get an error:
expect($el).to.have.class('foo bar baz')
Is there a solution?
747
To get HTML elements with both classes, we can use the getElementsByClassName or querySelectorAll methods. We call getElementsByClassName with 'class1 class2' to get the div with both class1 and class2 present. Likewise, we can do the same with querySelectorAll by using the “. class1.
HTML elements can be assigned multiple classes by listing the classes in the class attribute, with a blank space to separate them. If the same property is declared in both rules, the conflict is resolved first through specificity, then according to the order of the CSS declarations.
How can I check that the element has any of the two classes? cy. get(selector). invoke('attr','class').
To specify multiple classes, separate the class names with a space, e.g. <span class="left important">. This allows you to combine several CSS classes for one HTML element.
One way is to chain multiple assertions together using cy.and():
cy.get('div')
.should('have.class', 'foo')
.and('have.class', 'bar')
.and('have.class', 'baz')
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
