编写页面特定的命令

概述

您可以使用 `commands` 属性将自定义命令添加到页面对象。这是一种封装页面逻辑的有效方法，否则这些逻辑将存在于测试中或多个测试中。

Nightwatch 将在页面或部分的上下文中调用该命令。诸如 `pause` 之类的客户端命令可通过 `this.api` 获取。为了进行链接，每个函数都应返回页面对象或部分。

示例

在这种情况下，命令用于封装单击提交按钮的逻辑

nightwatch/pages/samplePage.js 
const googleCommands = {
  submit: function() {
    this.api.pause(1000);
    

    return this.waitForElementVisible('@submitButton', 1000)
      .click('@submitButton')
      .waitForElementNotPresent('@submitButton');
  }
};


module.exports = {
  commands: [googleCommands],
  elements: {
    searchBar: {
      selector: 'input[type=text]'
    },
    submitButton: {
      selector: 'input[name=btnK]'
    }
  }
};

然后测试很简单
module.exports = {
  'Test': function (browser) {
    var google = browser.page.google();
    google.setValue('@searchBar', 'nightwatch')
      .submit();
    

    browser.end();
}
};

基于类的页面命令

从 Nightwatch 2 开始，还可以将页面命令导出为 ES6 类。

这是一个基本示例

nightwatch/pages/commands/basicCommands.js 
module.exports = class {
  basicCommand() {
    return {
      basicResult: 'from-helper-class'
    };
  }
  

  dropdownSelect() {
    return this;
  }
  

  dropdownSelectByText() {
    return this;
  }
  

  name() {
    return this;
  }
};

对于更详细的示例... 您可以通过 `this.page` 引用主页面对象。该类将自动实例化，您无需执行任何其他操作，只需编写它即可

nightwatch/pages/realcommands.js 
module.exports = class RealCommands {
  customFindElements(selector, callback = function(r) {return r}) {
    return this.page.findElements({
      selector,
      suppressNotFoundErrors: true
    }, function(result) {
      return callback(result ? result.value: []);
    });
  }
  

  async customFindElementsES6(selector) {
    const result = await this.page.findElements({
      selector,
      suppressNotFoundErrors: true
    });
    

    return result;
  }
};

推荐内容