Skipping Cypress tests on first failure and save resources in CI-CD

Cypress is going great way in ensuring developers their project is working flawlessly. I pretty much hope you are aware how to cover your project modules by writing cypress test and making them execute for each of them. However sometimes it becomes imperative to stop remaining tests once a test fails. Reason:

1. The further tests could possibly fail because of a failing test and it needs to be fixed first.
2. You can save unnecessary hits to your website and database.
3. If cypress test is running in CI pipeline. You can save your pipeline job execution time and cost and generate a clean cypress report.

Knowing the above reasons by now I guess you would be excited to know the way to skip the tests. So lets get going for it.

Lets start with the theory first. The idea behind it is to have a cookie that we set to some value when test fails. And before executing a test suite we will check this cookie value and decide if we want to skip particular test suite. The good part is we only need to add code in our cypress/support/index.js file.

afterEach(function onAfterEach() {
  if (this.currentTest.state === ‘failed’) {
    cy.setCookie(‘shouldSkip’, ‘true’);
    //set cookie to skip tests for further specs
    Cypress.runner.stop();
    //this will skip tests only for current spec
  }
});

The above afterEach() function runs after each it() assertion and checks if test failed. If yes then it does couple of things.

1. stop execution of remaining tests in current spec file.
2. set shouldSkip cookie value to true.

before(() => {
  if ( Cypress.browser.isHeaded ) {
    cy.clearCookie('shouldSkip')
  } else {
    cy.getCookie('shouldSkip').then(cookie => {
      if (
        cookie && 
        typeof cookie === 'object' && 
        cookie.value === 'true'
      ) {
        Cypress.runner.stop();
      }
    });
  }
});

The above before() function executes once before each spec file and stops the testing of spec file if shouldSkip cookie value is set to true. Ok let me expound you the logic behind if( Cypress.browser.isHeaded ) {}

Cypress can run in head (browser) mode or headless (browser is hidden) mode. In headless mode all tests run in one go once command is fired (provided we dont pass — spec flag) whereas in head mode each spec file executes only when clicked on it. So we are deleting the shouldSkip cookie so that tests do run if clicked on spec file in head mode.

There you go! All the code is now in place to skip the tests if it failed. Just one last thing. Cypress automatically clears all cookies before each test to prevent state from building up. So we have to avoid that because we need shouldSkip cookie all through. Here is how we will be doing it.

Cypress.Cookies.defaults({
  whitelist: 'shouldSkip',
});

We will be just whitelisting it so Cypress doesn’t clear it.

Thank you for reading and give me a shout out for any help needed in it.