Ошибка уклонителя --- ТипError: Невозможно прочитать свойство 'click' of undefined

Question

Я новичок в анализе утяжителей углов. В принципе, я хочу установить флажок, если он не установлен. С помощью следующего кода я получаю сообщение об ошибке, как в названии «TypeError: Не удается прочитать свойство„нажмите кнопку“неопределенных»

var PageObject = function() { 
    this.hidePanelHeaderCb = element(by.id("hidePanelHeader")); 

    this.checkHidePanelHeaderCb = function() { 
     this.hidePanelHeaderCb.isSelected().then(function (selected) { 
      if(selected !== true) { 
       (this.hidePanelHeaderCb).click(); 
      } 
     }); 
    }; 
}; 
module.exports = PageObject; 

на веб-странице фрагмент, который я получил с правой кнопкой мыши -> проверьте это:

<span id="hidePanelHeader" ng-class="{'icon-CheckBoxSelected': panelProperties.hidePanelHeader, 'icon-CheckBoxUnselected': !panelProperties.hidePanelHeader}" ng-click="switchHidePanelHeader()" role="button" tabindex="0" class="icon-CheckBoxSelected" style=""></span> 

Я пробовал использовать isChecked(), и это дает другую ошибку.

Я позвонил с помощью панелиPropertiesPageObject.checkHidePanelHeaderCb();

Все остальные функции, использующие этот код, работают нормально. Его код, который я добавил, который не работает. Поэтому использование «документа» вместо «этого», вероятно, не является причиной.

Answer 1

Будьте осторожны с JavaScript scopes. В функциях this относится к объекту функции. Поэтому с каждым оператором this.hidePanelHeaderCb в функции вы добавляете свойство к этому объекту.

Вместо этого вы можете хранить обещание элемента в переменной и работать с ним.

Пожалуйста, попробуйте следующее:

var PageObject = function() { 

    this.checkHidePanelHeaderCb = function() { 
     var hidePanelHeader = element(by.id("hidePanelHeader")); 
     hidePanelHeader.isSelected().then(function (selected) { 
      if(selected !== true) { 
       hidePanelHeader.click(); 
      } 
     }); 
    }; 

}; 

module.exports = PageObject; 

Это все, что я могу сказать вам о синтаксисе. Более сложно добавить без HTML и более контекста JS.

---

Edit: В приведенном выше примере используются три hidePanelHeaderCb свойства на различных объектах:

var PageObject = function() { 
    // #1 PageObject.hidePanelHeaderCb (defined here) 
    this.hidePanelHeaderCb = element(by.id("hidePanelHeader")); 

    // PageObject.checkHidePanelHeaderCb (defined here) 
    this.checkHidePanelHeaderCb = function() { 
     // #2 PageObject.checkHidePanelHeaderCb.hidePanelHeaderCb (undefined) 
     this.hidePanelHeaderCb.isSelected().then(function (selected) { 
      if(selected !== true) { 
       // #3 anonymousThenCallback.hidePanelHeaderCb (also undefined) 
       (this.hidePanelHeaderCb).click(); 
      } 
     }); 
    }; 
}; 
module.exports = PageObject; 

Answer 2

следующие работы с использованием закрытия для отпадет вопрос, вызванный обещанием:

this.checkHidePanelHeaderCb = function() { 
    var that = this; 
    this.hidePanelHeaderCb.isSelected().then(function(selected) { 
     if(selected !== true) { 
      that.hidePanelHeaderCb.click(); 
     } 
    }); 
}; 

Answer 3

Использование ES2015 (ES6):

Если вы используете ES2015 (ES6), это может быть исправлено с:

var PageObject = function() { 
    this.hidePanelHeaderCb = element(by.id("hidePanelHeader")); 

    this.checkHidePanelHeaderCb =() => { 
    this.hidePanelHeaderCb.isSelected().then(selected => { 
     if(!selected) { 
     this.hidePanelHeaderCb.click(); 
     } 
    }); 
    }; 
}; 
module.exports = PageObject; 

Я хотел бы предложить чтение fat arrow syntax and lexical scoping.