Is it possible to hold a network request for a while?

[wilcoschoneveld]

I would like to hold off a request and do some interaction and assertions before allowing it to complete. This is to simulate a slow server and to test if the app is interactive while the data is loading.

I'm looking for something like this:

        cy.intercept('GET', '/some/data/endpoint').delayRequest().as('req1');

        cy.get('element').click();

        cy.get('element2').should(...);

        cy.continueRequest('req1');

Is this possible?

Thanks a lot!

[herecydev]

Yes there is a delay option that you can pass to it

https://docs.cypress.io/api/commands/intercept#Arguments

[wilcoschoneveld]

Thanks for your reply!

How would I know exactly how much the delay should be? There is no guarantee that the cypress commands are all finished before the network request comes through.

My hope is to have some deterministic approach for this.

[herecydev]

You can return a promise and manually resolve it:

let complete;

cy.intercept(
  "POST",
  `/foo`,
  (req) => {
    return new Promise((resolve) => {
      complete= resolve;
    }).then(() => {
      req.reply({
        statusCode: 200,
      });
    });
  }
);

cy.findByText("loading...").then(() => {
  complete();
});

[wilcoschoneveld]

Cool! That sounds promising, i'll check it out on monday and will report back. Thanks a lot!

[herecydev]

No worries, let me know how you get on. Obviously it might need some error handling (although cypress will still bomb out after ~4s if it doesnt complete). In addition, if it were me, I would wrap this in a custom command as it's pretty verbose. Would be nice to have a:

const complete = cy.delayedIntercept("POST", "/foo", () => ...)

cy.findByText("loading...").then(() => {
  complete();
});