Cucumber is a framework to help testers, developers, and business analysts practice Behavior Driven Development (BDD). In BDD, the business analysts, developers, and testers all write their test cases first (test cases are written in terms of end user behavior) before any software is built. They write their test cases in an easy to understand language called Gherkin. Then the developers take these test cases and use it to write software. The testers take the test cases and start automating them. Since they agreed to write their test cases first there should be no misinterpretation between business analysts, developers, and testers. Below, we will automate test cases using Cucumber, JavaScript, and Selenium. In this example, I will demonstrate how to search for the phrase “Canada” on DuckDuckGo.com and verify the Wikipedia link appears on the first page. Note I will be doing this on a Windows machine but you would easily do this on a Mac.
How to Automate your test cases using Cucumber, Selenium, and Javascript
Step 1 Create a New Folder for Your Project
Open the command prompt and create a project called cucumber-javascript. I placed the project here “C:\projects\cucumber-javascript\”
Step 2 Install Cucumber
Once you have created your directory run the command “npm install cucumber”. If you cannot run this command be sure to download Node.js
Step 3 Install Selenium WebDriver
Step 4 Install Chrome Driver
In order to use Chrome, you need to install Chrome Driver. Simply type, npm install chromdriver
Step 5 Initialize Cucumber
Step 6 Write your first Gherkin Statement
First, you will need to go into your features directory and write a Gherkin Script to search DuckDuckGo.
Step 7 Run Cucumber
Step 8 Add Step Definition
Now you need to copy and paste the code that cucumber dumped out in the previous step into the step definition file. Now go into \features\step_definitions file and add the file DuckDuckGo.js
Step 9 Add Code for Step Definitions
The next step is to add code for the methods created by cucumber. Note in the screenshot below I removed the parameter “callback” in the methods.
Step 10 Configure env.js
When you go into your features/support folder you will find an env.rb file. This is a ruby file but since we are writing in JavaScript we need to create an env.js file. This file will basically instruct cucumber that we are going to use Chrome.
Step 11 Configure hooks.js
The hooks file will simply close the browser once your test case has finished executing.
Step 12 Run Cucumber
