How to access ".element" or ".elements" in Page Objects

638 views
Skip to first unread message

Mukesh Panda

unread,
Mar 10, 2017, 3:35:19 PM3/10/17
to NightwatchJs
Hi,

I am using Page Objects in nightwatch. I am trying to use .element() or .elements and having issues.

This is how my Page Object JS and Test JS looks like:

Page Object JS:

'use strict';

var paths = require('../paths.js');

module.exports = {
  url: paths.launchPath,
  elements: {
    email: {
      selector: 'input[placeholder^="Username"]'
    },
    password: {
      selector: 'input[placeholder^="Password"]'
    },
    signInButton: {
      selector: '.btn.btn-lg.btn-orange.pull-right'
    },
    homeIcon: {
      selector: '.navbar-brand'
    },
    studyTab: {
      selector: 'html/body/div[2]/ul[1]/li[2]/a',
      locateStrategy: 'xpath'
    },
    studyListTable: {
      selector: 'html/body/div[4]/div/div[2]',
      locateStrategy: 'xpath'
    },
    studyListTable1: {
      selector: 'html/body/div[4]/div/div[2]/div[1]',
      locateStrategy: 'xpath'
    },
    studyListTable2: {
      selector: 'draft_studies'
    //  locateStrategy: 'xpath'
    },
    loadingAnnimation: {
      selector: '.loading'
    }
  },
  commands: [{
    signIn: function() {
      return this
        .waitForElementPresent('@signInButton', 1000)
        .setValue('@email', 'mpanda')
        .setValue('@password', 'Login123')
        .click('@signInButton')
        .waitForElementPresent('@homeIcon', 50000)
        .assert.elementPresent('@homeIcon', 'Home Icon Present')
        .waitForElementPresent('@studyTab', 50000)
        .click('@studyTab')
        .waitForElementPresent('@studyListTable', 20000)
        .waitForElementPresent('@studyListTable1', 20000)
        .element('css selector', '@studyListTable', function(result) {
                console.log("Element is ... " + result);
              })
      }
  }]
};

Test JS:

'use strict';

module.exports = {

  tags: ['login'],

  before: function(browser) {
    browser.windowMaximize()
  },

  'Login to Admin Panel': function (browser) {
    var login = browser.page.Login();
    login
      .navigate()
      .signIn()
      browser.end();
  }
};

I am having issues accessing .element() in the Page Object JS, but if I do browser.element() in the Test JS it is working well for me.
Can someone please let me know if we can access .element(), .elements() etc( anything from "Web Driver Protocol" ). Right now its failing with an error "TypeError: this.waitForElementPresent(...).setValue(...).setValue(...).click(...).waitForElementPresent(...).assert.elementPresent(...).waitForElementPresent(...).click(...).waitForElementPresent(...).assert.elementPresent(...).waitForElementPresent(...).assert.elementPresent(...).element is not a function".

Just need to know how can we access "Web Driver Protocol" functions from Page Object JS (not from Test JS)

Thanks,
Mukesh

Eric Mumford

unread,
Mar 11, 2017, 9:47:45 AM3/11/17
to NightwatchJs
Browser.api

LiSheng

unread,
Jun 21, 2017, 5:40:47 AM6/21/17
to NightwatchJs
I have same doubts.

LiSheng

unread,
Jun 21, 2017, 5:41:27 AM6/21/17
to NightwatchJs
Would you like to share more details. Thanks.

On Saturday, March 11, 2017 at 10:47:45 PM UTC+8, Eric Mumford wrote:
Browser.api

davidlinse

unread,
Jun 21, 2017, 6:03:31 AM6/21/17
to NightwatchJs
you have to use `.api.elements(...)` from within page-objects. it is all documented in the api-docs btw..

regards

Eric Mumford

unread,
Jun 21, 2017, 2:14:00 PM6/21/17
to nightw...@googlegroups.com
"Same doubts" doesn't tell me anything. If you share code you think should work and does not work, and you say what your goals are, it will help us all help you.

--
You received this message because you are subscribed to a topic in the Google Groups "NightwatchJs" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/nightwatchjs/lFoPjL1hksc/unsubscribe.
To unsubscribe from this group and all its topics, send an email to nightwatchjs+unsubscribe@googlegroups.com.
To post to this group, send email to nightw...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/nightwatchjs/382f6fe7-f5a3-4c5f-8d99-39770ecbbf3c%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

Andrey Morozov

unread,
Jun 21, 2017, 8:52:13 PM6/21/17
to NightwatchJs
test: function() {
     
return this.api.element('css selector', 'element', function(result) {
           console.log('The element is  ' + result)
     
}
}

And I highly recommend avoid chaining commands in page objects, since some of them will require api object, and some won't such as waitForElementVisible()
Reply all
Reply to author
Forward
0 new messages