Cypress Cucumber - How do I make my steps run in order?

Question

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. :)

Answer 1

我正在使用赛普拉斯的Typescript和Cucumber预处理器以及同步运行的功能文件中的所有步骤，请查看版本和示例： Test Repo Cypress-Cucumber-Typescript