Nightwatch Parlance

Nightwatch has its own little semantic world. It’s a world that, while not “on fleek”, makes a lot of sense to me. In a teamgramming context I add a gang of comments if introducing new tech or use thereof. In introducing a new type of UI test to a project at Netflix, I decided to explain some of the Nightwatch parlance. I’ve transposed some of that here for y’all.

Elements

Elements start with an @ and allow you to have improved semantics within a Nightwatch test context. CSS selectors are typical either more verbose or more terse than elements in Nightwatch parlance.

Commands

Commands give you the ability to extend the Nightwatch API w/ your own methods.

Tags

Tags allow you to flexibly group your tests according to your own organization principles, allowing you to execute subsets of all tests.
Within a spec it looks like this:

1
2
3
4
5
6
function createNotepadTestRunner () { }
module.exports = {
tags: [ 'sanity', 'ancillary' ],
NotepadTest: createNotepadTestRunner()
}

An example of leveraging this in concert w/ NPM scripts:

1
2
3
4
5
6
{
"scripts": {
"test:ancillary": "npm t -- --tag ancillary",
"test": "nightwatch -c ./config/nightwatch.js --env chrome"
}
}

Web driver

A web driver is a piece of software that allows you to manipulate a website using the web client’s native interface. Selenium is the web driver, written in Java, that Nightwatch provides a beautiful JavaScript API for. Nightwatch supports most everything Selenium does. It also achieves the remarkable feat of being familiar to both Selenium devs new to JavaScript and JavaScript devs unfamiliar w/ Selenium.