Find all visible items with Protractor

I am trying to count all visible elements under a container using Protractor

function getVisibleDivs(driver) { var links = driver.findElements(by.css("#MainContent div")); return protractor.promise.filter(links, function(link) { link.isDisplayed(); }) .then(function(visibleLinks) { return visibleLinks; }); } element.all(getVisibleDivs).then(function (items) { console.log(items.length); }); 

I always get the score as 0, although I manually checked that the elements are present. Any pointers for debugging are much appreciated.

UPDATE html example

 <html> <body> <div id="MainContent"> <div class="header"> Header </div> <div class="content"> Content </div> <div class="sidebar" style="display:none"> Sidebar </div> <div class="footer"> Footer </div> </div> </body> </html> 
+8
angularjs protractor
source share
2 answers

The filter function does not return anything, so add 'return' to link.isDisplayed ():

 function getVisibleDivs(driver) { var links = driver.findElements(by.css("#MainContent div")); return protractor.promise.filter(links, function(link) { return link.isDisplayed(); }) .then(function(visibleLinks) { return visibleLinks; }); } element.all(getVisibleDivs).then(function (items) { console.log(items.length); }); 
+3
source share

There is no need to use protractor.promise directly. The ElementArrayFinder provides functional programming functions, such as filter() on the ElementArrayFinder - the result of element.all() .

Here's how to use it:

 var visibleDivs = $$("#MainContent div").filter(function(link) { return link.isDisplayed(); }); expect(visibleDivs.count()).toEqual(3); 
+5
source share

All Articles