[fixed] Don't try to access .ownerDocument on null

We previously did not take into account that React.findDOMNode(this)
can return null, (for example if you have a modal and only want to
render the overlay). We now fallback to the root document in that
case.

ee0382e

src/AffixMixin.js

@@ -104,7 +104,7 @@ const AffixMixin = {
  this._onWindowScrollListener =
  EventListener.listen(window, 'scroll', this.checkPosition);
  this._onDocumentClickListener =
- EventListener.listen(React.findDOMNode(this).ownerDocument, 'click', this.checkPositionWithEventLoop);
+ EventListener.listen(domUtils.ownerDocument(this), 'click', this.checkPositionWithEventLoop);
  },
 
  componentWillUnmount() {

src/DropdownStateMixin.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import domUtils from './utils/domUtils';
 import EventListener from './utils/EventListener';
 
 /**
@@ -56,7 +57,7 @@ const DropdownStateMixin = {
  },
 
  bindRootCloseHandlers() {
- let doc = React.findDOMNode(this).ownerDocument;
+ let doc = domUtils.ownerDocument(this);
 
  this._onDocumentClickListener =
  EventListener.listen(doc, 'click', this.handleDocumentClick);

src/FadeMixin.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import domUtils from './utils/domUtils';
 
 // TODO: listen for onTransitionEnd to remove el
 function getElementsAndSelf (root, classes){
@@ -57,7 +58,8 @@ export default {
 
  componentWillUnmount: function () {
  let els = getElementsAndSelf(React.findDOMNode(this), ['fade']),
- container = (this.props.container && React.findDOMNode(this.props.container)) || React.findDOMNode(this).ownerDocument.body;
+ container = (this.props.container && React.findDOMNode(this.props.container)) ||
+ domUtils.ownerDocument(this).body;
 
  if (els.length) {
  this._fadeOutEl = document.createElement('div');

src/Modal.js

@@ -2,6 +2,7 @@ import React from 'react';
 import classSet from 'classnames';
 import BootstrapMixin from './BootstrapMixin';
 import FadeMixin from './FadeMixin';
+import domUtils from './utils/domUtils';
 import EventListener from './utils/EventListener';
 
 
@@ -128,9 +129,10 @@ const Modal = React.createClass({
 
  componentDidMount() {
  this._onDocumentKeyupListener =
- EventListener.listen(React.findDOMNode(this).ownerDocument, 'keyup', this.handleDocumentKeyUp);
+ EventListener.listen(domUtils.ownerDocument(this), 'keyup', this.handleDocumentKeyUp);
 
- let container = (this.props.container && React.findDOMNode(this.props.container)) || React.findDOMNode(this).ownerDocument.body;
+ let container = (this.props.container && React.findDOMNode(this.props.container)) ||
+ domUtils.ownerDocument(this).body;
  container.className += container.className.length ? ' modal-open' : 'modal-open';
 
  if (this.props.backdrop) {
@@ -146,7 +148,8 @@ const Modal = React.createClass({
 
  componentWillUnmount() {
  this._onDocumentKeyupListener.remove();
- let container = (this.props.container && React.findDOMNode(this.props.container)) || React.findDOMNode(this).ownerDocument.body;
+ let container = (this.props.container && React.findDOMNode(this.props.container)) ||
+ domUtils.ownerDocument(this).body;
  container.className = container.className.replace(/ ?modal-open/, '');
  },
 

src/OverlayMixin.js

@@ -1,5 +1,6 @@
 import React from 'react';
 import CustomPropTypes from './utils/CustomPropTypes';
+import domUtils from './utils/domUtils';
 
 export default {
  propTypes: {
@@ -63,6 +64,6 @@ export default {
  },
 
  getContainerDOMNode() {
- return React.findDOMNode(this.props.container || React.findDOMNode(this).ownerDocument.body);
+ return React.findDOMNode(this.props.container) || domUtils.ownerDocument(this).body;
  }
 };

src/utils/domUtils.js

@@ -1,11 +1,24 @@
+import React from 'react';
+
+/**
+ * Get elements owner document
+ *
+ * @param {ReactComponent|HTMLElement} componentOrElement
+ * @returns {HTMLElement}
+ */
+function ownerDocument(componentOrElement) {
+ let elem = React.findDOMNode(componentOrElement);
+ return (elem && elem.ownerDocument) || document;
+}
+
 /**
  * Shortcut to compute element style
  *
  * @param {HTMLElement} elem
  * @returns {CssStyle}
  */
 function getComputedStyles(elem) {
- return elem.ownerDocument.defaultView.getComputedStyle(elem, null);
+ return ownerDocument(elem).defaultView.getComputedStyle(elem, null);
 }
 
 /**
@@ -21,7 +34,7 @@ function getOffset(DOMNode) {
  return window.jQuery(DOMNode).offset();
  }
 
- let docElem = DOMNode.ownerDocument.documentElement;
+ let docElem = ownerDocument(DOMNode).documentElement;
  let box = { top: 0, left: 0 };
 
  // If we don't have gBCR, just use 0,0 rather than error
@@ -89,7 +102,7 @@ function getPosition(elem, offsetParent) {
  * @returns {HTMLElement}
  */
 function offsetParentFunc(elem) {
- let docElem = elem.ownerDocument.documentElement;
+ let docElem = ownerDocument(elem).documentElement;
  let offsetParent = elem.offsetParent || docElem;
 
  while ( offsetParent && ( offsetParent.nodeName !== 'HTML' &&
@@ -101,6 +114,7 @@ function offsetParentFunc(elem) {
 }
 
 export default {
+ ownerDocument: ownerDocument,
  getComputedStyles: getComputedStyles,
  getOffset: getOffset,
  getPosition: getPosition,

test/OverlayMixinSpec.js

@@ -60,4 +60,24 @@ describe('OverlayMixin', function () {
 
  assert.equal(instance.refs.overlay.getOverlayDOMNode(), null);
  });
+
+ it('Should render only an overlay', function() {
+ let OnlyOverlay = React.createClass({
+ mixins: [OverlayMixin],
+
+ render: function() {
+ return null;
+ },
+
+ renderOverlay: function() {
+ return this.props.overlay;
+ }
+ });
+
+ let overlayInstance = ReactTestUtils.renderIntoDocument(
+ <OnlyOverlay overlay={<div id="test1" />} />
+ );
+
+ assert.equal(overlayInstance.getOverlayDOMNode().nodeName, 'DIV');
+ });
 });