如何使量角器向下滚动到桌子上?我的表可以无限滚动- 加载20条记录,并且在显示倒数第二行时,它将获取接下来的20条记录。并非所有记录都在视图中…有些滚动到下面,而有些滚动到用户上方时。我以为测试是
it('should fetch next set of records on scroll') { element.all(by.id('users')).map(function (elm) { return elm; }).then(function (users) { expect(users.length).toBe(20); }); // Scroll the table to the bottom to trigger fetching more records element.all(by.id('users')).map(function (elm) { return elm; }).then(function (users) { expect(users.length).toBe(40); }); };
这是正确的方法吗?
HTML表格代码:
<div ng-if="users && users.length > 0" class="table-scroll" ng-infinite-scroll="loadMoreUsers()"> <table id="users-table" class="table table-hover text-overflow-ellipsis"> <thead> <td class="col1"></td> <td id="users-table-name-col" class="col2">User</td> <td id="users-table-date-col" class="col3">Birthday</td> </thead> <tbody ng-repeat="group in users"> <tr ng-repeat="user in group.users" ng-click="userClicked(user);"> <td class="col1"> <img class="col-xs-1 profile-picture" style="padding:0" ng-src="{{user.profile_picture}}"></td> <td class="col2"> <div id="user-name"> {{ user.last_name }}, {{ user.first_name }} </div> </td> <td class="col3"> <div id="user-date"> {{user.date}} </div> </td> </tr> </tbody> </table> </div>
这个想法是在表(tr标签)中找到最新的元素,然后通过将父scrollTop元素的元素设置为最后一个元素的元素来滚动到该元素offsetTop。
tr
scrollTop
offsetTop
该Element.scrollTop属性获取或设置元素内容向上滚动的像素数。元素的scrollTop是元素顶部到其最顶部可见内容的距离的度量。 的HTMLElement.offsetTop只读属性返回电流元件相对于offsetParent节点的顶部的距离。
该Element.scrollTop属性获取或设置元素内容向上滚动的像素数。元素的scrollTop是元素顶部到其最顶部可见内容的距离的度量。
Element.scrollTop
的HTMLElement.offsetTop只读属性返回电流元件相对于offsetParent节点的顶部的距离。
HTMLElement.offsetTop
var div = element(by.css('div.table-scroll')); var lastRow = element(by.css('table#myid tr:last-of-type')); browser.executeScript("return arguments[0].offsetTop;", lastRow.getWebElement()).then(function (offset) { browser.executeScript('arguments[0].scrollTop = arguments[1];', div.getWebElement(), offset).then(function() { // assertions }); });