javascript - 在页面对象 api 和主 nightwatch api 之间切换

Question

我正在使用带有 nightwatch 的页面对象模型进行测试。与元素交互有困难，因此被迫执行一些 jquery。 Execute 不是页面对象 api 中可用命令子集的一部分，因此为了使用它，我必须调用完整的 nightwatch 命令 api。 (有关此内容的更多信息，请访问 https://github.com/nightwatchjs/nightwatch/wiki/Page-Object-API )我的问题是如何在执行语句后返回到页面对象 api。

我的页面对象是这样的:

elements: {
  nameInput: 'input[name="name"]',
  billingEmail: 'input[name="billingEmail"]',
  licenseNumber: 'input[name="licenses.total"]',
  licensePrice: 'input[name="subscription.price"]',
  hardwareModel: 'input[name="model"]',
  hardwareQuantity: 'input[name="quantity"]',
  hardwarePrice: 'input[name="price"]',
  customerEmail: 'input[name="customerEmail"]',
  createButton: 'button[name="createAccount"]',
  cancelButton: 'button[name="cancel"]',
},


inputClientDetails (name, email) {
    this
      .waitForElementVisible('body', 10000)
      .setValue('@nameInput', name)
      .setValue('@billingEmail', email)
      .setValue('@licenseNumber', '10')
      .setValue('@licensePrice', '9.99')
      .api.execute(function () {
          $('.datepicker--wrapper').find('input[type=text]').val('2017-08-30').trigger($.Event("keydown", {keyCode: 40}));
      })
      .setValue('@hardwareModel', 'Test model')
      .setValue('@hardwarePrice', '9.99')
      .setValue('@hardwareQuantity', '10')
      .setValue('@customerEmail', email)
      .click('@createButton')
    return this.api;
},

当我运行测试时，出现错误:错误:无法定位元素:“@hardwareModel”，使用:css 选择器

当我在页面对象中没有执行语句时，就没有问题。那么访问主nightwatch api后是否可以返回页面对象api呢？我尝试在函数中添加 return 语句，但没有成功。

Answer 1

一旦调用.api.whatever()， 您通过链接调用的函数也使用 .api (即浏览器)。

更好的方法是将函数分成两部分，而不链接整个函数。

inputClientDetails (name, email) {
var client=this.api;
this
  .waitForElementVisible('body', 10000)
  .setValue('@nameInput', name)
  .setValue('@billingEmail', email)
  .setValue('@licenseNumber', '10')
  .setValue('@licensePrice', '9.99')
//now use client-browser
client.execute(function () {
      $('.datepicker--wrapper').find('input[type=text]').val('2017-08-30').trigger($.Event("keydown", {keyCode: 40}));
  })
//Now back to page object
this.setValue('@hardwareModel', 'Test model')
  .setValue('@hardwarePrice', '9.99')
  .setValue('@hardwareQuantity', '10')
  .setValue('@customerEmail', email)
  .click('@createButton')
return this.api;
//either this.api or this doesn't matter, but this.api if you still have other chained function based on browser.
}