IE 11 may throw an exception when calling `getBoundingClientRect` on detached elements

[lynchbomb]

IE 11 may throw an exception when calling .getBoundingClientRect on detached elements. These elements should (according to CSSOM spec) return an object with zero for the top, bottom, left, right, width, and height properties.

http://jsfiddle.net/jonathansampson/3vqddemh/ for the excellent solution to this.

try {
  document.createElement('i').getBoundingClientRect();
} catch(e) {
  let getBoundingClientRect = Element.prototype.getBoundingClientRect;
  Element.prototype.getBoundingClientRect = () => {
    try {
      return getBoundingClientRect.call(this);
    } catch(e) {
      return { top: 0, bottom: 0, left: 0, width: 0, height: 0, right: 0 }; 
    }
  }
}

[stefanpenner]

Rather then monkey patching the Element.prototype, and doing so on all errors thrown by the above expression can we:

• create a getBoundingClientRect helper getBoundingClientRect(element) that implements the above?
• only do so if the caught error is the error we expect to catch. (wouldn't want to catch a ReferenceError or something

Example:

function getBoundingClientRect(element) {
   try {
     return element.getBoundingClientRect();
  } catch(e) {
   if (typoof e === 'object' && e !==nuill && /* check the e is the exception we expect */) {
      return { top: 0, bottom: 0, left: 0, width: 0, height: 0, right: 0 }; 
  } else {
    throw e; // something else went wrong, and we must surface the error
  }
}

[lynchbomb]

Yep totally agree. I spiked (we can rename) spanielGetBoundingClientRect which is near identical to what you proposed; testing and will push later.

[lynchbomb]

This PR should address this issue: #79