diff options
| -rw-r--r-- | linkHints.js | 6 | ||||
| -rw-r--r-- | test_harnesses/visibility_test.html | 27 |
2 files changed, 25 insertions, 8 deletions
diff --git a/linkHints.js b/linkHints.js index e73fc932..a2d28dda 100644 --- a/linkHints.js +++ b/linkHints.js @@ -84,12 +84,16 @@ function getVisibleClickableElements() { if (boundingRect.width < 3 || boundingRect.height < 3) continue; - // eliminate invisible elements + // eliminate invisible elements (see test_harnesses/visibility_test.html) var computedStyle = window.getComputedStyle(element, null); if (computedStyle.getPropertyValue('visibility') != 'visible' || computedStyle.getPropertyValue('display') == 'none') continue; + var clientRect = element.getClientRects()[0]; + if (!clientRect) + continue; + visibleElements.push(element); } return visibleElements; diff --git a/test_harnesses/visibility_test.html b/test_harnesses/visibility_test.html index ffc008bd..5fa4d728 100644 --- a/test_harnesses/visibility_test.html +++ b/test_harnesses/visibility_test.html @@ -25,14 +25,27 @@ } } /* - * Determines whether this element is on screen and visible. - * See this for some helpful discussion: - * http://stackoverflow.com/questions/704758/how-to-check-if-an-element-is-really-visible-with-javascript + * Determine whether elements are visible. + * Inspired by Vimperator. */ function isVisible(element) { - var boundingRect = element.getBoundingClientRect(); - var elementFromPoint = document.elementFromPoint(boundingRect.left, boundingRect.top); - return elementFromPoint == element; + // eliminate offscreen elements (case 4) + var rect = element.getBoundingClientRect(); + if (!rect || rect.top > window.innerHeight || rect.bottom < 0 || rect.left > window.innerWidth || rect.right < 0) + return false; + + // this catches cases 2, 3, & 5 + var computedStyle = window.getComputedStyle(element, null); + if (computedStyle.getPropertyValue('visibility') != 'visible' || + computedStyle.getPropertyValue('display') == 'none') + return false; + + // this catches cases 3 & 6 + var clientRect = element.getClientRects()[0]; + if (!clientRect) + return false; + + return true; } </script> </head> @@ -55,4 +68,4 @@ <div style="opacity:0"> <span id="div7true" style="opacity:0"></span> </div> -</html>
\ No newline at end of file +</html> |