ES6'da örnek oluşturmak için doğru yaklaşım (iletici sayfa nesneleri)

Question

sadece ES6'yı öğrenmeye başladım ve sayfayı İletici kullanarak test etmek istiyorum. Öncelikle temel web elemanı sınıfı oluşturmak istiyorum ve sayfadaki diğer öğeler temel sınıftan miras alınacak.

Açıölçer örneğin elemanlarını seçmek ve onlarla çalışmak üzere kullanabileceğiniz seçiciler vardır tıklatın:

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

Yani temelde böyle bir şey yaratmak istiyorum: Nedense

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

Çalışmıyorsa, tıklamanın bir işlev olmadığını geri döndürür.

Aşağıdaki örnekte olduğu gibi, sınıf veya "get" yöntemine "tıkla" yöntemini ekleyebilirim, ancak bilmem gerek bazı temel ilkeleri kaçırdım ve tamamen yanlış yaptım. İletki'de çok sayıda yerel var, elemanlar için fonksiyonlar inşa ettim ve bunların hepsi temel sınıftakiler için yöntem yazmak istemiyorum.

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

Açıölçer muhtemelen bu sözdizimi ile istediğinizi elde etmek mümkün olurdu bir sınıf olarak ElementFinder maruz olsaydı:

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

Ama Açıölçer sınıflarıyla yazılmaz gibi bu değil Çalışma.

Alternatif olarak, kendi özel davranışlarının bazılarına verilen bir eleman (bir ElementFinder örneği) uzanan basit bir işlevi olarak BaseElement tanımlayabiliriz: Elbette

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(); 

, bu ES6 değil, ne button olduğunu BaseElement sınıfının, ancak geri kalanı için, öğe davranışını herhangi bir ek özellik ile birleştirir.

Ayrıca özelliğin get/set yerine ana BaseElement nesnenin _element iletilmesi gerekip gerekmediğini tespit edecek bir proxy oluşturmak için imkanı bir göz olabilir.