javascript - 如何使用intern测试框架正确设计页面对象

Question

我正在使用 theintern 创建功能测试框架。我想使用“页面对象”对我的测试进行建模，因为我希望代码可以重用。

原文documentation ，有一个非常简化的示例，展示了如何使用一种名为“登录”的方法创建页面对象。
在此示例中，该方法的所有逻辑都位于该方法本身内部。

我想创建一个页面对象，它代表比登录页面稍微复杂一点的页面，并且能够重用页面内的组件来执行不同的操作。

这是我想要做的示例:

// in tests/support/pages/IndexPage.js
define(function (require) {
  // the page object is created as a constructor
  // so we can provide the remote Command object
  // at runtime
  function IndexPage(remote) {
    this.remote = remote;
  }

  function enterUsername(username) {
    return this.remote
      .findById('login').click().type(username).end();
  }
  function enterPassword(pass) {
    return this.remote
      .findById('password').click().type(pass).end();
  }

  IndexPage.prototype = {
    constructor: IndexPage,

    // the login function accepts username and password
    // and returns a promise that resolves to `true` on
    // success or rejects with an error on failure
    login: function (username, password) {
      return this
        .enterUsername(username)
        .enterPassword(password)
        .findById('loginButton')
        .click()
        .end()
        // then, we verify the success of the action by
        // looking for a login success marker on the page
        .setFindTimeout(5000)
        .findById('loginSuccess')
        .then(function () {
          // if it succeeds, resolve to `true`; otherwise
          // allow the error from whichever previous
          // operation failed to reject the final promise
          return true;
        });
    },

    // …additional page interaction tasks…
  };

  return IndexPage;
});

请注意我如何创建 enterUsername 和 enterPassword 方法。
这是因为我想在同一页面对象的其他测试中重用这些方法。问题是我无法链接这些方法，它不起作用。

可以链接的方法都返回 Command 对象，但是当我链接我的方法时，它们没有在 Command 方法上定义，因此第一个方法得到调用(在我的示例中是 enterUsername)，但第二个失败，显然是因为 enterPassword 没有在 Command 对象上定义。

我想知道如何对页面对象进行建模，以便可以重用页面对象中的部分代码，但仍然拥有像这样的流畅语法。

提前致谢:)

Answer 1

最简单的解决方案是使用您的方法作为 then 回调处理程序，例如:

function enterName(username) {
    return function () {
        return this.parent.findById('login').click().type(username);
    }
}

function enterPassword(password) {
    return function () {
        return this.parent.findById('password').click().type(pass).end();
    }
}

IndexPage.prototype = {
    constructor: IndexPage,

    login: function (username, password) {
        return this.remote
            .then(enterUsername(username))
            .then(enterPassword(password))
            .findById('loginButton')
            // ...
    }
}