Cypress - for loop [duplicate] - cypress

Question

This question already has an answer here:
Cypress - calendar change month, until specific month is found
(1 answer)
Closed last month.
I have a date picker where I want to click the left arrow till I go to April 2022.
First I will open the calendar and then I am using a loop. Here I am going to check whether the selected month is April, if not I am going to continue to click the left arrow. Please tell me whether this is correct.
myFunction() {
for (let i = 1; i <= 11; i += 1) {
cy.get('[style=""] > .CalendarMonth > .CalendarMonth_caption').should('have.text','April 2022')
cy.get('.DayPickerNavigation_leftButton__horizontalDefault > .DayPickerNavigation_svg__horizontal').click()
}
}

Answer 1

We cannot use Loops in cypress. However we can create methods similar to that. I had similar issue where I have to select a date range i.e. start and end date and click download. We have to create recursive method to navigate through months till we get the month we need.
Here is the method I created:
const curr_month = ["January","February","March","April","May","June","July","August","September","October","November","December"];
const d = new Date();
let name = curr_month[d.getMonth()];
cy.log("Name of Current Month" +name);
// ABOVE CODE WILL GIVE YOU CURRENT MONTH VALUE TO COMPATE LATER IN IF BLOCK
var monthNow;
// To go into previous months till september and select September 1
function changeMonth() {
cy.get(<CSS selector till, it contains the text of Month>).then((monthValue) => {
monthNow = monthValue.text();
cy.log("Month VALUE is " +monthNow);
if(monthNow.toLowerCase() != "september") //i have to reach till September
{
cy.get(<LEFT Arrow CSS Selector>).click();
cy.log("Left Arrow Clicked on Calendar");
changeMonth(); //Till it does not reach September, keep making recursive calls
}
else
{
cy.log("September Month Active");
}
}) //closing then
} // closing function
Hope this helps, if you still need it.

Answer 2

Why not using the each class from Cypress.
it('Navigating questions until 33 from bottom arrows works correctly: OK', ()=> {
let answers = [];
answers.length = 33
cy.wrap(answers).each((num, i, array) => {
cy.get('[data-cy="exam-bottom-right-nav"]').click({force: true});
});
cy.wrap(answers).each((num, i, array) => {
cy.get('[data-cy="exam-bottom-left-nav"]').click({force: true});
});
});