From ee0382ef80c40821271feda91adcc4485437d368 Mon Sep 17 00:00:00 2001
From: Martijn Vermaat <martijn@vermaat.name>
Date: Mon, 30 Mar 2015 19:00:58 +0200
Subject: [PATCH] [fixed] Use .ownerDocument instead of root document

Event listeners are attached to the component DOM node's owner
document instead of to the window root document. The two are not
the same when the component is mounted inside an IFrame, for
example using react-frame-component [1].

[1] https://github.com/ryanseddon/react-frame-component
---
 src/AffixMixin.js         | 2 +-
 src/DropdownStateMixin.js | 6 ++++--
 src/FadeMixin.js          | 2 +-
 src/Modal.js              | 6 +++---
 src/OverlayMixin.js       | 2 +-
 src/utils/domUtils.js     | 4 ++--
 6 files changed, 12 insertions(+), 10 deletions(-)

diff --git a/src/AffixMixin.js b/src/AffixMixin.js
index 4d6e15acbc..957bd360ed 100644
--- a/src/AffixMixin.js
+++ b/src/AffixMixin.js
@@ -104,7 +104,7 @@ const AffixMixin = {
     this._onWindowScrollListener =
       EventListener.listen(window, 'scroll', this.checkPosition);
     this._onDocumentClickListener =
-      EventListener.listen(document, 'click', this.checkPositionWithEventLoop);
+      EventListener.listen(React.findDOMNode(this).ownerDocument, 'click', this.checkPositionWithEventLoop);
   },
 
   componentWillUnmount() {
diff --git a/src/DropdownStateMixin.js b/src/DropdownStateMixin.js
index 7244a8abe5..a72bcdebe1 100644
--- a/src/DropdownStateMixin.js
+++ b/src/DropdownStateMixin.js
@@ -56,10 +56,12 @@ const DropdownStateMixin = {
   },
 
   bindRootCloseHandlers() {
+    let doc = React.findDOMNode(this).ownerDocument;
+
     this._onDocumentClickListener =
-      EventListener.listen(document, 'click', this.handleDocumentClick);
+      EventListener.listen(doc, 'click', this.handleDocumentClick);
     this._onDocumentKeyupListener =
-      EventListener.listen(document, 'keyup', this.handleDocumentKeyUp);
+      EventListener.listen(doc, 'keyup', this.handleDocumentKeyUp);
   },
 
   unbindRootCloseHandlers() {
diff --git a/src/FadeMixin.js b/src/FadeMixin.js
index 7888dd27d6..0ed31da42c 100644
--- a/src/FadeMixin.js
+++ b/src/FadeMixin.js
@@ -57,7 +57,7 @@ export default {
 
   componentWillUnmount: function () {
     let els = getElementsAndSelf(React.findDOMNode(this), ['fade']),
-        container = (this.props.container && React.findDOMNode(this.props.container)) || document.body;
+        container = (this.props.container && React.findDOMNode(this.props.container)) || React.findDOMNode(this).ownerDocument.body;
 
     if (els.length) {
       this._fadeOutEl = document.createElement('div');
diff --git a/src/Modal.js b/src/Modal.js
index 4a3da5cc60..3299fb6a65 100644
--- a/src/Modal.js
+++ b/src/Modal.js
@@ -128,9 +128,9 @@ const Modal = React.createClass({
 
   componentDidMount() {
     this._onDocumentKeyupListener =
-      EventListener.listen(document, 'keyup', this.handleDocumentKeyUp);
+      EventListener.listen(React.findDOMNode(this).ownerDocument, 'keyup', this.handleDocumentKeyUp);
 
-    let container = (this.props.container && React.findDOMNode(this.props.container)) || document.body;
+    let container = (this.props.container && React.findDOMNode(this.props.container)) || React.findDOMNode(this).ownerDocument.body;
     container.className += container.className.length ? ' modal-open' : 'modal-open';
 
     if (this.props.backdrop) {
@@ -146,7 +146,7 @@ const Modal = React.createClass({
 
   componentWillUnmount() {
     this._onDocumentKeyupListener.remove();
-    let container = (this.props.container && React.findDOMNode(this.props.container)) || document.body;
+    let container = (this.props.container && React.findDOMNode(this.props.container)) || React.findDOMNode(this).ownerDocument.body;
     container.className = container.className.replace(/ ?modal-open/, '');
   },
 
diff --git a/src/OverlayMixin.js b/src/OverlayMixin.js
index 2cd9f3f8a9..5e99799ecf 100644
--- a/src/OverlayMixin.js
+++ b/src/OverlayMixin.js
@@ -63,6 +63,6 @@ export default {
   },
 
   getContainerDOMNode() {
-    return React.findDOMNode(this.props.container || document.body);
+    return React.findDOMNode(this.props.container || React.findDOMNode(this).ownerDocument.body);
   }
 };
diff --git a/src/utils/domUtils.js b/src/utils/domUtils.js
index cf9c6cd3f2..8d62e11bf9 100644
--- a/src/utils/domUtils.js
+++ b/src/utils/domUtils.js
@@ -21,7 +21,7 @@ function getOffset(DOMNode) {
     return window.jQuery(DOMNode).offset();
   }
 
-  let docElem = document.documentElement;
+  let docElem = DOMNode.ownerDocument.documentElement;
   let box = { top: 0, left: 0 };
 
   // If we don't have gBCR, just use 0,0 rather than error
@@ -89,7 +89,7 @@ function getPosition(elem, offsetParent) {
  * @returns {HTMLElement}
  */
 function offsetParentFunc(elem) {
-  let docElem = document.documentElement;
+  let docElem = elem.ownerDocument.documentElement;
   let offsetParent = elem.offsetParent || docElem;
 
   while ( offsetParent && ( offsetParent.nodeName !== 'HTML' &&