Protractor: How to scroll a few times in ui-grid
<p>I am trying to write function which scrolls to a latter row in a table. The ui-grid has infinite scrolling through the rows.</p>

<p>I have found answers that explain scrolling to a last element, but my table has many hidden elements after an one scrolling and I need a solution to scroll through the full grid. (<a href="https://stackoverflow.com/questions/27794316/protractor-scrolling-a-table-and-testing-for-infinite-scroll?noredirect=1&amp;lq=1">Protractor: Scrolling a table and testing for infinite scroll</a>)</p>

<p>The solution: <a href="https://stackoverflow.com/questions/37468198/how-to-gettext-from-all-rows-columns-in-an-infinite-scrolling-ng-grid-using-pr?answertab=votes#tab-top">How to getText from all rows &amp; columns in an infinite scrolling ng-grid using protractor</a> - doesn't help me</p>

<p>My grid is:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="ui-grid-viewport ng-isolate-scope" ng-style="colContainer.getViewportStyle()" role="rowgroup" ui-grid-viewport="" style="overflow-x: hidden; overflow-y: scroll;"&gt;
&lt;div class="ui-grid-canvas"&gt;
   &lt;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;"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index" style=""&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;div class="ui-grid-row ng-scope" ng-style="Viewport.rowStyle(rowRenderIndex)" ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index"&gt;
   &lt;/div&gt;
&lt;/div&gt;</code></pre>
</div>
</div>
</p>

<p>According to the case, there are 24 rows visible in DOM and 65 hidden.</p>

<p>My algorithm is "to scroll" while a scrolled distance between top element and "last" element won't be changed (and collect all necessary text), but the WHILE body does not work properly, it scrolls one time only:</p>

<pre><code>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);

            });


        }


    });
</code></pre>

<p>Any help or idea are highly appreciated, </p>

<p>thanks in advance.</p>