Codementor Events

BDD Web Automation 06: Generate Cucumber Script with Right Tool

Published Sep 07, 2018Last updated Sep 18, 2018
BDD Web Automation 06: Generate Cucumber Script with Right Tool

Content

  1. Generate a scenario based automation script
  2. Four states of step matching

Generate a scenario based automation script

Cucumber is a behavior driven (BDD) automation test framework that combines natural language descriptions with automation code. In the first article of this series, we explored how to create a Cucumber test script. In this article, we will discuss in detail how the code snippet can be generated with clicks.

If you use just Cucumber.js without any authoring tool, a typical way to generate code stub from feature file is as the following:

  1. Write your own feature file, with scenarios and steps.
  2. Run cucumber on the command line.
  3. If the feature file already has the corresponding code implementation, Cucumber will automatically run the code. Otherwise, Cucumber will print out the code stubs that match the test step text of the feature file.
  4. Developer copy the code stub from the command line output into code editor.

These operations is not so straightforward. And when you need to do it repeatedly, it is even more cumbersome. The operations are needed not only when you create a script, but also during script maintenance. For example, when the scenario text are changed, the existing matching step definitions need to be updated.

With CukeTest, you now have a more elegant way to handle it. The following graph shows you how to do it:

visual_code_editing_en_62397bac.gif

With CukeTest, after we have finished editing a scenario, just click the gray button on the same row, and the step definition, which is the code stub of the step, will be generated automatically in the javascript file you opened on the left panel.

Then what you need to do next is to filling the implementation in the step definition stub.

Four states of step matching

For each step defined in a Cucumber script, it can be in one of four states:

  • Undefined
  • Not implemented
  • Implemented
  • Duplicate implementation

Undefined

For a step text, there is no corresponding step definition code defined, and we call it “undefined”. In CukeTest, for an undefined step the button next to the step is grayed out, like the following picture:

1.png

Not implemented

This means that the step has a corresponding step definition function, but the function returns pending. Returning "pending" means that this function has not been implemented yet. The color of the button in for the step is orange.

2.png

Below is the corresponding code:

Then(/^the search result should contain "([^"]*)"$/, async function (arg1) {
    return 'pending';
});

All auto-generated stubs return “pending”, and the orange button reminds you that you still need to take action to implement it.

Implemented

That is, the step definition function has been implemented. An Implemented function return anything other than “pending” (or don’t return anything). The button color next to a implemented step is green.

3.png

Duplicate implementation

For a certain step, there can be multiple step definition functions match it, which is called “Duplicate implementation”. Duplicate implementations is an error, because Cucumber don't know which step definition function to run when it runs this step.

Note: there can be one step definition function match multiple steps, which is correct, but 1-to-many mapping between step and step definition functions is an error. The duplicate implementation will be displayed with a red button next the steps.

4.png

The code can be:

Then(/^the search result should contain "([^"]*)"$/, async function (arg1) {
    //do something
});

Then(/^the search result should contain "CukeTest"$/, async function (arg1) {
    //do something else
});

These two step definitions, though have different matching expressions, both match the same step text, the first expression use wild card to match and the second use exact string to match. Click on the red button will pop up a dialog box showing which code has caused the duplicate definition and it allows you to navigate to the corresponding location.

6.png

Validate Script

During the development process, the steps of the script may have these four states. When an automation script is finished, all steps should be shown as green, which indicates they have been fully implemented. If the automation script is large. There can be multiple feature files, and validate all steps and scripts one by one is cumbersome. CukeTest provides a one-click checking mechanism to check common script errors, including JavaScript syntax errors, the above four states, etc. Click on an red button will show something like below:

5.png

If there are any errors or warning in feature file or in script file, they will be displayed in the error list, clicking it will navigate you to the line that has the problem.

Previous Post: 05. Create Data Driven Automation Script with Doc String & Data Table
Next Post: 07. Use Chrome Browser for Automation
First Post: 01. Create and Run the First Sample

Discover and read more posts from CukeTest
get started