Node.js End-to-End Testing with Nightwatch.js

In this article, we are going to take a look at how you can do end-to-end testing with Node.js, using Nightwatch.js, a Node.js powered end-to-end testing framework.

In the previous chapter of Node.js at Scale, we discussed Node.js Testing and Getting TDD Right. If you did not read that article, or if you are unfamiliar with unit testing and TDD (test-driven development), I recommend checking that out before continuing with this article.

What is Node.js end-to-end testing?

Before jumping into example codes and learning to implement end-to-end testing for a Node.js project, it’s worth exploring what end-to-end tests really are.

First of all, end-to-end testing is part of the black-box testing toolbox. This means that as a test writer, you are examining functionality without any knowledge of internal implementation. So without seeing any source code.

Secondly, end-to-end testing can also be used as user acceptance testing, or UAT. UAT is the process of verifying that the solution actually works for the user. This process is not focusing on finding small typos, but issues that can crash the system, or make it dysfunctional for the user.

Enter Nightwatch.js

Nightwatch.js enables you to “write end-to-end tests in Node.js quickly and effortlessly that run against a Selenium/WebDriver server”.

Nightwatch is shipped with the following features:

• a built-in test runner,
• can control the selenium server,
• support for hosted selenium providers, like BrowserStack or SauceLabs,
• CSS and Xpath selectors.

Installing Nightwatch

To run Nightwatch locally, we have to do a little bit of extra work — we will need a standalone Selenium server locally, as well as a webdriver, so we can use Chrome/Firefox to test our applications locally.

With these three tools, we are going to implement the flow this diagram shows below.

Photo credit: nightwatchjs.org

STEP 1: Add Nightwatch

You can add Nightwatch to your project simply by running npm install nightwatch --save-dev.

This places the Nightwatch executable in your _./node_modules/.bin_ folder, so you don't have to install it globally.

STEP 2: Download Selenium

Selenium is a suite of tools to automate web browsers across many platforms.

Prerequisite: make sure you have JDK installed, with at least version 7. If you don’t have it, you can grab it from here.

The Selenium server is a Java application which is used by Nightwatch to connect to various browsers. You can download the binary from here.

Once you have downloaded the JAR file, create a bin folder inside your project, and place it there. We will set up Nightwatch to use it, so you don't have to manually start the Selenium server.

STEP 3: Download Chromedriver

ChromeDriver is a standalone server which implements the W3C WebDriver wire protocol for Chromium.

To grab the executable, head over to the downloads section, and place it to the same bin folder.

STEP 4: Configuring Nightwatch.js

The basic Nightwatch configuration happens through a json configuration file.

Let’s create a nightwatch.json file, and fill it with:

{ "src_folders" : ["tests"], "output_folder" : "reports",

 "selenium" : {  "start_process" : true,  "server_path" : "./bin/selenium-server-standalone-3.3.1.jar",  "log_path" : "",  "port" : 4444,  "cli_args" : {   "webdriver.chrome.driver" : "./bin/chromedriver"  } },

 "test_settings" : {  "default" : {   "launch_url" : "http://localhost",   "selenium_port" : 4444,   "selenium_host" : "localhost",   "desiredCapabilities": {    "browserName": "chrome",    "javascriptEnabled": true,    "acceptSslCerts": true   }  } }}

With this configuration file, we told Nightwatch where can it find the binary of the Selenium server and the Chromedriver, as well as the location of the tests we want to run.

Quick Recap

So far, we have installed Nightwatch, downloaded the standalone Selenium server, as well as the Chromedriver. With these steps, you have all the necessary tools to create end-to-end tests using Node.js and Selenium.

Writing your first Nightwatch Test

Let’s add a new file in the tests folder, called homepage.js.

We are going to take the example from the Nightwatch getting started guide. Our test script will go to Google, search for Rembrandt, and check the Wikipedia page:

module.exports = { 'Demo test Google' : function (client) {  client    .url('http://www.google.com')    .waitForElementVisible('body', 1000)    .assert.title('Google')    .assert.visible('input[type=text]')    .setValue('input[type=text]', 'rembrandt van rijn')       .waitForElementVisible('button[name=btnG]', 1000)       .click('button[name=btnG]')    .pause(1000)    .assert.containsText('ol#rso li:first-child',    'Rembrandt - Wikipedia')   .end()  } }

The only thing left to do is to run Nightwatch itself! For that, I recommend adding a new script into our package.json's scripts section:

"scripts": {  "test-e2e": "nightwatch"}

The very last thing you have to do is to run the tests using this command:

npm run test-e2e

If everything goes well, your test will open up Chrome, then Google and Wikipedia.

Nightwatch.js in Your Project

Now as you understood what end-to-end testing is, and how you can set up Nightwatch, it is time to start adding it to your project.

For that, you have to consider some aspects — but please note, that there are no silver bullets here. Depending on your business needs, you may answer the following questions differently:

• Where should I run? On staging? On production? When don I build my containers?
• What are the test scenarios I want to test?
• When and who should write end-to-end tests?

In this chapter of Node.js at Scale we have learned:

• how to set up Nightwatch,
• how to configure it to use a standalone Selenium server,
• and how to write basic end-to-end tests.

In the next chapter, we are going to explore how you can monitor production Node.js infrastructures.

Originally published at blog.risingstack.com on March 21, 2017.