From cf7977ff757b7ec3cf99fd183ce2d7770d2322da Mon Sep 17 00:00:00 2001 From: pyxarez Date: Wed, 8 Aug 2018 15:49:25 +0300 Subject: [PATCH 1/2] Handle the case when observed node placed inside of detached iframe in ie11 --- src/utils/getWindowOf.js | 25 ++++++++++++++++++++++++- 1 file changed, 24 insertions(+), 1 deletion(-) diff --git a/src/utils/getWindowOf.js b/src/utils/getWindowOf.js index 25b2415..3a46566 100644 --- a/src/utils/getWindowOf.js +++ b/src/utils/getWindowOf.js @@ -1,5 +1,26 @@ import global from '../shims/global.js'; +/** + * Checks that target has a defaultView + * @param {Object} target + * @return {Boolean} + */ +function checkDefaultViewExisting(target) { + const simplyExists = target + && target.ownerDocument + && target.ownerDocument.defaultView; + + /** + * That case will work when target is an element inside of detached iframe. + * In Chrome it will end up with null by "target.ownerDocument.defaultView" path + * but in IE11 it will become a window with bunch of undefined properties so + * we should follow the duck typing way. + */ + const nonEmptyWindow = !!(simplyExists && target.ownerDocument.defaultView.Object); + + return nonEmptyWindow; +} + /** * Returns the global object associated with provided element. * @@ -10,7 +31,9 @@ export default target => { // Assume that the element is an instance of Node, which means that it // has the "ownerDocument" property from which we can retrieve a // corresponding global object. - const ownerGlobal = target && target.ownerDocument && target.ownerDocument.defaultView; + var ownerGlobal = checkDefaultViewExisting(target) + ? target.ownerDocument.defaultView + : null; // Return the local global object if it's not possible extract one from // provided element. From 387220cd645e5bd1f43cc320185622d74d9db2a6 Mon Sep 17 00:00:00 2001 From: pyxarez Date: Wed, 8 Aug 2018 16:06:10 +0300 Subject: [PATCH 2/2] Fix lint errors, rebuild package --- dist/ResizeObserver.js | 75 +++++++++++++++++++++++++--------------- src/utils/getWindowOf.js | 20 +++++------ 2 files changed, 57 insertions(+), 38 deletions(-) diff --git a/dist/ResizeObserver.js b/dist/ResizeObserver.js index 96414e2..d23e752 100644 --- a/dist/ResizeObserver.js +++ b/dist/ResizeObserver.js @@ -491,6 +491,25 @@ var defineConfigurable = (function (target, props) { return target; }); +/** + * Checks that target has a defaultView + * @param {Object} target + * @returns {boolean} + */ +function checkDefaultViewExisting(target) { + var simplyExists = target && target.ownerDocument && target.ownerDocument.defaultView; + + /** + * That case will work when target is an element inside of detached iframe. + * In Chrome it will end up with null by "target.ownerDocument.defaultView" path + * but in IE11 it will become a window with bunch of undefined properties so + * we should follow the duck typing way. + */ + var nonEmptyWindow = !!(simplyExists && target.ownerDocument.defaultView.Object); + + return nonEmptyWindow; +} + /** * Returns the global object associated with provided element. * @@ -498,14 +517,14 @@ var defineConfigurable = (function (target, props) { * @returns {Object} */ var getWindowOf = (function (target) { - // Assume that the element is an instance of Node, which means that it - // has the "ownerDocument" property from which we can retrieve a - // corresponding global object. - var ownerGlobal = target && target.ownerDocument && target.ownerDocument.defaultView; - - // Return the local global object if it's not possible extract one from - // provided element. - return ownerGlobal || global$1; + // Assume that the element is an instance of Node, which means that it + // has the "ownerDocument" property from which we can retrieve a + // corresponding global object. + var ownerGlobal = checkDefaultViewExisting(target) ? target.ownerDocument.defaultView : null; + + // Return the local global object if it's not possible extract one from + // provided element. + return ownerGlobal || global$1; }); // Placeholder of an empty content rectangle. @@ -751,11 +770,11 @@ function createRectInit(x, y, width, height) { * provided DOM element and for keeping track of it's changes. */ var ResizeObservation = function(target) { - this.broadcastWidth = 0; - this.broadcastHeight = 0; - this.contentRect_ = createRectInit(0, 0, 0, 0); + this.broadcastWidth = 0; + this.broadcastHeight = 0; + this.contentRect_ = createRectInit(0, 0, 0, 0); - this.target = target; + this.target = target; }; /** @@ -779,11 +798,11 @@ var ResizeObservation = function(target) { * @type {number} */ ResizeObservation.prototype.isActive = function () { - var rect = getContentRect(this.target); + var rect = getContentRect(this.target); - this.contentRect_ = rect; + this.contentRect_ = rect; - return rect.width !== this.broadcastWidth || rect.height !== this.broadcastHeight; + return rect.width !== this.broadcastWidth || rect.height !== this.broadcastHeight; }; /** @@ -793,24 +812,24 @@ ResizeObservation.prototype.isActive = function () { * @returns {DOMRectInit} Last observed content rectangle. */ ResizeObservation.prototype.broadcastRect = function () { - var rect = this.contentRect_; + var rect = this.contentRect_; - this.broadcastWidth = rect.width; - this.broadcastHeight = rect.height; + this.broadcastWidth = rect.width; + this.broadcastHeight = rect.height; - return rect; + return rect; }; var ResizeObserverEntry = function(target, rectInit) { - var contentRect = createReadOnlyRect(rectInit); - - // According to the specification following properties are not writable - // and are also not enumerable in the native implementation. - // - // Property accessors are not being used as they'd require to define a - // private WeakMap storage which may cause memory leaks in browsers that - // don't support this type of collections. - defineConfigurable(this, { target: target, contentRect: contentRect }); + var contentRect = createReadOnlyRect(rectInit); + + // According to the specification following properties are not writable + // and are also not enumerable in the native implementation. + // + // Property accessors are not being used as they'd require to define a + // private WeakMap storage which may cause memory leaks in browsers that + // don't support this type of collections. + defineConfigurable(this, { target: target, contentRect: contentRect }); }; var ResizeObserverSPI = function(callback, controller, callbackCtx) { diff --git a/src/utils/getWindowOf.js b/src/utils/getWindowOf.js index 3a46566..ccac7b6 100644 --- a/src/utils/getWindowOf.js +++ b/src/utils/getWindowOf.js @@ -3,22 +3,22 @@ import global from '../shims/global.js'; /** * Checks that target has a defaultView * @param {Object} target - * @return {Boolean} + * @returns {boolean} */ function checkDefaultViewExisting(target) { - const simplyExists = target - && target.ownerDocument - && target.ownerDocument.defaultView; + const simplyExists = target && + target.ownerDocument && + target.ownerDocument.defaultView; - /** + /** * That case will work when target is an element inside of detached iframe. * In Chrome it will end up with null by "target.ownerDocument.defaultView" path * but in IE11 it will become a window with bunch of undefined properties so * we should follow the duck typing way. */ - const nonEmptyWindow = !!(simplyExists && target.ownerDocument.defaultView.Object); + const nonEmptyWindow = !!(simplyExists && target.ownerDocument.defaultView.Object); - return nonEmptyWindow; + return nonEmptyWindow; } /** @@ -31,9 +31,9 @@ export default target => { // Assume that the element is an instance of Node, which means that it // has the "ownerDocument" property from which we can retrieve a // corresponding global object. - var ownerGlobal = checkDefaultViewExisting(target) - ? target.ownerDocument.defaultView - : null; + const ownerGlobal = checkDefaultViewExisting(target) ? + target.ownerDocument.defaultView : + null; // Return the local global object if it's not possible extract one from // provided element.