Getting Started with Nightwatch.js

What is Nightwatch.js

Nightwatch.js is an end-to-end testing framework for web applications. It allows you to write and run automated tests in real web browsers, simulating user interactions to ensure your application behaves correctly. It’s particularly favored for its ease of use and its ability to work with popular browsers like Chrome, Firefox, and Safari.

It is written on the Node.js runtime. NightwatchJS has a clean and simple syntax, so tests can be written swiftly. It comes with a built in test runner, it has support for page objects within the framework, and it can be easily extended to create things like custom reporters.

Why use Nightwatch js over any other Automation tool

Selenium is in high demand for the development of automation frameworks because it offers support for multiple programming languages, facilitates cross-browser testing, and is utilized in both web and mobile application testing.

But Nightwatch.js is built on Node.js platform, and it possesses significant advantages over other Selenium-based solutions. It exclusively uses JavaScript as the programming language for end-to-end testing which has the following advantages –

• JavaScript-Based: Nightwatch.js exclusively uses JavaScript for test scripting, which is widely known and used. This makes it accessible to a broad audience of developers.
• Cross-Browser Testing: Nightwatch.js provides robust support for cross-browser testing, ensuring your web application functions consistently across various browsers.

• Parallel Testing: It allows you to run tests in parallel, which significantly reduces execution time and speeds up the testing process.
• Integrated Test Runner: Additionally, Nightwatch.js comes with an integrated test runner that simplifies test execution and reporting, making it more efficient for teams.
• Support for Page Object Model (POM): It supports the Page Object Model design pattern, enhancing test maintainability and readability.
• Continuous Integration (CI) : Nightwatch.js can seamlessly integrate with popular CI/CD platforms, such as Jenkins and Travis CI, making it suitable for automated pipeline testing.
• Versatile Assertions: In addition, it offers a wide range of built-in assertions for verifying elements, rendering it suitable for various testing scenarios. To illustrate, here are some examples of assertions in Nightwatch.js:

assert.visible(selector):  // Checks if an element with the specified selector is visible on the page.

assert.hidden(selector): // Checks if an element with the specified selector is hidden.

How does Nightwatch.js works

Nightwatch uses a RESTful API protocol defined by the W3C WebDriver API. It requires a RESTful HTTP API in conjunction with a Selenium JavaScript WebDriver server.To execute any operation, whether it’s a command or an assertion, Nightwatch typically involves the exchange of at least two requests. The process as follows:

• The initial request is responsible for identifying the necessary element using the provided XPath expression or CSS selector.
• The subsequent request takes the identified element and carries out the actual operation, which could be a command or an assertion.

Setting up a new project

let’s create a new Nightwatch.js project.

Prerequisites

Before we dive into Nightwatch.js, we need to have a few things set up:

• Node.js: Make sure you have Node.js installed on your system. If not, you can download it from the official website.

• Text Editor/IDE: You’ll need a code editor or integrated development environment (IDE) to write your Nightwatch.js tests. Popular choices include Visual Studio Code, Sublime Text, and WebStorm.

• Web Browser: You’ll also need at least one web browser installed on your computer, as Nightwatch.js will automate browser interactions. We will use Chrome browser in our example.

Initialize a Node.js project

Open your terminal and navigate to the directory where you want to create your Nightwatch.js project. Then, run the following command to initialize a new Node.js project:

npm init -y

Install Nightwatch.js

Now, you can install Nightwatch.js as a development dependency in your project:

npm install nightwatch --save-dev

This will download and install Nightwatch.js, and it will be listed in your package.json file under devDependencies.

Create configuration files

Nightwatch.js uses configuration files to specify test settings and browser configurations. You can generate a configuration file by running the following command:

npx nightwatch --init

This will create a nightwatch.conf.js file in your project folder. Open the nightwatch.conf.js file in your code editor and locate the test_settings section. Here, you can specify the browser settings for your test.

Create a tests folder in your project and locate src_folders: [] in nightwatch.conf.js file , add tests in the array for example src_folders: ['tests'].

Install chromedriver/geckodriver and save as dev dependency for running the execution on the required browser.

npm install chromedriver --save-dev

npm install geckodriver --save-dev

Write your first Nightwatch.js test.

module.exports = {
    'My First Test': function (browser) {
      browser
        .url('https://www.google.co.in/')
        .waitForElementVisible('#APjFqb')
        .assert.title('Google')
        .end();
    }
  };

This test navigates to the “https://www.google.co.in/” URL, waits for the body element to become visible, and asserts that the page title is “Google”.

Run your test

To run your Nightwatch.js test, use the following command in your terminal:

npx nightwatch

Nightwatch.js will execute your test in the browser you specified in the configuration file and provide you with the test results in the terminal.

Conclusion

Nightwatch.js works by allowing you to write test scripts, configure test execution settings, interact with real web browsers, make assertions about your web application’s behavior, and generate detailed test reports. It’s a powerful tool for automating the testing of web applications, ensuring their functionality and reliability. You can explore advanced features, for example creating custom commands, organizing tests using the Page Object Model (POM).