javascriptnode.jsnpmautomated-testscypress

How to solve Cypress "this page was cleared by navigating to about:blank" issue on Cypress 13.14.1?

I, and my team, are running Cypress 13.14.1 on Node 20.17.0 and npm 10.8.2.

For over a year this has been working fine - we have a about 80 tests that we run (from our local machines) at least a few times a week.

All of a sudden these tests have began to fail on the last step (it block). It appears that on the last test step Cypress opens a blank page to clear the browser cache for the next test. (Cypress documentation says: "When test isolation is enabled, Cypress resets the browser context before each test by: clearing the dom state by visiting about:blank")

However, it appears with our test suite the last step has not finished running yet and so it fails to find the elements or data it is meant to test against on the blank page.

Investigation seems to indicate that this is a known issue that has occurred with several other people:

A possible solution mentioned was to add testIsolation: false, to the cypress.config.js file, but I had already included that a long time ago.

There was also mention of updating to Cypress 14+, but due to my workplace's strict security around installing software and npm packages we are stuck on 13.14.1 for now.

I do have a 'hack' that gets around this were I simply add a blank it block at the end of each test so it runs last, eg:

describe('I am on a page', () => {
    // Bunch of other normal it blocks...

    // Usual last 'it' block
    it('checks the footer sections has working links and correct date', () => {
       // footer section helper function:
       checkFooterLinksAndDate(dateVar);
    });

    it('decoy it block', () => {
      // I don't do a thing...
    });
});

This works (because the blank pages opens on the 'decoy it block', but the deploy it block doesn't query the DOM so nothing breaks) but obviously isn't ideal or a proper solution.

I've tried a bunch of other things as well, including:

If it helps, my cypress.config.js file is as such:

const { defineConfig } = require("cypress");
const fs = require('fs');

module.exports = defineConfig({
  viewportWidth: 1400,
  viewportHeight: 1000,
  retries: {
    runMode: 1,
    openMode: 0
  },
  e2e: {
    testIsolation: false,
    baseUrl: 'https://www.ourdomain.com',
    setupNodeEvents(on, config) {
      on('task', {
        log(message) {
          console.log(message)
          return null
        },
        fileExists(filename) {
          if (fs.existsSync(filename)) {
            return fs.readFileSync(filename, 'utf8')
          }
          return null
        },
      })
    },
    specPattern: ["cypress/e2e/**/*.spec.js"],
  },
});

Would anyone know what I could possibly do to fix this problem (at least until we can update to 14)?

Solution

  • OK, so not technically a proper answer but a solution none-the-less:

    It was the retries.

    In my config file I had:

      retries: {
    runMode: 1,
    openMode: 0
  },

    Which re-ran the test step once if it failed. My last step was failing (for normal reasons) and so Cypress was trying to re-run it BUT at the same time it was loading a blank page to clear its cache and moving on to the next test.

    I updated this to

     retries: {
    runMode: 0,
    openMode: 0
  },

    and it now works correctly (though it is no longer retesting failed tests of course).

    There was a fix for this in later versions of Cypress: https://github.com/cypress-io/cypress/pull/30864