gpt4 book ai didi

javascript - Protractor :如何在 ui-grid 中滚动几次

转载 作者:行者123 更新时间:2023-11-30 00:05:24 33 4
gpt4 key购买 nike

我正在尝试编写滚动到表中后一行的函数。 ui-grid 在行中无限滚动。

我找到了解释滚动到最后一个元素的答案,但我的表格在一次滚动后有许多隐藏元素,我需要一个解决方案来滚动整个网格。 ( Protractor: Scrolling a table and testing for infinite scroll )

解决方案:How to getText from all rows & columns in an infinite scrolling ng-grid using protractor - 对我没有帮助

我的网格是:

<div class="ui-grid-viewport ng-isolate-scope" ng-style="colContainer.getViewportStyle()" role="rowgroup" ui-grid-viewport="" style="overflow-x: hidden; overflow-y: scroll;">
<div class="ui-grid-canvas">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index" style="margin-top: 630px;">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index" style="">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
<div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index">
</div>
</div>

根据案例,DOM 中有 24 行可见,65 行隐藏。

我的算法是“滚动”,而顶部元素和“最后一个”元素之间的滚动距离不会改变(并收集所有必要的文本),但 WHILE 主体无法正常工作,它只滚动一次:

this.tableContent = function tableContent() {      

//for loop
var start = {};
var distance = {};
var lastRow = {};
var div = element(by.css('div.ui-grid-viewport'));
lastRow.elm = element.all(by.css('div.ui-grid-row')).last();

browser.executeScript("return arguments[0].scrollTop;", lastRow.elm.getWebElement()).then(function (dst) {
return distance.value = dst;
}).then(function () {


while (start.value !== distance.value) {
//console.log('The distance before scrolling ' + dst);


start.value = distance.value;

//scroll
browser.executeScript("arguments[0].scrollIntoView();", lastRow.elm.getWebElement());
browser.wait(protractor.ExpectedConditions.presenceOf(element.all(by.css('div.ui-grid-row')).last()), 1000);

lastRow.elm = element.all(by.css('div.ui-grid-row')).last();


browser.executeScript("return arguments[0].scrollTop;", div.getWebElement()).then(function (dst) {

//console.log('the distance after scroll is ' + dst)
return distance.value = dst;

}).then(function () {

console.log('the distance is ' + distance.value);
console.log('The start.value is ' + start.value);

});


}


});

非常感谢任何帮助或想法,

提前致谢。

最佳答案

好的,经过长时间的研究,我有了答案。问题是 promise (通常 :))。感谢这篇文章 ( While loop using bluebird promises ),我的解决方案如下:

     var promiseWhile = Promise.method(function (condition, action) {
if (!condition()) return;
return action().then(promiseWhile.bind(null, condition, action));
});

lastRow.elm = element.all(by.css('div.ui-grid-row')).last();


browser.executeScript("return arguments[0].scrollTop;", lastRow.elm.getWebElement()).then(function (dst) {
return distance.value = dst;

})
.then(function () {


promiseWhile(function () {

// Condition for stopping
return start.value !== distance.value;

}, function () {
start.value = distance.value;

return collectData().then(function () {

//scroll
browser.executeScript("arguments[0].scrollIntoView();", lastRow.elm.getWebElement());
browser.wait(protractor.ExpectedConditions.presenceOf(element.all(by.css('div.ui-grid-row')).last()), 1000);

lastRow.elm = element.all(by.css('div.ui-grid-row')).last();
browser.executeScript("return arguments[0].scrollTop;", div.getWebElement()).then(function (dst) {
distance.value = dst;
});

});

});
});




var collectData = function collectData() {

// HERE COLLECT YOUR DATA and don't forget return result!
}

关于javascript - Protractor :如何在 ui-grid 中滚动几次,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38729182/

33 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com