I want to click a series of elements in a web page and check if each of those actions produces the correct API request URL. For that, I made an array of settings for each element and iterated over them, clicked the respective element and asserted the results.
The problem is that the assertion for the last element always expects the setting for the first element. I see that this happens because cypress runs async. So, I ended up removing the iteration and just repeated all the action-assertions as shown below. Is there an easy way to make a synchronous for loop instead of the way I have done it below ?
//code to intercept api call aliased as "actionApiCall".
cy.log("Do 1 of 5 actions on a given page")
.then(() => {
const actionSettings = getActionSettings("for action 1");
myPageObject
// clickElement(...) returns a Cypress.Chainable<null> with return cy.wrap(null);
.clickElement(actionSettings)
.wait("@actionApiCall")
.then((intercept) => {
// This assertion checks that the query params of the request URL are per the settings in actionSettings.
AssertActions.assertActionRequest(intercept.request, actionSettings);
});
}).log("Do 2 of 5 actions on a given page")
.then(() => {//do stuff})
.log("Do 3 of 5 actions on a given page")
.then(() => {//do stuff})
..... ETC