Migrate to ReactDOM.findDOMNode

Author: benvinegar

package.json

@@ -28,6 +28,7 @@
     "react": "0.14.0",
     "react-bootstrap": "^0.27.0",
     "react-document-title": "^1.0.2",
+    "react-dom": "^0.14.0",
     "react-lazy-load": "[email protected]:benvinegar/react-lazy-load.git#3abc798f58afdf34e4bf691e6324bcc636c579ae",
     "react-router": "[email protected]:benvinegar/react-router.git#f1ff6c68facff8cd5948e56e3bf9742ffe30625c",
     "react-sticky": "^2.5.2",

src/sentry/static/sentry/app/components/autoSelectText.jsx

@@ -1,19 +1,20 @@
-import jQuery from "jquery";
 import React from "react";
+import jQuery from "jquery";
+import ReactDOM from "react-dom";
 
 const AutoSelectText = React.createClass({
   componentDidMount() {
-    let ref = React.findDOMNode(this.refs.element);
+    let ref = ReactDOM.findDOMNode(this.refs.element);
     jQuery(ref).bind('click', this.selectText);
   },
 
   componentWillUnmount() {
-    let ref = React.findDOMNode(this.refs.element);
+    let ref = ReactDOM.findDOMNode(this.refs.element);
     jQuery(ref).unbind('click', this.selectText);
   },
 
   selectText() {
-    var node = React.findDOMNode(this.refs.element).firstChild;
+    var node = ReactDOM.findDOMNode(this.refs.element).firstChild;
     if (document.selection) {
       let range = document.body.createTextRange();
       range.moveToElementText(node);

src/sentry/static/sentry/app/components/clippedBox.jsx

@@ -1,4 +1,5 @@
 import React from "react";
+import ReactDOM from "react-dom";
 
 var ClippedBox = React.createClass({
   propTypes: {
@@ -20,7 +21,7 @@ var ClippedBox = React.createClass({
   },
 
   componentDidMount() {
-    var renderedHeight = React.findDOMNode(this).offsetHeight;
+    var renderedHeight = ReactDOM.findDOMNode(this).offsetHeight;
 
     if (renderedHeight > this.props.clipHeight ) {
       /*eslint react/no-did-mount-set-state:0*/

src/sentry/static/sentry/app/components/dropdownLink.jsx

@@ -1,5 +1,6 @@
-import classNames from "classnames";
 import React from "react";
+import ReactDOM from "react-dom";
+import classNames from "classnames";
 
 require("bootstrap/js/dropdown");
 
@@ -20,11 +21,11 @@ var DropdownLink = React.createClass({
   },
 
   isOpen() {
-    return React.findDOMNode(this).classList.contains("open");
+    return ReactDOM.findDOMNode(this).classList.contains("open");
   },
 
   close() {
-    React.findDOMNode(this).classList.remove("open");
+    ReactDOM.findDOMNode(this).classList.remove("open");
   },
 
   onToggle(e) {

src/sentry/static/sentry/app/components/flotChart.jsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import ReactDOM from 'react-dom';
 import jQuery from 'jquery';
 import moment from 'moment';
 
@@ -113,7 +114,7 @@ var FlotChart = React.createClass({
       lines: { show: false }
     };
 
-    var chart = React.findDOMNode(this.refs.chartNode);
+    var chart = ReactDOM.findDOMNode(this.refs.chartNode);
     jQuery.plot(chart, series, plotOptions);
   },
 

src/sentry/static/sentry/app/components/projectHeader/projectSelector.jsx

@@ -1,4 +1,5 @@
 import React from "react";
+import ReactDOM from "react-dom";
 import Router from "react-router";
 import jQuery from "jquery";
 import ConfigStore from "../../stores/configStore";
@@ -132,7 +133,7 @@ var ProjectSelector = React.createClass({
   },
 
   onOpen(evt) {
-    React.findDOMNode(this.refs.filter).focus();
+    ReactDOM.findDOMNode(this.refs.filter).focus();
   },
 
   onClose() {
@@ -143,7 +144,7 @@ var ProjectSelector = React.createClass({
 
   componentDidUpdate(prevProps, prevState) {
     // XXX(dcramer): fix odd dedraw issue as of Chrome 45.0.2454.15 dev (64-bit)
-    var node = jQuery(React.findDOMNode(this.refs.container));
+    var node = jQuery(ReactDOM.findDOMNode(this.refs.container));
     node.hide().show(0);
   },
 

src/sentry/static/sentry/app/components/searchBar.jsx

@@ -1,4 +1,5 @@
 import React from "react";
+import ReactDOM from "react-dom";
 var PureRenderMixin = require('react/addons').addons.PureRenderMixin;
 
 var SearchBar = React.createClass({
@@ -24,7 +25,7 @@ var SearchBar = React.createClass({
   },
 
   blur() {
-    React.findDOMNode(this.refs.searchInput).blur();
+    ReactDOM.findDOMNode(this.refs.searchInput).blur();
   },
 
   onSubmit(evt) {

src/sentry/static/sentry/app/components/selectInput.jsx

@@ -23,12 +23,12 @@ var SelectInput = React.createClass({
   },
 
   create() {
-    this.select2 = jQuery(this.refs.select.getDOMNode()).select2();
+    this.select2 = jQuery(this.refs.select).select2();
     this.select2.on('change', this.onChange);
   },
 
   destroy() {
-    jQuery(this.refs.select.getDOMNode()).select2('destroy');
+    jQuery(this.refs.select).select2('destroy');
   },
 
   onChange(...args) {

src/sentry/static/sentry/app/mixins/tooltip.jsx

@@ -1,3 +1,4 @@
+import ReactDOM from "react-dom";
 import $ from "jquery";
 import "bootstrap/js/tooltip";
 
@@ -10,18 +11,18 @@ export default function (options) {
 
     componentWillUnmount() {
       this.removeTooltips();
-      $(this.getDOMNode()).unbind();
+      $(ReactDOM.findDOMNode(this)).unbind();
     },
 
     attachTooltips() {
-      $(this.getDOMNode()).tooltip(
+      $(ReactDOM.findDOMNode(this)).tooltip(
         Object.prototype.toString.call(options) === '[object Function]' ?
           options.call(this) : options
       );
     },
 
     removeTooltips() {
-      $(this.getDOMNode())
+      $(ReactDOM.findDOMNode(this))
         .tooltip("destroy") // destroy tooltips on parent ...
         .find(options.selector)
           .tooltip("destroy"); // ... and descendents

src/sentry/static/sentry/app/views/ruleEditor/index.jsx

@@ -1,4 +1,5 @@
 import React from "react";
+import ReactDOM from "react-dom";
 import $ from "jquery";
 import api from "../../api";
 import IndicatorStore from '../../stores/indicatorStore';
@@ -31,13 +32,13 @@ var RuleEditor = React.createClass({
 
   componentDidUpdate() {
     if (this.state.error) {
-      $(document.body).scrollTop($(React.findDOMNode(this.refs.form)).offset().top);
+      $(document.body).scrollTop($(ReactDOM.findDOMNode(this.refs.form)).offset().top);
     }
   },
 
   onSubmit(e) {
     e.preventDefault();
-    var form = $(React.findDOMNode(this.refs.form));
+    var form = $(ReactDOM.findDOMNode(this.refs.form));
     var conditions = [];
     form.find('.rule-condition-list .rule-form').each((_, el) => {
       conditions.push(this.serializeNode(el));
@@ -46,8 +47,8 @@ var RuleEditor = React.createClass({
     form.find('.rule-action-list .rule-form').each((_, el) => {
       actions.push(this.serializeNode(el));
     });
-    var actionMatch = $(React.findDOMNode(this.refs.actionMatch)).val();
-    var name = $(React.findDOMNode(this.refs.name)).val();
+    var actionMatch = $(ReactDOM.findDOMNode(this.refs.actionMatch)).val();
+    var name = $(ReactDOM.findDOMNode(this.refs.name)).val();
     var data = {
       actionMatch: actionMatch,
       actions: actions,