Skip to main content

Cucumber JS with Selenium: Tutorial to Run Your First Test on LambdaTest


In this topic, you will learn how to configure and run your JavaScript automation testing scripts on LambdaTest Selenium cloud platform using JavaScript framework Cucumber.

Objective


By the end of this topic, you will be able to:

  1. Set up an environment for testing your hosted web pages using CucumberJS framework with Selenium.
  2. Understand and configure the core capabilities required for your Selenium test suite.
  3. Run test cases in parallel using JS with Selenium to reduce build times.
  4. Test your locally hosted pages on LambdaTest platform.
  5. Explore advanced features of LambdaTest.

Note: All the code samples in this documentation can be found in the LambdaTest's Repository on GitHub. You can either download or clone the repository to quickly run your tests.

Prerequisites For Running CucumberJS Test Automation Scripts Using Selenium


Before getting started with Selenium automation testing on LambdaTest, you need to:

  • Download and install NodeJS from official NodeJS website. You should be having NodeJS v6 or newer.
  • Make sure you are using the latest version of JavaScript.
  • Install npm from the official npm website.
  • Download Selenium JavaScript bindings from the official website. Latest versions of Selenium Client and WebDriver are ideal for running your JavaScript automation testing script on LambdaTest’s Selenium Grid.

Installing Selenium Dependencies and tutorial repo

Step 1: Clone the LambdaTest’s NodeJs-Cucumber-Selenium repository and navigate to the code directory as shown below:

git clone https://github.com/LambdaTest/NodeJs-Cucumber-Selenium
cd NodeJs-Cucumber-Selenium

Step 2: Install the required project dependencies using the command below:

npm install

Setting up Your Authentication

Make sure you have your LambdaTest credentials with you to run test automation scripts on LambdaTest Selenium Grid. You can obtain these credentials from the LambdaTest Automation Dashboard or through LambdaTest Profile.

Step 3: Set LambdaTest Username and Access Key in environment variables.

  • For Linux/macOS:
export LT_USERNAME="YOUR_USERNAME" export LT_ACCESS_KEY="YOUR ACCESS KEY"
  • For Windows:
set LT_USERNAME="YOUR_USERNAME" set LT_ACCESS_KEY="YOUR ACCESS KEY"

Run Your First Test


Sample Test with CucumberJS

The example mentioned below would help you to execute your Cucumber JS Testing automation testing-

//nodejs-cucumber-todo/features/todo.feature
Feature: Automate a website
Scenario: perform click events
When visit url "https://lambdatest.github.io/sample-todo-app"
When field with name "First Item" is present check the box
When field with name "Second Item" is present check the box
When select the textbox add "Let's add new to do item" in the box
Then click the "addbutton"
Then I must see title "Sample page - lambdatest.com"

Step 4: Now create step definition file.

//nodejs-cucumber-todo/features/step_definitions/todo.js
/*
This file contains the code which automate the sample app.
It reads instructions form feature file and find matching
case and execute it.
*/


'use strict';

const assert = require('cucumber-assert');
const webdriver = require('selenium-webdriver');

module.exports = function() {

this.When(/^visit url "([^"]*)"$/, function (url, next) {
this.driver.get('https://lambdatest.github.io/sample-todo-app').then(next);
});

this.When(/^field with name "First Item" is present check the box$/, function (next) {
this.driver.findElement({ name: 'li1' })
.click().then(next);
});

this.When(/^field with name "Second Item" is present check the box$/, function (next) {
this.driver.findElement({ name: 'li3' })
.click().then(next);
});

this.When(/^select the textbox add "([^"]*)" in the box$/, function (text, next) {
this.driver.findElement({ id: 'sampletodotext' }).click();
this.driver.findElement({ id: 'sampletodotext' }).sendKeys(text).then(next);
});

this.Then(/^click the "([^"]*)"$/, function (button, next) {
this.driver.findElement({ id: button }).click().then(next);
});

this.Then(/^I must see title "([^"]*)"$/, function (titleMatch, next) {
this.driver.getTitle()
.then(function(title) {
assert.equal(title, titleMatch, next, 'Expected title to be ' + titleMatch);
});
});
};

Step 5: Now create cucumber js framework runner file.

//nodejs-cucumber-todo/scripts/cucumber-runner.js
#!/usr/bin/env node
/*
This is parallel test runner file.
It creates child processes equals the number of
test environments passed.
*/
let child_process = require('child_process');
let config_file = '../conf/' + (process.env.CONFIG_FILE || 'single') + '.conf.js';
let config = require(config_file).config;

process.argv[0] = 'node';
process.argv[1] = './node_modules/.bin/cucumber-js';

const getValidJson = function(jenkinsInput) {
let json = jenkinsInput;
json = json.replace(/\\n/g, "");
json = json.replace('\\/g', '');
return json;
};

let lt_browsers = null;
if(process.env.LT_BROWSERS) {
let jsonInput = getValidJson(process.env.LT_BROWSERS);
lt_browsers = JSON.parse(jsonInput);
}

for( let i in (lt_browsers || config.capabilities) ){
let env = Object.create( process.env );
env.TASK_ID = i.toString();
let p = child_process.spawn('/usr/bin/env', process.argv, { env: env } );
p.stdout.pipe(process.stdout);
}

Configuration of Your Test Capabilities

Step 6: In conf/single.conf.js file, you need to update your test capabilities. In this code, we are passing browser, browser version, and operating system information, along with LambdaTest Selenium grid capabilities via capabilities object. The capabilities object in the above code are defined as:

 capabilities: [{
browserName: 'chrome',
platform: 'Windows 10',
version: 'latest',
name: "cucumber-js-single-test",
build: "cucumber-js-LambdaTest-single"
}]

You can generate capabilities for your test requirements with the help of our inbuilt Capabilities Generator tool.

Executing the Test

Step 7: The tests can be executed in the terminal using the following command

npm run single

Your test results would be displayed on the test console (or command-line interface if you are using terminal/cmd) and on LambdaTest automation dashboard. LambdaTest Automation Dashboard will help you view all your text logs, screenshots and video recording for your entire automation tests.

Running Your Parallel Tests Using Cucumber Framework


Executing Parallel Tests with Cucumber

To run parallel tests using CucumberJS, we would have to execute the below command in the terminal:

npm run parallel

Your test results would be displayed on the test console (or command-line interface if you are using terminal/cmd) and on LambdaTest automation dashboard.

Testing Locally Hosted or Privately Hosted Projects


You can test your locally hosted or privately hosted projects with LambdaTest Selenium grid cloud using LambdaTest Tunnel app. All you would have to do is set up an SSH tunnel using LambdaTest Tunnel app and pass toggle tunnel = True via desired capabilities. LambdaTest Tunnel establishes a secure SSH protocol based tunnel that allows you in testing your locally hosted or privately hosted pages, even before they are made live.

Refer our LambdaTest Tunnel documentation for more information.

Here’s how you can establish LambdaTest Tunnel.

Download the binary file of:

Open command prompt and navigate to the binary folder.

Run the following command:

LT -user {user’s login email} -key {user’s access key}

So if your user name is lambdatest@example.com and key is 123456, the command would be:

LT -user lambdatest@example.com -key 123456

Once you are able to connect LambdaTest Tunnel successfully, you would just have to pass on tunnel capabilities in the code shown below :

Tunnel Capability

const capabilities = {
tunnel: true,
}

Executing the local tests

To run local tests using CucumberJS, we would have to execute the below command in the terminal:

npm run local

Executing all the tests

To run all the tests at once using CucumberJS, we would have to execute the below command in the terminal:

npm run test

If you wish to set up your CucumberJS testing through Jenkins, then refer to our Jenkins documentation.


Test across 3000+ combinations of browsers, real devices & OS.

Book Demo