Cypress, If else doesn't work it only going into if condition

Question

I am trying to add else if /switch case in my test , but else if - it goes to only if case, if 'if' fail it doesn't go in else if it's happen in switch case also

it('Deve cadastrar um CNPJ válido', () => {
    cy.get(':nth-child(2) > .kt-header__topbar-wrapper').click()
    cy.get('.kt-header__topbar-item.show > .dropdown-menu > .kt-notification > .kt-notification__custom').should('be.visible')

    cy.visit('/Company/Create')
    cy.contains('Registration of the Establishment').should('be.visible')

    cy.get(':nth-child(2) > .kt-option > .kt-option__control > .kt-radio > span').click()
    cy.contains('Enter the CNPJ of the establishment you want to add below').should('be.visible')

    cy.get('#searchCnpj')
      .type(faker.br.cnpj())
      .should('be.visible')

    cy.get(':nth-child(2) > .form-group > .input-group > .input-group-append > .btn')
      .click()

    cy.contains('Establishment already registered.').then(($message) => {
      if ($message.length > 0) {
        cy.log('Establishment already registered.')
        cy.get('#searchCnpj')
          .clear()
          .type(faker.br.cnpj())

        cy.get(':nth-child(2) > .form-group > .input-group > .input-group-append > .btn').click()
      } else {
        cy.contains('Do you want to register it?').then(($confirmMessage) => {
          if ($confirmMessage.length > 0) {
            cy.log('Do you want to register it?')
            cy.contains('Sim').click()
          }
        })
      }
    })
  })

The error that appears in cypress: Timed out retrying after 4000ms: Expected to find content: 'Estabelecimento já cadastrado.' but never did.

What I want is: Enter CNPJ and click Consult

If the system displays "Establishment already registered", then the cypress must change the cnpj and click on Consult again until the message "Do you want to register" appears and click on "Yes"

If the system displays "Do you want to register it" then you must click "Yes"

Answer 1

there are several things you can try. You can try using "try/catch" and if the condition fails it will execute your "else" part for example. Another approach you could try, which I consider to be the best one, is to have 2 test cases, one for when it's a 'Establishment already registered.' and another one for when 'Do you want to register it?'. If possible the tests should never have logic associated. Let me know if you need additional assistance.

Answer 2

In your code, cy.contains('Establishment already registered.') will be executed no matter what, which means if cypress couldn't find element containing 'Establishment already registered.' the test case will fail. As already stated in the first answer, I believe it's best to make two different test cases for 'Establishment already registered' and 'Do you want to register it?'

Answer 3

The way to do this depends if the message elements exist or are just invisible.

Check the page, see if the message is removed, or just made invisible.

If only one message exists in the DOM

In this case use jQuery Multiple Selector to see which message

const msg1 = 'Establishment already registered'
const msg2 = 'Do you want to register it'
const multiSelector = `:contains(${msg1}), :contains(${msg2})`;

cy.get(multiSelector)         // either msg1 or msg2 will exist
  .then(($message) => {

    // Check which message
    if ($message.text().includes(msg1)) {
      ...
    } else {

    }
  })

If both messages exist in the DOM but one is invisible

In this case add the :visible selector

const msg1 = 'Establishment already registered'
const msg2 = 'Do you want to register it'
const multiSelector = `:contains(${msg1}):visible, :contains(${msg2}):visible`;

cy.get(multiSelector)         // either msg1 or msg2 will be visible
  .then(($message) => {

    // Check which message
    if ($message.text().includes(msg1)) {
      ...
    } else {

    }
  })