Can I create reusable test steps in nightwatch.js?

Question

I am looking to create reusable components within my nightwatch.js tests.

ie. login to the web app, logout of the web app

What is the best method / pattern for creating these steps in a reusable way?

Answer 1

You can create custom commands for that: http://nightwatchjs.org/guide#writing-custom-commands

1. in nightwatch.json specify the path to the folder that will contain your custom command file
2. create a js file and name it how your custom command should be names (ie login.js)
3. write the code you need:

exports.command = function(username, password) {
    
    this
        .waitForElementVisible('#password', 4000)
        .setValue('#password', password)
        .waitForElementVisible('#username', 1000)
        .setValue('#username', username)
        .waitForElementVisible('#sign_in', 1000)
        .click('#sign_in')
        .waitForElementVisible('h1.folder-title', 10000)
        
        return this;
};

4. use the custom command in your test:

.login("your_username", "your_password")

Answer 2

This is typically done with page objects. http://nightwatchjs.org/guide#page-objects

Then you can just

var myPage = client.page.myPage();

myPage.navigate()
  .assert.title('MyPage')
  .login('foo', 'bar)
  .assert.displayName('foo');