Cypress test timeouts when using promises

Question

This is my test:

const getUrl = async () => {
  return new Cypress.Promise((resolve, reject) => {
    cy.url().then((url) => {
      resolve(url);
    });
  });
};

const getUrlAndCount = async (previousCount) => {
  const data = {
    url: await getUrl(),
  };
  return data;
};

describe('Search Page', () => {
  beforeEach(() => {
    cy.visit(Cypress.config('baseUrl'));
  });

  it('loads every property page', async () => {
    const stateData = [await getUrlAndCount()];
    cy.visit(Cypress.config('baseUrl') + '/property-for-rent');
    stateData.push(await getUrlAndCount());
  });
});

When I run it through cypress open it works with Chrome 97. When I run it from the command line with --browser chrome it shows the same version - 97, but it times out and fails CypressError: Cypress command timeout of 4000ms exceeded. Even if using --headed.

As Im new to cypress, I wonder if something is wrong or am I using it wrong. Seeing that lots of things require callbacks to get the result I opted for using promises.

Answer 1

The cypress run command is running slow than cypress open, try to increase your wait time (average is 20 seconds)

you can do that by adding this to your cypress.json file

"defaultCommandTimeout": 20000,
"requestTimeout": 20000,
"retries": {
  "runMode": 2,
  "openMode": 0
},

Answer 2

Cypress is generally not happy with async/await, see this issue and the long discussion inside it.

To reduce the number of callback you may try either cypress-promise or cypress-thenify libraries. However, each of them has it's own limitations.

Answer 3

There are different way to do it:

Method 1:

Use it in Command.

cypress run --config pageLoadTimeout=30000

Method 2:

Add it in cypress.json file.

"defaultCommandTimeout": 30000,
"requestTimeout": 30000,