cypress: Is it possible to handle errors during `.get`? We need to put a retry process in place.

[QUESTION]

Is possible handler .get error? Because I need retry process case element not exists in DOM.

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Reactions: 32
  • Comments: 22 (3 by maintainers)

Most upvoted comments

There are loads of scenario in which a system under test could legitimately behave differently at a given time. It could be due to data variations, system readiness, preset conditions etc. So in web testing elementA or elementB may show at a given point in the web navigation, both scenario are valid. A good test script should be able to handle this. If cypress cannot handle this kind of if (get elementA) else (get elementB) scenario, it is a major drawback.

The problem here is likely your approach.

There is not and will never be a way to catch or recover from errors in Cypress. The moment error handling is introduced would create a scenario where it becomes logically impossible to consistently reproduce a test case.

It’s like trying to write a test that tests whether a process may crash. The problem is that you have no idea if or when it would crash. So to write a test you’d basically have to construct arbitrary time requirements. If the process does not crash in 10 seconds, or if the process does not crash in 10 days. Else you’d be waiting potentially until the heat death of the universe because in fact the process may never crash.

Testing in Cypress is the same way. You cannot recover from errors because you the programmer must tell us what and when you expect state to be reached in your application. If you created two flows like - do this IF this thing exists, else do something else if this thing does NOT exist - it’s impossible for a robot to understand when it should or not should give up trying.

I might be way off on my bearings for your question, so let’s approach it more pragmatically:

By default Cypress assumes whenever you cy.get an element - for that element to exist. It will wait around until it does exist or it will time out. If it times, the test fails.

If you want Cypress to wait until the element DOES NOT EXIST, you simply add that as an assertion.

cy.get("button").should("not.exist")

Now we know to retry until the element does not exist, or we time out and the test errors.

However if what you’re asking is - how do I tell Cypress to do something different IF THE ELEMENT DOES NOT EXIST - then that’s the whole problem. How does Cypress know when or when not the element should exist? Should it wait for an arbitrary amount of time? If so how much? It’s logically impossible to dictate fallback strategies because it cannot be known when something will happen, it can only be known when it has already happened.

You could achieve this yourself but if you do this, your tests will not consistently pass or fail if you are using a modern JS framework - because there is no guarantee that what you’re querying for is about to exist.

// we DO NOT RECOMMEND doing this
cy.get("body").then(($body) => {
  // synchronously query for element
  if ($body.find("element").length) {
    // do something
   } else {
    // do something else
   }
})

If what I’ve written is way off, please provide some code to further explain what you’re trying to do.

Hi! First of all, thank you all for maintaining Cypress. It’s been quite useful! But I must weigh in on this issue. It’s necessary for .get to have perhaps a flag/option to not return an assertion. The reason is simple: get(x) assumes that x exists, but asserting existence of elements is a standard testing procedure. This comes from get(x) not being the same as "if exists(x), get(x)", but rather "just get(x) and let's see what happens"

Simplified version of @jacobprouse’s solution

function ifExists (selector) {
  cy.document().then(($document) => {
    const documentResult = $document.querySelectorAll(selector)
    if (documentResult.length) {
      // Do something
    }
  })
}
Cypress.Commands.add('ifExists', ifExists)

Use with cy.ifExists('.myclass')

@big-gulp Cypress retries for you automatically. You can use the timeout option on cy.get to do what you’re describing today:

https://docs.cypress.io/api/commands/get.html#Syntax

cy.get('.sometimes-slow-sometimes-fast', { timeout: 60000 })

There are loads of scenario in which a system under test could legitimately behave differently at a given time. It could be due to data variations, system readiness, preset conditions etc. So in web testing elementA or elementB may show at a given point in the web navigation, both scenario are valid. A good test script should be able to handle this. If cypress cannot handle this kind of if (get elementA) else (get elementB) scenario, it is a major drawback.

Completely agree!

@brian-mann your opinion on this problem is very idealistic. Every complex application has if this do that on certain elements and Cypress should support that.

I’ve had the same issue, in our tests we don’t know what is on the page at load. So if we are testing a page of content for images, we want to skip the image tests if there are no images. We conditionally run our tests by running a command that checks the DOM using the selector with some vanilla js, and either returns it or skips the test.

describe('Images', function () {
  beforeEach(function () {
    cy.getIfExists({ selector: 'img', variableName: 'images' })
  })

  // This test will only run if the there are elements matching the selector on the page.
  it('no external images', function () {
    cy.get('@images')
      ...checks
  })
})

using a custom function that checks the DOM.

// cypress/support/commands.js
/**
 * Conditionally run tests based on the result of a selector. Using this is a (`before`|`beforEach`) hook
 * will skip the entire suite if it doesn't exist on the page by default. In an `it` block it will just skip the current test.
 * To disable this behaviour pass in false for the `skip` parameter.
 * @param {object} param The selector to see if the test subject is on the page.
 * @param {string} param.selector The selector to see if the test subject is on the page.
 * @param {string=} param.variableName The name of the variable to be added to `this` context.
 * @param {boolean=} param.skip Whether or not to call the `this.skip` method in the current block if its not on the page.
 * @returns {Cypress.Chainable<any>} The result of a cy.get() query using the provided selector.
 */
function getIfExists ({ selector, variableName, skip = true }) {
  // Access the document object.
  cy.document().then(($document) => {
  // Perform a search query with the selector.
    const documentResult = $document.querySelectorAll(selector)

    // If there is a result, we want to use Cypress.get() to store the cypress result instead of the vanilla js result.
    if (documentResult.length) {
    // Store it as this.<variable> and return the result. It will be accessiblein siblings and descendants.
    // If we want to store the result as a variable.
      if (variableName) {
      // Store it as this.<variable> and return the result. It will be accessiblein siblings and descendants, and via alias in Cypress commands (i.e. cy.get('@variableName')).
        return cy.get(selector)
          .should('exist')
          .as(variableName)
      } else {
        return cy.get(selector)
          .should('exist')
      }
      // If there are no results, end the test early.
    } else if (!documentResult.length && skip) {
    // Log the reason.
      cy.log('Test subject not in DOM, skipping this test.')
        .then(() => {
        // End the test.
          this.skip()
        })
    } else if (!documentResult.length && !skip) {
      return cy.get(selector)
    }
  })
}

Cypress.Commands.add('getIfExists', getIfExists)

Hope this helps someone! And thank you Cypress team, you’ve made testing a lot easier!

So… is it possible to handle errors during get? Is there a hacky-way to do this?

Is there any update on this feature? To handle if element does not exist?

The problem here is likely your approach.

There is not and will never be a way to catch or recover from errors in Cypress. The moment error handling is introduced would create a scenario where it becomes logically impossible to consistently reproduce a test case.

It’s like trying to write a test that tests whether a process may crash. The problem is that you have no idea if or when it would crash. So to write a test you’d basically have to construct arbitrary time requirements. If the process does not crash in 10 seconds, or if the process does not crash in 10 days. Else you’d be waiting potentially until the heat death of the universe because in fact the process may never crash.

Testing in Cypress is the same way. You cannot recover from errors because you the programmer must tell us what and when you expect state to be reached in your application. If you created two flows like - do this IF this thing exists, else do something else if this thing does NOT exist - it’s impossible for a robot to understand when it should or not should give up trying.

I might be way off on my bearings for your question, so let’s approach it more pragmatically:

By default Cypress assumes whenever you cy.get an element - for that element to exist. It will wait around until it does exist or it will time out. If it times, the test fails.

If you want Cypress to wait until the element DOES NOT EXIST, you simply add that as an assertion.

cy.get("button").should("not.exist")

Now we know to retry until the element does not exist, or we time out and the test errors.

However if what you’re asking is - how do I tell Cypress to do something different IF THE ELEMENT DOES NOT EXIST - then that’s the whole problem. How does Cypress know when or when not the element should exist? Should it wait for an arbitrary amount of time? If so how much? It’s logically impossible to dictate fallback strategies because it cannot be known when something will happen, it can only be known when it has already happened.

You could achieve this yourself but if you do this, your tests will not consistently pass or fail if you are using a modern JS framework - because there is no guarantee that what you’re querying for is about to exist.

// we DO NOT RECOMMEND doing this
cy.get("body").then(($body) => {
  // synchronously query for element
  if ($body.find("element").length) {
    // do something
   } else {
    // do something else
   }
})

If what I’ve written is way off, please provide some code to further explain what you’re trying to do.

This is a relly bad answer to the case that he is presenting

I’m also interested in any solution to this. I have a webpage that is only updated through refreshing, but there’s some data/state I want to test that’s updated by a background process.

If I setup my tests through the API and then navigate to the page, I’m finding that my background process hasn’t completed in time for me to test the scenario I want. This would be in addition to the tests I have before the background process finishes.

my use case is this beforeEach:

cy.visit('my-profile-page')

if (not at my profile page) {
  cy.visit('/cypress-quick-login')
  cy.visit('my-profile-page')
}

Just prevents having to login each time, i just assume you’re usually logged in, but sometimes a test will fail if not logged in. (Note, I’m using firebase and found it difficult implementing a cypress function for login)