Nightwatch.js Overview

Nightwatch.js :

Nightwatch.js is an automated testing framework for web applications and websites, written in Node.js and using the W3C WebDriver API (formerly Selenium WebDriver). easy to use End-to-End testing solution for browser based apps and websites, written on Node.js. It uses the W3C WebDriver API to perform commands and assertions on DOM elements.

Nightwatch.js
Nightwatch.js

Setup Nightwatch.js :

Install the dependencies using the below command.
$ npm install nightwatch

Once its completed need to install development dependencies.
1.GeckoDriver
$ npm install geckodriver --save-dev
2.ChromeDriver
$ npm install chromedriver --save-dev
3.Microsoft WebDriver
$ DISM.exe /Online /Add-Capability /CapabilityName:Microsoft.WebDriver~~~~0.0.1.0
4.SafariDriver
$ safaridriver --enable
You can pick anyone from the there, depents on your browser agent.

Supported Browsers :

  • 1.Mozilla
  • 2.Chrome
  • 3.IE( Microsoft Edge )
  • 4.Safari

Simple Program :

Step 1: Create your project with package.json

$ npm init

Step 2 : Install important dependencies ,

$ npm install nightwatch 
$ npm install geckodriver --save-dev
$ npm install chromedriver --save-dev

Step 3:Create nightwatch.conf.js

var seleniumServer = require(‘selenium-server’);
var chromedriver = require(‘chromedriver’);
var geckodriver = require(‘geckodriver’);

var config = {
src_folders: [
// Folders with tests
‘tests/features’
],
output_folder: ‘reports’, // Where to output the test reports
selenium: {
// Information for selenium, such as the location of the drivers ect.
start_process: true,
server_path: seleniumServer.path,
port: 4444, // Standard selenium port
cli_args: {
‘webdriver.chrome.driver’: chromedriver.path,
‘webdriver.gecko.driver’: geckodriver.path
}
},
test_workers: {
// This allows more then one browser to be opened and tested in at once
enabled: true,
workers: ‘auto’
},
test_settings: {
default: {
screenshots: {
enabled: false
},
globals: {
// How long to wait (in milliseconds) before the test times out
waitForConditionTimeout: 5000
},
desiredCapabilities: {
// The default test
browserName: ‘chrome’,
javascriptEnabled: true,
acceptSslCerts: true,
nativeEvents: true
}
},
// Here, we give each of the browsers we want to test in, and their driver configuration
chrome: {
desiredCapabilities: {
browserName: ‘chrome’,
javascriptEnabled: true,
acceptSslCerts: true,
nativeEvents: true
}
},
firefox: {
desiredCapabilities: {
browserName: ‘firefox’,
javascriptEnabled: true,
acceptSslCerts: true,
nativeEvents: true
}
},
safari: {
desiredCapabilities: {
browserName: ‘safari’,
javascriptEnabled: true,
acceptSslCerts: true,
nativeEvents: true
}
}
}
};

module.exports = config;

Step 4 :Next create nightwatch.json

{
“src_folders” : [“tests”],

“webdriver” : {
“start_process”: true,
“server_path”: “node_modules/.bin/chromedriver”,
“port”: 9515
},

“test_settings” : {
“default” : {
“desiredCapabilities”: {
“browserName”: “chrome”
}
}
}
}

Step 5: Create tests/features/my.test.js

module.exports = {
‘Title is Bing’: function(browser) {
// Browser is the browser that is being controlled
browser
.url(‘https://www.bing.com’) // Navigate to the url
.waitForElementVisible(‘body’, 5000) // Wait until you can see the body element.
.verify.title(‘Bing’) // Verify that the title is ‘Bing’
.end() // This must be called to close the browser at the end
}
}

# Note

Your package.json will looks like

{
“name”: “nightwatch”,
“version”: “1.0.0”,
“description”: “Sample Test”,
“main”: “nightwatch.conf.js”,
“directories”: {
“test”: “tests”
},
“dependencies”: {
“chromedriver”: “^2.45.0”,
“geckodriver”: “^1.14.1”,
“nightwatch”: “^1.0.18”,
“selenium-server”: “^3.141.59”
},
“devDependencies”: {},
“scripts”: {
“nightwatch”: “nightwatch -c nightwatch.conf.js -e chrome,firefox”
},
“author”: “”,
“license”: “ISC”
}

#NOTE : If your using in windows please remove safari from the scripts because it will raise exception like execution command not found

Step 6: Now you can run your test script using

$ npm run nightwatch

Step 7 : Once test process is completed you will get the result will looks like

Try Another program: Spring Boot

Download Source Code :

Sample project

2 Responses

  1. Great, I really like it! Youre awesome

Leave a Reply

Your email address will not be published. Required fields are marked *