diff --git a/CHANGELOG.md b/CHANGELOG.md index 65b8c34a80..ea2c653d5b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,11 @@ # Changelog +## WIP + +### Fixed + +- Fix `isInView` function for elements with zero width and height + ## 3.0.0 rc 14 (September 4, 2018) ### Fixed diff --git a/src/js/util/dimensions.js b/src/js/util/dimensions.js index e7a84932e2..9f0e24740e 100644 --- a/src/js/util/dimensions.js +++ b/src/js/util/dimensions.js @@ -1,7 +1,7 @@ import {css} from './style'; import {attr} from './attr'; import {isVisible} from './filter'; -import {clamp, each, endsWith, includes, intersectRect, isDocument, isUndefined, isWindow, toFloat, toNode, ucfirst} from './lang'; +import {clamp, each, endsWith, includes, intersectRect, isDocument, isUndefined, isWindow, pointInRect, toFloat, toNode, ucfirst} from './lang'; const dirs = { width: ['x', 'left', 'right'], @@ -297,38 +297,41 @@ export function isInView(element, topOffset = 0, leftOffset = 0, relativeToViewp } element = toNode(element); + const win = window(element); + let client, bounding; if (relativeToViewport) { - return intersectRect(element.getBoundingClientRect(), { + client = element.getBoundingClientRect(); + bounding = { top: -topOffset, left: -leftOffset, bottom: topOffset + height(win), right: leftOffset + width(win) - }); + }; } else { const [elTop, elLeft] = offsetPosition(element); const {pageYOffset: top, pageXOffset: left} = win; - return intersectRect( - { - top: elTop, - left: elLeft, - bottom: elTop + element.offsetHeight, - right: elTop + element.offsetWidth - }, - { - top: top - topOffset, - left: left - leftOffset, - bottom: top + topOffset + height(win), - right: left + leftOffset + width(win) - } - ); + client = { + top: elTop, + left: elLeft, + bottom: elTop + element.offsetHeight, + right: elTop + element.offsetWidth + }; + bounding = { + top: top - topOffset, + left: left - leftOffset, + bottom: top + topOffset + height(win), + right: left + leftOffset + width(win) + }; } + return intersectRect(client, bounding) || pointInRect({x: client.left, y: client.top}, bounding); + } export function scrolledOver(element, heightOffset = 0) {