Правильное использование шаблона объекта страницы в Транспортире
У меня есть приложение Angular
, и я использую Protractor
для его тестирования.
HTML
<div id="all" class="row text-center">
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-6">
<div class="dashboard-stat block panel padder-v bg-primary">
<div class="icon hidden-xs">
<img src="../assets/images/icon-ppt-inv.png">
</div>
<div>
<div id="value" class="font-thin h1 block">
{{summary.num | number:0}}
</div>
<div id="name" class="text-muted text-xs">
Albert
</div>
</div>
</div>
</div>
</div>
Вот код для объекта страницы:
'use strict';
var history_page = function (){
this.getStat = function(){
return element.all(by.css('#all'));
};
this.getName = function(){
return element(by.css('#name')).getText();
};
this.getValue = function(){
return element(by.css('#value')).getText();
};
};
module.exports = new history_page();
Тестовый Код
var historyPage = require('./history_page.js');
it('Test', function(){
var history = historyPage.getStat().map(function (stat) {
return {
name: stat.historyPage.getName()
value: stat.historyPage.getValue(),
}
});
history.then(function (value) {
console.log(value);
});
});
По какой-то причине я продолжаю получать ошибку, говоря, что getName не определен. Если я изменю следующие две строки
name: stat.historyPage.getName()
value: stat.historyPage.getValue(),
Как
name: stat.element(by.css('#name')).getText(),
value: stat.element(by.css('#value')).getText()
Это прекрасно работает. Я не знаю, в чем причина. Я действительно хочу избежать написания CSS локаторов на моей тестовой странице, как это происходит не выглядит хорошо, и это плохая практика. Я буду признателен за предложения, которые помогут мне.
3 ответа:
Я бы переместил полный блок
map()
в объект страницы:var history_page = function () { this.all = element.all(by.css('#all')); this.getStat = function() { return this.all.map(function (stat) { return { name: stat.element(by.css('#name')).getText(), value: stat.element(by.css('#value')).getText() } }); }; }; module.exports = new history_page();
'use strict'; var history_page = function (){ this.getStat = function(){ return element.all(by.css('#all')); }; this.getName = function(index){ return this.getStat().then(function(stats){ return stats[index].get(index).element(by.css('#name')); }; }; module.exports = new history_page();
Да, локаторы, функции (как упоминает @alecxe) и условия принадлежат объекту страницы. В противном случае это разрушает их цель.
Я бы сделал что-то вроде:
var historyPage = function() { this.stats = $$('.row'); this.name = $('#name'); this.getValue = $('#value'); }; module.exports = new history_page();
И тест должен быть примерно таким:
var historyPage = require('./history_page.js'); it('Test', function() { expect(historyPage.name.getText()).toBe('Albert'); });
Использование карты для повторных данных-это круто... но я не уверен, что последую вашему примеру.
#all
будет уникальным, поэтому, если вы собираетесь сопоставлять повторяющиеся данные, вы, вероятно, захотите сопоставить.row
? Не уверенный. Но это может выглядеть примерно так это:this.getStat = function() { var that = this; return this.stats.map(function(stat) { return { // not tested... name: stat.that.name.getText(), value: stat.that.value.getText() } }); };
И FWIW, у меня есть некоторые примеры объектов страницы в моем транспортировщик_эксперимент РЕПО