我想通过单击仅在滚动侧边栏部分时可见的元素进行测试。侧边栏位于网站的左端，元素位于侧边栏的底部。我用过：
browser.executeScript('window.sidebar.scrollTo(0,0);').then(function ()
但它不起作用。
<div class="sidebar" data-active-color="white" data-background-color="red" data-image="../assets/img/sidebar-1.jpg">
<sidebar-cmp>
<div class="logo">
<div class="logo-normal">
<a class="simple-text" href="https://www.creative-tim.com">
Creative Tim
</a>
</div>
<div class="logo-img">
<img src="/assets/img/angular2-logo-white.png">
</div>
</div>
<div class="sidebar-wrapper">
<div class="user">
<div class="photo">
<img src="../assets/img/faces/avatar.jpg">
</div>
<div class="info">
<a class="collapsed" data-toggle="collapse" href="#collapseExample">
<span>
Tania Andrew
<b class="caret"></b>
</span>
</a>
<div class="collapse" id="collapseExample">
<ul class="nav">
<li>
<a href="javascript:void(0)">
<span class="sidebar-mini">MP</span>
<span class="sidebar-normal">My Profile</span>
</a>
</li>
<li>
<a href="javascript:void(0)">
<span class="sidebar-mini">EP</span>
<span class="sidebar-normal">Edit Profile</span>
</a>
</li>
<li>
<a href="javascript:void(0)">
<span class="sidebar-mini">S</span>
<span class="sidebar-normal">Settings</span>
</a>
</li>
</ul>
</div>
</div>
</div>
<div class="nav-container">
<ul class="nav">
<li routerlinkactive="active" class="active visible">
<a href="#/dashboard">
<i class="material-icons">dashboard</i>
<p>Dashboard</p>
</a>
</li>
<li routerlinkactive="active">
<a data-toggle="collapse" href="#componentsExamples">
<i class="material-icons">apps</i>
<p>Components
<b class="caret"></b>
</p>
</a>
<div class="collapse" id="componentsExamples">
<ul class="nav">
<li routerlinkactive="active">
<a href="#/components/buttons">
<span class="sidebar-mini">B</span>
<span class="sidebar-normal">Buttons</span>
</a>
</li>
<li routerlinkactive="active">
<a href="#/components/grid">
<span class="sidebar-mini">GS</span>
<span class="sidebar-normal">Grid System</span>
</a>
</li>
<li routerlinkactive="active">
<a href="#/components/panels">
<span class="sidebar-mini">P</span>
<span class="sidebar-normal">Panels</span>
</a>
</li>
<li routerlinkactive="active">
<a href="#/components/sweet-alert">
<span class="sidebar-mini">SA</span>
<span class="sidebar-normal">Sweet Alert</span>
</a>
</li>
<li routerlinkactive="active">
<a href="#/components/notifications">
<span class="sidebar-mini">N</span>
<span class="sidebar-normal">Notifications</span>
</a>
</li>
<li routerlinkactive="active">
<a href="#/components/icons">
<span class="sidebar-mini">I</span>
<span class="sidebar-normal">Icons</span>
</a>
</li>
<li routerlinkactive="active">
<a href="#/components/typography">
<span class="sidebar-mini">T</span>
<span class="sidebar-normal">Typography</span>
</a>
</li>
</ul>
</div>
</li>
<li routerlinkactive="active">
<a data-toggle="collapse" href="#formsExamples">
<i class="material-icons">content_paste</i>
<p>Forms
<b class="caret"></b>
</p>
</a>
<div class="collapse" id="formsExamples">
<ul class="nav">
<li routerlinkactive="active">
<a href="#/forms/regular">
<span class="sidebar-mini">RF</span>
<span class="sidebar-normal">Regular Forms</span>
</a>
</li>
<li routerlinkactive="active">
<a href="#/forms/extended">
<span class="sidebar-mini">EF</span>
<span class="sidebar-normal">Extended Forms</span>
</a>
</li>
<li routerlinkactive="active">
<a href="#/forms/validation">
<span class="sidebar-mini">VF</span>
<span class="sidebar-normal">Validation Forms</span>
</a>
</li>
<li routerlinkactive="active">
<a href="#/forms/wizard">
<span class="sidebar-mini">W</span>
<span class="sidebar-normal">Wizard</span>
</a>
</li>
</ul>
</div>
</li>
<li routerlinkactive="active">
<a data-toggle="collapse" href="#tablesExamples">
<i class="material-icons">grid_on</i>
<p>Tables
<b class="caret"></b>
</p>
</a>
<div class="collapse" id="tablesExamples">
<ul class="nav">
<li routerlinkactive="active">
<a href="#/tables/regular">
<span class="sidebar-mini">RT</span>
<span class="sidebar-normal">Regular Tables</span>
</a>
</li>
<li routerlinkactive="active">
<a href="#/tables/extended">
<span class="sidebar-mini">ET</span>
<span class="sidebar-normal">Extended Tables</span>
</a>
</li>
<li routerlinkactive="active">
<a href="#/tables/datatables.net">
<span class="sidebar-mini">DT</span>
<span class="sidebar-normal">DataTables.net</span>
</a>
</li>
</ul>
</div>
</li>
<li routerlinkactive="active">
<a data-toggle="collapse" href="#mapsExamples">
<i class="material-icons">place</i>
<p>Maps
<b class="caret"></b>
</p>
</a>
<div class="collapse" id="mapsExamples">
<ul class="nav">
<li routerlinkactive="active">
<a href="#/maps/google">
<span class="sidebar-mini">GM</span>
<span class="sidebar-normal">Google Maps</span>
</a>
</li>
<li routerlinkactive="active">
<a href="#/maps/fullscreen">
<span class="sidebar-mini">FSM</span>
<span class="sidebar-normal">Full Screen Map</span>
</a>
</li>
<li routerlinkactive="active">
<a href="#/maps/vector">
<span class="sidebar-mini">VM</span>
<span class="sidebar-normal">Vector Map</span>
</a>
</li>
</ul>
</div>
</li>
<li routerlinkactive="active">
<a href="#/widgets">
<i class="material-icons">widgets</i>
<p>Widgets</p>
</a>
</li>
<li routerlinkactive="active">
<a href="#/charts">
<i class="material-icons">timeline</i>
<p>Charts</p>
</a>
</li>
<li routerlinkactive="active">
<a href="#/calendar">
<i class="material-icons">date_range</i>
<p>Calendar</p>
</a>
</li>
<li routerlinkactive="active">
<a data-toggle="collapse" href="#pagesExamples">
<i class="material-icons">image</i>
<p>Pages
<b class="caret"></b>
</p>
</a>
<div class="collapse" id="pagesExamples">
<ul class="nav">
<li>
<a href="./pricing.html">
<span class="sidebar-mini">P</span>
<span class="sidebar-normal">Pricing</span>
</a>
</li>
<li routerlinkactive="active">
<a href="#/pages/timeline">
<span class="sidebar-mini">T</span>
<span class="sidebar-normal">Timeline Page</span>
</a>
</li>
<li>
<a href="./login.html">
<span class="sidebar-mini">LP</span>
<span class="sidebar-normal">Login Page</span>
</a>
</li>
<li>
<a href="./register.html">
<span class="sidebar-mini">RP</span>
<span class="sidebar-normal">Register Page</span>
</a>
</li>
<li>
<a href="./lock.html">
<span class="sidebar-mini">LSP</span>
<span class="sidebar-normal">Lock Screen Page</span>
</a>
</li>
<li routerlinkactive="active">
<a href="#/pages/user">
<span class="sidebar-mini">UP</span>
<span class="sidebar-normal">User Page</span>
</a>
</li>
</ul>
</div>
</li>
</ul>
<div class="sidebar-moving-tab" style="transform: translate3d(0px, 5px, 0px);"></div></div>
</div>
</sidebar-cmp>
<div class="sidebar-background" style="background-image: url(assets/img/sidebar-1.jpg)"></div>
</div>
答案 0 :(得分：1)
指定您必须滚动的位置， 尝试此 。
browser.executeScript('window.scrollTo(0,1000);').then(function () {
browser.sleep(5000);
console.log('Window ScrollTo','Done');
}).then(function() {
//wait for element to be displayed
browser.driver.wait(function(){
return someElement.isDisplayed().then(function (isVisible){
return isVisible === true;
},50000, 'Element not present ' );
},50000)
});
答案 1 :(得分：1)
我一直在使用这一行进行滚动。
您也可以在量角器上使用它之前在控制台上试用它
例如$(".sidebar").scrollLeft(1000)
strPixels = 1000 //value in pixel
strClass = '.sidebar' //class of the element with scrollbar
browser.executeScript('$("' + strClass + '").scrollLeft(' + strPixels + ')');
注意：您可以使用scrollLeft或scrollTop水平或垂直滚动。
答案 2 :(得分：0)
var filter = theSwitch.pageBar;
var scrollIntoView = function () {
arguments[0].scrollIntoView();
};
browser.executeScript(scrollIntoView, filter);
theSwitch.pageBar.click();