DEV Community

Cucumber.js with TypeScript

Elliot DeNolf on March 29, 2019

Originally posted on my blog at https://elliotdenolf.com/posts/cucumberjs-with-typescript Cucumber.js is the JavaScript implementation of Cucumb...
Collapse
 
domorodec profile image
Martin

Hello, could you pls tell me what is advantage instead of using cucumber scenario? I don´t understand what is plus to use cucumber-tsflow.

We write scenarion in cucumber like -
Then Change user to MO
And I accept the request from private inbox with state xxx

And code look the same as in your example of course with different logic. I can also even create class and make it export to use it on more places so .... I don´t know why to use cucumber-tsflow.

Collapse
 
denolfe profile image
Elliot DeNolf

The differences will be how step definitions are written, not the feature files.

The main benefit I see is that it provides type annotations, which allow the code to be extremely clean and understandable. Without these annotations, the code must have a lot of wrapping functions, which make the code harder to re-use. The documentation shows some examples worth looking at.

Collapse
 
domorodec profile image
Martin

Why this shows me error telling that declaration expected after @waitForSpinnerToEnd()

@then(/I wait for spinner to end/)
public static waitForSpinner() {
@waitForSpinnerToEnd()
}

export const waitForSpinnerToEnd = async () => {
await World.page.waitFor(200);
await World.page.waitFor(() => !document.querySelector('.spinner-three-bounce'), {visible: true});
};

Collapse
 
ohadr profile image
OhadR

question regarding Timeouts. In cucumber's steps it is possible to change the timeout per step (read here: github.com/cucumber/cucumber-js/bl...). I cannot figure how it is possible to do so using the cucumber-tsflow :-(

any idea?

Collapse
 
ohadr profile image
OhadR • Edited

great article.

worth to mention hooks... i.e. Before ==>@before in the Step file

Collapse
 
bmoescoderoom profile image
Bmoe

Hi. How would I mock objects with this cucumber setup? Jasmine provides spies out of the box but cucumber does not.

Collapse
 
pnakhat profile image
pnakhat

Hi can you put JSON and HTML reporter example in this project (Using typescript ?)

Collapse
 
denolfe profile image
Elliot DeNolf

The link to the full source is at the bottom of the article. Take a look at the cucumber.js file.