Znajdowanie wszystkich elementów ze zwoju

Question

Jaki jest najbardziej niezawodny i skuteczny sposób wyszukiwania wszystkich elementów ze zwinięciem na stronie?

---

Obecnie myślę o użyciu element.all() z filter() porównując wartości atrybutów height i scrollHeight:

element.all(by.xpath("//*")).filter(function (elm) { 
    return protractor.promise.all([ 
     elm.getAttribute("height"), 
     elm.getAttribute("scrollHeight") 
    ]).then(function (heights) { 
     return heights[1] > heights[0]; 
    }); 
}); 

Ale nie jestem pewien co do poprawności i skuteczności tego podejścia.

Answer 1

Działa to z poziomymi i pionowymi paskami przewijania. Sztuczka wykrywa ZARÓWNO zbyt szeroki/zbyt krótki ORAZ, jeśli obliczony CSS pozwoli ci wyświetlić pasek przewijania.

var ElementsWithScrolls = (function() { 
    var getComputedStyle = document.body && document.body.currentStyle ? function(elem) { 
     return elem.currentStyle; 
    } : function(elem) { 
     return document.defaultView.getComputedStyle(elem, null); 
    }; 

    function getActualCss(elem, style) { 
     return getComputedStyle(elem)[style]; 
    } 

    function isXScrollable(elem) { 
     return elem.offsetWidth < elem.scrollWidth && 
      autoOrScroll(getActualCss(elem, 'overflow-x')); 
    } 

    function isYScrollable(elem) { 
     return elem.offsetHeight < elem.scrollHeight && 
      autoOrScroll(getActualCss(elem, 'overflow-y')); 
    } 

    function autoOrScroll(text) { 
     return text == 'scroll' || text == 'auto'; 
    } 

    function hasScroller(elem) { 
     return isYScrollable(elem) || isXScrollable(elem); 
    } 
    return function ElemenetsWithScrolls() { 
     return [].filter.call(document.querySelectorAll('*'), hasScroller); 
    }; 
})(); 

ElementsWithScrolls(); 

Answer 2

To będzie wybrać elementy z przelewał i non-przelewał zwoje wewnątrz znacznika body:

$('body *').filter(function() { 
    return ($(this).scrollTop() != 0 || $(this).css('overflow') == 'scroll'); 
});