Question

刚开始学习ES6，我想用Protractor测试页面。首先，我想创建基本Web元素类，页面上的其他元素将从基类继承。

量角器具有选择器，您可以使用它们来选择元素并使用它们进行操作，例如单击：

var button = element(by.css('.button'));
button.click();

所以基本上我想创建这样的东西：

class BaseElement {
  constructor(selector){
    this._element = element(selector);
  }
var button = new BaseElement(by.css('.button));
button.click();

由于某种原因，它不起作用：

button.click();//button is an instance of base class BaseElement

它返回点击不是函数。

我可以添加一些方法＆＃34;点击＆＃34;上课，或者＆＃34;得到＆＃34;方法，就像下面的例子，但我需要知道我可能错过了一些基本原则并完全错误。在Protractor中有许多原生的，内置的元素函数，我不想在基类中为所有这些函数编写方法。

class BaseElement {
      constructor(selector){
         this._element = element(selector);
    }
    get element() {
        return this._element;
    }
}
var button = new BaseElement(by.css('.button));
button.element.click()//DON'T WANT TO USE THIS, LOOKING FOR USE of button.click() WITHOUT CREATING ANY METHODS IN CLASS IF POSSIBLE

Answer 1

如果Protractor将ElementFinder作为一个类暴露，你可能已经能够用这种语法实现你想要的目标：

class BaseElement extends ElementFinder {
    constructor(selector){
        super(selector);
        // ...
    }
    // ... 
}

但是由于Protractor不是用类编写的，所以这不起作用。

或者，您可以将BaseElement定义为一个简单的函数，它使用您自己的一些自定义行为扩展给定元素（ElementFinder实例）：

function makeBaseElement(selector) {
    // add some properties to the element for the given selector and return it:
    return Object.defineProperties(element(selector), {
        "property1": {
            value: true,
            writable: true
        },
        "property2": {
            value: "Hello",
            writable: false
        }
        // etc.
    });
}

var button = makeBaseElement(by.css('.button));
button.click();

当然，这不是ES6，也不是类button的{{1}}，但对于其余部分，它将元素行为与任何其他属性组合在一起。

您还可以查看创建proxy的可能性，该{{3}}会检测是否应将属性的获取/设置转发到BaseElement而不是主_element对象

在ES6中创建实例的正确方法（量角器页面对象）

1 个答案: