如何使量角器向下滚动到桌子上?我的表可以无限滚动-
加载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
。
该
Element.scrollTop
属性获取或设置元素内容向上滚动的像素数。元素的scrollTop是元素顶部到其最顶部可见内容的距离的度量。的
HTMLElement.offsetTop
只读属性返回电流元件相对于offsetParent节点的顶部的距离。
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
});
});
问题内容: 我的页面上有一个按钮,当用户向下滚动时该按钮可见。因此,量角器测试给我一个错误: UnknownError:未知错误:元素在点(94,188)不可单击。 我尝试使用: 当我在量角器elementexplorer.js中对其进行测试时,此方法有效,但在我的常规测试中却无能为力。还有其他办法吗? 问题答案: 您需要等待诺言得以解决。以下示例来自一个未解决的问题 更新 :这是一个古老的问题(
无限滚动用来在页面滚动到接近底部时加载新内容或进行其他操作。 在底部的无限滚动 你只需在可滚动的容器上添加“infinite-scroll”类,一般是页面滚动区域 - div.content <style type="text/css"> .infinite-scroll-preloader { margin-top:-20px; } </style> <heade
无限滚动用来在页面滚动到接近底部时加载新内容或进行其他操作。 无限滚动HTML结构 你只需在可滚动的容器上添加“infinite-scroll”类,一般是页面滚动区域 - <div class="page-content">: <div class="page"> <div class="page-content infinite-scroll" data-distance="100">
无限滚动 iScroll集成了一套智能缓存系统,它允许对一堆近乎无限的元素的数据进行处理和重用。目前无限滚动还处于早期开发阶段,所以虽然当前版本已经足够稳定,但是还没有做好广泛推广的准备。 具体示例请参考 无限滚动示例 ,并请提交你的建议和报告bug。 作者将会尽可能快的将功能变更的细节添加上来。
滚动至底部时,加载更多数据。 基础用法 在要实现滚动加载的列表上上添加v-infinite-scroll,并赋值相应的加载方法,可实现滚动到底部时自动执行加载方法。 demo <template> <ul class="infinite-list" v-infinite-scroll="load" style="overflow:auto"> <li v-for="i in count
InfiniteScroll 无限滚动 滚动至底部时,加载更多数据。 基础用法 在要实现滚动加载的列表上上添加v-infinite-scroll,并赋值相应的加载方法,可实现滚动到底部时自动执行加载方法。 demo <template> <ul class="infinite-list" v-infinite-scroll="load" style="overflow:auto"> <