Relative newbie to Javascript / Cypress here. I am running some tests using the Cypress Cucumber.js plugin. The issue is that I cannot make my steps run in order - the 'Then' steps run before the 'Given etc, due to the asynchronous nature of js. Obviously, this becomes an issue as the tests will fail!
My question:
1) How can we make it such that cucumber steps are always running in order using async code? I saw a similar question here: How to wait for a JavaScript Promise to resolve before resuming function? , and based on the responses I applied async / await to my Given block, hoping it would force an order in my steps however this did not work.
Here is my feature file:
Given I get the data from CMS
Then I can verify that the title is the same as the CMA title in tab "0"
And I can verify that the link is the correct link in tab "0"
Steps:
Given('I get the data from CMS', async() => {
let api = await Api.buildDevApi();
expectedNav = await new NavExpected(api);
console.log('1');
});
Then('I can verify that the title is the same as the CMA title in tab {string}', (index) => {
cy.root().find(".primary-item").eq(index).children().first(".nav-link").as('nav');
cy.get('@nav').should(async(text) => {
let title = await expectedNav.expectedTitle(index);
expect(text.get(0).innerText).to.eq(title);
})
console.log('2');
});
Then('I can verify that the link is the correct link in tab {string}', (index) => {
cy.get('@nav').should(async(url) => {
let link = await expectedNav.expectedLink(index);
expect(url.attr('href')).to.eq(link);
})
console.log('3');
});
Currently, this logs out 2,3,1.
After some searching, I attempted to use the Cypress.Promise to force some order:
Given('I get the data from Prismic T1', () => {
return new Cypress.Promise((resolve) => {
PrismicApi.buildDevApi().then(api => {
expectedNav = new NavExpected(api);
resolve();
console.log('1');
});
});
});
But alas, no luck...the Given still logs last.
Any help would be greatly appreciated, and I'm happy to provide further clarification. :)
