DEV Community

How to wait for a request to finish before moving on with Cypress

Walmyr on February 12, 2021

Today in "Pinches of Cypress", learn a mechanism to make your tests more robust Imagine an application for notes' creation. After logging into th...

Read full post

Ahmed Rebai • May 23 '22

What about requests done inside the test itself? Cypress will automatically wait for the request to be done?

Walmyr • May 23 '22

Yes, it will.

Mandy • Dec 20 '21

Whenever I use cy. wait with cy.intercept I receive the following error. Do you know any workarounds?
ERROR:
Timed out retrying after 5000ms: cy.wait() timed out waiting 5000ms for the 1st request to the route: file. No request ever occurred.

Code:
cy.intercept('POST','**/file',cvUploadResponse).as('file');

cy.wait('@file');

Walmyr • Dec 22 '21

It seems that requests are taking more than Cypress's defaults for such a thing. A way to work around it would be to overwrite the requestTimeout.
I recommend reading the official docs for timeouts docs.cypress.io/guides/references/....

normanmunge • Nov 15 '22

Have you tried to set the intercept before visiting the page?

Nada Ahmed • Nov 10 '22

I tried to make it 20 seconds but still not working

Walmyr • Nov 10 '22

Where is it now working?
And what do you mean with trying to wait for 20 seconds?
Are you doing cy.wait(20000)?
If that's the case, I don't recommend doing it.
For more info, read docs.cypress.io/guides/references/....

Walmyr • Nov 10 '22

Could you share the code, please?

Nada Ahmed • Nov 11 '22

here is the code I'm using cypress 10, gql
I am trying to filter items and check for the url if contains the filtered query

I added the requestTimeout to check if this will work but it didn't

Walmyr • Nov 11 '22

I see, but without having a chance to play with it, it would be difficult to help you out.
I hope you can find a solution for it, and when you do so, share it here.
Good luck!

Comment deleted

Walmyr • Dec 3 '22

What do you mean? I didn’t get it.

nubTester • Dec 3 '22

I mean when doing a demo for interview, it is safe not doing wait by API or we will get a feedback like: "Waiting for specific API requests to finish, which will cause the tests to break if the implementation is changed.". The use of the tool depends on the circumstances. No tool is always good or always bad... Sometimes the UI is ready to interact (eg clickable but no function) but we need to wait for the API to finish loading the data before the UI can actually interact. So I think waiting for the API isn't quite as bad as they say...

Walmyr • Dec 3 '22

Totally, waiting for a request to finish before moving on is surely a good practice, and it’s even recommended by the Cypress team.
Here’s a chat I had with one of their technical account managers, where we talked about it and other good practices, such as waiting for elements to be visible before interacting with them.
youtu.be/hXfTsdEXn0c

nubTester • Dec 3 '22 • Edited

Thank you, I love the concept of interception in cypress. There is many useful usecase I've done with it like:

Wait API finish before assert/moving UI
Modify the response:
- Filler items in response data so the list item we "care about" will be visible in the screen. It is better for check the video when test failed.
- Sorted the list items in fixed order so we can assert the UI table easier (Just check it line by line). Its useful for case the items created in random order. Without sorting, the code assert will be very complicated because we must find a row that all the cell is match with our expected.
- Force some unsable API response as 200. It useful when we must working on unstable environment and some failed API (not related to the feature we want to test) will cause showing error popup and break out test.
Skip sent request to the backend. With it we can verify all the posibility of UI inputs without change/create data (no need to prepare many data for each input, no need clear data after test...). Wait for the request and check if request body is match with our UI inputs is greater than verify it by check the result in the UI. Because some input not showing in the UI after all.

Any many more...

I am a developer who just switch to qa for a few years, that what I learn from cypress in 6 month working with it. Thank you for your sharing. It help me got more confident with my knowledge...

Walmyr • Dec 3 '22

Yup, I did use it for the same examples too.