I want to search for an element and if I don't find it, find a second element:

cy.get(@firstElement).or(@secondElement).click()

Is there some function I can use like || in conditions?

I want to search for an element and if I don't find it, find a second element:

cy.get(@firstElement).or(@secondElement).click()

Is there some function I can use like || in conditions?

• javascript
• typescript
• testing
• automated-tests
• cypress

3 Answers 3

The , for OR condition will not work if firstElement loads asynchronously.

Using the mand

cy.get('firstElement, secondElement')      // no retry on firstElement

It goes straight to secondElement even if firstElement appears just 10ms later, or is animating.

So this technique skips the Cypress retry mechanism, which is why Cypress does not mention it in the docs.

One way I can see to make it work when firstElement is asynchronous is to catch the fail event.

Note
Cypress docs say to only use the fail event for debugging, but Cypress do use it in their own tests.

Cypress.once('fail', () => {             // "once" means catch fail for next mand only
  console.log('Clicking secondElement')
  Cypress.$('secondElement').trigger('click')
})

cy.get('firstElement', { log: false })   // retry for 'firstElement' but suppress log
  .click()                               // never executes this if 'firstElement' fails

May be too late but might help someone looking for the solution -

This can be achieved using the :is Pseudo-class The :is pseudo-class allows you to bine multiple selectors:

cy.get(':is(selector1, selector2)')

You can use the ma , to do an OR condition if you are using css selectors. Something like:

cy.get('firstElement,secondElement').click()