Using pages object in Nightwatch JS

Question

I'm using nightwatch "0.8.6". Per the documentation on pages, I've created a pages/login.js file and add the directory to the config file with:

module.exports = {
  url: function() {
    return this.launchUrl;
  }
};

The documentation mentions this.api, but thats not a property of the client / browser. this.launchUrl apparently is available, however.

I changed an existing test to use it:

module.exports = {
  'Login page has a login button' : function (browser) {
    browser
      .url(browser.page.login().url())
      .waitForElementVisible('body', 10000)
      .assert.containsText('button', 'SIGN IN')
      .end();
  }
}

The test now fails. .url tries to open selenium with data:,, instead of the value of this.launchUrl, which is localhost:3000.

The page object is apparently evaluated in the context of the login test, so this in the page object should have this.launchUrl. Diving into the source I see there are also page wrapper objects in the mix, somehow.

How can I use correctly create and use a page object in 0.8.6?

score 6 · Accepted Answer · edited Jan 08 '16 at 14:01

6

I think you can try to add one var to call the login.js page. like this:

module.exports = {
  'Login page has a login button' : function (browser) {

    var LoginPage = browser.page.login();
        LoginPage.navigate();

        LoginPage
         .waitForElementVisible('body', 10000)
         .assert.containsText('button', 'SIGN IN')
         .end();
  }
}

edited Jan 08 '16 at 14:01

Qrzy

186
7

answered Nov 05 '15 at 19:47

Nicole Zhang

76
2

I was just able to get back to this. Not sure if it awarded you a bounty, if not let me know and I'll figure out how do that – Allyl Isocyanate Nov 19 '15 at 17:50

Marty · Answer 2 · 2015-11-20T03:53:38.940

So according to the docs you have to: - "Each page object should be located in a separate file, located in a designated folder. Nightwatch reads the page objects from the folder (or folders) specified in the page_objects_path configuration property."

Have you configured your page_objects_path directory?

Once you have done this you can create a js file in that folder, such as:

module.exports = function(client) {
  return {
    gotoUrl: function() {
      return client
        .url(client.launchUrl);
    },
  };
};

And then you can write your test like:

module.exports = {
  'Login page has a login button': (browser) => {
    browser.page.pagescriptname()
      .gotoUrl()
      .waitForElementVisible('body', 10000)
      .assert.containsText('button', 'SIGN IN')
      .end();
  }
}

Make sure that you have configured launch_url in your nightwatch.js file (or this can be changed dynamically (which I have done for my project) via the nightwatch.conf.js file.

Using pages object in Nightwatch JS

2 Answers2