diff options
| -rw-r--r-- | lib/dom_utils.coffee | 20 | ||||
| -rw-r--r-- | tests/dom_tests/dom_utils_test.coffee | 9 |
2 files changed, 25 insertions, 4 deletions
diff --git a/lib/dom_utils.coffee b/lib/dom_utils.coffee index 30b9f68c..7c47179c 100644 --- a/lib/dom_utils.coffee +++ b/lib/dom_utils.coffee @@ -62,17 +62,29 @@ DomUtils = # Note: this call will be expensive if we modify the DOM in between calls. clientRects = (Rect.copy clientRect for clientRect in element.getClientRects()) + # Inline elements with font-size: 0px; will declare a height of zero, even if a child with non-zero + # font-size contains text. + isInlineZeroHeight = -> + elementComputedStyle = window.getComputedStyle element, null + isInlineZeroFontSize = (0 == elementComputedStyle.getPropertyValue("display").indexOf "inline") and + (elementComputedStyle.getPropertyValue("font-size") == "0px") + # Override the function to return this value for the rest of this context. + isInlineZeroHeight = -> isInlineZeroFontSize + isInlineZeroFontSize + for clientRect in clientRects # If the link has zero dimensions, it may be wrapping visible but floated elements. Check for this. if (clientRect.width == 0 or clientRect.height == 0) and testChildren for child in element.children computedStyle = window.getComputedStyle(child, null) - # Ignore child elements which are not floated and not absolutely positioned for parent elements with - # zero width/height + # Ignore child elements which are not floated and not absolutely positioned for parent elements + # with zero width/height, as long as the case described at isInlineZeroHeight does not apply. # NOTE(mrmr1993): This ignores floated/absolutely positioned descendants nested within inline # children. - continue if (computedStyle.getPropertyValue('float') == 'none' && - computedStyle.getPropertyValue('position') != 'absolute') + continue if (computedStyle.getPropertyValue("float") == "none" and + computedStyle.getPropertyValue("position") != "absolute" and + not (clientRect.height == 0 and isInlineZeroHeight() and + 0 == computedStyle.getPropertyValue("display").indexOf "inline")) childClientRect = @getVisibleClientRect child, true continue if childClientRect == null or childClientRect.width < 3 or childClientRect.height < 3 return childClientRect diff --git a/tests/dom_tests/dom_utils_test.coffee b/tests/dom_tests/dom_utils_test.coffee index e98dc958..ce8fa370 100644 --- a/tests/dom_tests/dom_utils_test.coffee +++ b/tests/dom_tests/dom_utils_test.coffee @@ -73,6 +73,15 @@ context "Check visibility", """ assert.equal null, (DomUtils.getVisibleClientRect (document.getElementById 'foo'), true) + should "detect font-size: 0; and display: inline; links when their children are display: inline", -> + # This test represents the minimal test case covering issue #1554. + document.getElementById("test-div").innerHTML = """ + <a id='foo' style='display: inline; font-size: 0px;'> + <div style='display: inline; font-size: 16px;'>test</div> + </a> + """ + assert.isTrue (DomUtils.getVisibleClientRect (document.getElementById 'foo'), true) != null + should "detect links inside opacity:0 elements as visible", -> # XXX This is an expected failure. See issue #16. document.getElementById("test-div").innerHTML = """ |