From 1571a9a2dfbe6dd3bb598a92f7f62e457b613241 Mon Sep 17 00:00:00 2001
From: Christopher Speller <crspeller@gmail.com>
Date: Thu, 15 Oct 2015 12:07:06 -0400
Subject: [PATCH] Fixing most deprication warnings

---
 web/react/components/access_history_modal.jsx |   4 +-
 web/react/components/activity_log_modal.jsx   |   4 +-
 .../admin_console/admin_navbar_dropdown.jsx   |   4 +-
 .../admin_console/email_settings.jsx          |  34 ++---
 .../admin_console/gitlab_settings.jsx         |  14 +-
 .../admin_console/image_settings.jsx          |  58 ++++----
 .../components/admin_console/log_settings.jsx |  12 +-
 .../admin_console/privacy_settings.jsx        |   4 +-
 .../admin_console/rate_settings.jsx           |  18 +--
 .../admin_console/reset_password_modal.jsx    |   4 +-
 .../admin_console/select_team_modal.jsx       |   2 +-
 .../admin_console/service_settings.jsx        |  26 ++--
 .../components/admin_console/sql_settings.jsx |  20 +--
 .../admin_console/team_settings.jsx           |  14 +-
 web/react/components/change_url_modal.jsx     |   4 +-
 web/react/components/channel_header.jsx       | 138 ++++++++++--------
 web/react/components/channel_info_modal.jsx   |   2 +-
 web/react/components/channel_invite_modal.jsx |   4 +-
 web/react/components/channel_members.jsx      |   4 +-
 .../components/channel_notifications.jsx      |   6 +-
 web/react/components/create_comment.jsx       |   4 +-
 web/react/components/create_post.jsx          |   6 +-
 web/react/components/delete_channel_modal.jsx |   2 +-
 web/react/components/delete_post_modal.jsx    |   2 +-
 web/react/components/edit_channel_modal.jsx   |   8 +-
 web/react/components/edit_post_modal.jsx      |   8 +-
 web/react/components/file_attachment.jsx      |   4 +-
 web/react/components/file_upload.jsx          |   4 +-
 web/react/components/find_team.jsx            |   2 +-
 web/react/components/get_link_modal.jsx       |   6 +-
 web/react/components/invite_member_modal.jsx  |  22 +--
 web/react/components/login.jsx                |   4 +-
 web/react/components/mention_list.jsx         |   2 +-
 web/react/components/more_channels.jsx        |   8 +-
 web/react/components/more_direct_channels.jsx |   2 +-
 web/react/components/navbar.jsx               |  68 ++++++---
 web/react/components/navbar_dropdown.jsx      |   4 +-
 web/react/components/new_channel_modal.jsx    |   6 +-
 web/react/components/password_reset_form.jsx  |   2 +-
 .../components/password_reset_send_link.jsx   |   4 +-
 web/react/components/post_body.jsx            |   2 +-
 web/react/components/post_deleted_modal.jsx   |   2 +-
 web/react/components/post_list.jsx            |  20 +--
 web/react/components/register_app_modal.jsx   |  12 +-
 .../components/removed_from_channel_modal.jsx |   8 +-
 web/react/components/rename_channel_modal.jsx |  20 +--
 web/react/components/rhs_comment.jsx          |   2 +-
 web/react/components/rhs_root_post.jsx        |   2 +-
 web/react/components/search_bar.jsx           |   2 +-
 web/react/components/setting_picture.jsx      |   2 +-
 web/react/components/setting_upload.jsx       |   2 +-
 web/react/components/sidebar.jsx              |   6 +-
 web/react/components/signup_user_complete.jsx |   6 +-
 web/react/components/team_members.jsx         |   4 +-
 .../team_signup_display_name_page.jsx         |   2 +-
 .../components/team_signup_email_item.jsx     |   4 +-
 .../components/team_signup_password_page.jsx  |   2 +-
 web/react/components/team_signup_url_page.jsx |   2 +-
 .../components/team_signup_username_page.jsx  |   2 +-
 .../components/team_signup_welcome_page.jsx   |   2 +-
 .../components/team_signup_with_email.jsx     |   2 +-
 web/react/components/team_signup_with_sso.jsx |   2 +-
 web/react/components/textbox.jsx              |  30 ++--
 .../user_settings/import_theme_modal.jsx      |   2 +-
 .../user_settings_appearance.jsx              |   4 +-
 .../user_settings/user_settings_general.jsx   |   2 +-
 .../user_settings_notifications.jsx           |  14 +-
 .../user_settings/user_settings_security.jsx  |   2 +-
 web/react/components/view_image.jsx           |   2 +-
 web/react/pages/admin_console.jsx             |   6 +-
 web/react/pages/authorize.jsx                 |   2 +-
 web/react/pages/channel.jsx                   |  68 ++++-----
 web/react/pages/find_team.jsx                 |   2 +-
 web/react/pages/login.jsx                     |   2 +-
 web/react/pages/password_reset.jsx            |   2 +-
 web/react/pages/signup_team.jsx               |   2 +-
 web/react/pages/signup_team_complete.jsx      |   2 +-
 web/react/pages/signup_user_complete.jsx      |   2 +-
 web/react/pages/verify.jsx                    |   2 +-
 79 files changed, 422 insertions(+), 376 deletions(-)

diff --git a/web/react/components/access_history_modal.jsx b/web/react/components/access_history_modal.jsx
index 909639859d..c8af2553d6 100644
--- a/web/react/components/access_history_modal.jsx
+++ b/web/react/components/access_history_modal.jsx
@@ -37,9 +37,9 @@ export default class AccessHistoryModal extends React.Component {
     }
     componentDidMount() {
         UserStore.addAuditsChangeListener(this.onAuditChange);
-        $(React.findDOMNode(this.refs.modal)).on('shown.bs.modal', this.onShow);
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('shown.bs.modal', this.onShow);
 
-        $(React.findDOMNode(this.refs.modal)).on('hidden.bs.modal', this.onHide);
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('hidden.bs.modal', this.onHide);
     }
     componentWillUnmount() {
         UserStore.removeAuditsChangeListener(this.onAuditChange);
diff --git a/web/react/components/activity_log_modal.jsx b/web/react/components/activity_log_modal.jsx
index 1fe2133ecc..74d6c64e3d 100644
--- a/web/react/components/activity_log_modal.jsx
+++ b/web/react/components/activity_log_modal.jsx
@@ -56,9 +56,9 @@ export default class ActivityLogModal extends React.Component {
     }
     componentDidMount() {
         UserStore.addSessionsChangeListener(this.onListenerChange);
-        $(React.findDOMNode(this.refs.modal)).on('shown.bs.modal', this.onShow);
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('shown.bs.modal', this.onShow);
 
-        $(React.findDOMNode(this.refs.modal)).on('hidden.bs.modal', this.onHide);
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('hidden.bs.modal', this.onHide);
     }
     componentWillUnmount() {
         UserStore.removeSessionsChangeListener(this.onListenerChange);
diff --git a/web/react/components/admin_console/admin_navbar_dropdown.jsx b/web/react/components/admin_console/admin_navbar_dropdown.jsx
index 21ec5c3cf8..df8da94e13 100644
--- a/web/react/components/admin_console/admin_navbar_dropdown.jsx
+++ b/web/react/components/admin_console/admin_navbar_dropdown.jsx
@@ -27,7 +27,7 @@ export default class AdminNavbarDropdown extends React.Component {
     }
 
     componentDidMount() {
-        $(React.findDOMNode(this.refs.dropdown)).on('hide.bs.dropdown', () => {
+        $(ReactDOM.findDOMNode(this.refs.dropdown)).on('hide.bs.dropdown', () => {
             this.blockToggle = true;
             setTimeout(() => {
                 this.blockToggle = false;
@@ -36,7 +36,7 @@ export default class AdminNavbarDropdown extends React.Component {
     }
 
     componentWillUnmount() {
-        $(React.findDOMNode(this.refs.dropdown)).off('hide.bs.dropdown');
+        $(ReactDOM.findDOMNode(this.refs.dropdown)).off('hide.bs.dropdown');
     }
 
     render() {
diff --git a/web/react/components/admin_console/email_settings.jsx b/web/react/components/admin_console/email_settings.jsx
index 12480e7eb6..01759b2220 100644
--- a/web/react/components/admin_console/email_settings.jsx
+++ b/web/react/components/admin_console/email_settings.jsx
@@ -41,28 +41,28 @@ export default class EmailSettings extends React.Component {
 
     buildConfig() {
         var config = this.props.config;
-        config.EmailSettings.EnableSignUpWithEmail = React.findDOMNode(this.refs.allowSignUpWithEmail).checked;
-        config.EmailSettings.SendEmailNotifications = React.findDOMNode(this.refs.sendEmailNotifications).checked;
-        config.EmailSettings.RequireEmailVerification = React.findDOMNode(this.refs.requireEmailVerification).checked;
-        config.EmailSettings.SendEmailNotifications = React.findDOMNode(this.refs.sendEmailNotifications).checked;
-        config.EmailSettings.FeedbackName = React.findDOMNode(this.refs.feedbackName).value.trim();
-        config.EmailSettings.FeedbackEmail = React.findDOMNode(this.refs.feedbackEmail).value.trim();
-        config.EmailSettings.SMTPServer = React.findDOMNode(this.refs.SMTPServer).value.trim();
-        config.EmailSettings.SMTPPort = React.findDOMNode(this.refs.SMTPPort).value.trim();
-        config.EmailSettings.SMTPUsername = React.findDOMNode(this.refs.SMTPUsername).value.trim();
-        config.EmailSettings.SMTPPassword = React.findDOMNode(this.refs.SMTPPassword).value.trim();
-        config.EmailSettings.ConnectionSecurity = React.findDOMNode(this.refs.ConnectionSecurity).value.trim();
+        config.EmailSettings.EnableSignUpWithEmail = ReactDOM.findDOMNode(this.refs.allowSignUpWithEmail).checked;
+        config.EmailSettings.SendEmailNotifications = ReactDOM.findDOMNode(this.refs.sendEmailNotifications).checked;
+        config.EmailSettings.RequireEmailVerification = ReactDOM.findDOMNode(this.refs.requireEmailVerification).checked;
+        config.EmailSettings.SendEmailNotifications = ReactDOM.findDOMNode(this.refs.sendEmailNotifications).checked;
+        config.EmailSettings.FeedbackName = ReactDOM.findDOMNode(this.refs.feedbackName).value.trim();
+        config.EmailSettings.FeedbackEmail = ReactDOM.findDOMNode(this.refs.feedbackEmail).value.trim();
+        config.EmailSettings.SMTPServer = ReactDOM.findDOMNode(this.refs.SMTPServer).value.trim();
+        config.EmailSettings.SMTPPort = ReactDOM.findDOMNode(this.refs.SMTPPort).value.trim();
+        config.EmailSettings.SMTPUsername = ReactDOM.findDOMNode(this.refs.SMTPUsername).value.trim();
+        config.EmailSettings.SMTPPassword = ReactDOM.findDOMNode(this.refs.SMTPPassword).value.trim();
+        config.EmailSettings.ConnectionSecurity = ReactDOM.findDOMNode(this.refs.ConnectionSecurity).value.trim();
 
-        config.EmailSettings.InviteSalt = React.findDOMNode(this.refs.InviteSalt).value.trim();
+        config.EmailSettings.InviteSalt = ReactDOM.findDOMNode(this.refs.InviteSalt).value.trim();
         if (config.EmailSettings.InviteSalt === '') {
             config.EmailSettings.InviteSalt = crypto.randomBytes(256).toString('base64').substring(0, 32);
-            React.findDOMNode(this.refs.InviteSalt).value = config.EmailSettings.InviteSalt;
+            ReactDOM.findDOMNode(this.refs.InviteSalt).value = config.EmailSettings.InviteSalt;
         }
 
-        config.EmailSettings.PasswordResetSalt = React.findDOMNode(this.refs.PasswordResetSalt).value.trim();
+        config.EmailSettings.PasswordResetSalt = ReactDOM.findDOMNode(this.refs.PasswordResetSalt).value.trim();
         if (config.EmailSettings.PasswordResetSalt === '') {
             config.EmailSettings.PasswordResetSalt = crypto.randomBytes(256).toString('base64').substring(0, 32);
-            React.findDOMNode(this.refs.PasswordResetSalt).value = config.EmailSettings.PasswordResetSalt;
+            ReactDOM.findDOMNode(this.refs.PasswordResetSalt).value = config.EmailSettings.PasswordResetSalt;
         }
 
         return config;
@@ -70,14 +70,14 @@ export default class EmailSettings extends React.Component {
 
     handleGenerateInvite(e) {
         e.preventDefault();
-        React.findDOMNode(this.refs.InviteSalt).value = crypto.randomBytes(256).toString('base64').substring(0, 32);
+        ReactDOM.findDOMNode(this.refs.InviteSalt).value = crypto.randomBytes(256).toString('base64').substring(0, 32);
         var s = {saveNeeded: true, serverError: this.state.serverError};
         this.setState(s);
     }
 
     handleGenerateReset(e) {
         e.preventDefault();
-        React.findDOMNode(this.refs.PasswordResetSalt).value = crypto.randomBytes(256).toString('base64').substring(0, 32);
+        ReactDOM.findDOMNode(this.refs.PasswordResetSalt).value = crypto.randomBytes(256).toString('base64').substring(0, 32);
         var s = {saveNeeded: true, serverError: this.state.serverError};
         this.setState(s);
     }
diff --git a/web/react/components/admin_console/gitlab_settings.jsx b/web/react/components/admin_console/gitlab_settings.jsx
index 41c8ad2fc6..8b0f00083d 100644
--- a/web/react/components/admin_console/gitlab_settings.jsx
+++ b/web/react/components/admin_console/gitlab_settings.jsx
@@ -37,12 +37,12 @@ export default class GitLabSettings extends React.Component {
         $('#save-button').button('loading');
 
         var config = this.props.config;
-        config.GitLabSettings.Enable = React.findDOMNode(this.refs.Enable).checked;
-        config.GitLabSettings.Secret = React.findDOMNode(this.refs.Secret).value.trim();
-        config.GitLabSettings.Id = React.findDOMNode(this.refs.Id).value.trim();
-        config.GitLabSettings.AuthEndpoint = React.findDOMNode(this.refs.AuthEndpoint).value.trim();
-        config.GitLabSettings.TokenEndpoint = React.findDOMNode(this.refs.TokenEndpoint).value.trim();
-        config.GitLabSettings.UserApiEndpoint = React.findDOMNode(this.refs.UserApiEndpoint).value.trim();
+        config.GitLabSettings.Enable = ReactDOM.findDOMNode(this.refs.Enable).checked;
+        config.GitLabSettings.Secret = ReactDOM.findDOMNode(this.refs.Secret).value.trim();
+        config.GitLabSettings.Id = ReactDOM.findDOMNode(this.refs.Id).value.trim();
+        config.GitLabSettings.AuthEndpoint = ReactDOM.findDOMNode(this.refs.AuthEndpoint).value.trim();
+        config.GitLabSettings.TokenEndpoint = ReactDOM.findDOMNode(this.refs.TokenEndpoint).value.trim();
+        config.GitLabSettings.UserApiEndpoint = ReactDOM.findDOMNode(this.refs.UserApiEndpoint).value.trim();
 
         Client.saveConfig(
             config,
@@ -260,7 +260,7 @@ export default class GitLabSettings extends React.Component {
 }
 
 
-//config.GitLabSettings.Scope = React.findDOMNode(this.refs.Scope).value.trim();
+//config.GitLabSettings.Scope = ReactDOM.findDOMNode(this.refs.Scope).value.trim();
 //  <div className='form-group'>
 //     <label
 //         className='control-label col-sm-4'
diff --git a/web/react/components/admin_console/image_settings.jsx b/web/react/components/admin_console/image_settings.jsx
index 24ed5a0a82..8b577e0129 100644
--- a/web/react/components/admin_console/image_settings.jsx
+++ b/web/react/components/admin_console/image_settings.jsx
@@ -24,7 +24,7 @@ export default class FileSettings extends React.Component {
         var s = {saveNeeded: true, serverError: this.state.serverError};
 
         if (action === 'DriverName') {
-            s.DriverName = React.findDOMNode(this.refs.DriverName).value;
+            s.DriverName = ReactDOM.findDOMNode(this.refs.DriverName).value;
         }
 
         this.setState(s);
@@ -32,7 +32,7 @@ export default class FileSettings extends React.Component {
 
     handleGenerate(e) {
         e.preventDefault();
-        React.findDOMNode(this.refs.PublicLinkSalt).value = crypto.randomBytes(256).toString('base64').substring(0, 32);
+        ReactDOM.findDOMNode(this.refs.PublicLinkSalt).value = crypto.randomBytes(256).toString('base64').substring(0, 32);
         var s = {saveNeeded: true, serverError: this.state.serverError};
         this.setState(s);
     }
@@ -42,62 +42,62 @@ export default class FileSettings extends React.Component {
         $('#save-button').button('loading');
 
         var config = this.props.config;
-        config.FileSettings.DriverName = React.findDOMNode(this.refs.DriverName).value;
-        config.FileSettings.Directory = React.findDOMNode(this.refs.Directory).value;
-        config.FileSettings.AmazonS3AccessKeyId = React.findDOMNode(this.refs.AmazonS3AccessKeyId).value;
-        config.FileSettings.AmazonS3SecretAccessKey = React.findDOMNode(this.refs.AmazonS3SecretAccessKey).value;
-        config.FileSettings.AmazonS3Bucket = React.findDOMNode(this.refs.AmazonS3Bucket).value;
-        config.FileSettings.AmazonS3Region = React.findDOMNode(this.refs.AmazonS3Region).value;
-        config.FileSettings.EnablePublicLink = React.findDOMNode(this.refs.EnablePublicLink).checked;
+        config.FileSettings.DriverName = ReactDOM.findDOMNode(this.refs.DriverName).value;
+        config.FileSettings.Directory = ReactDOM.findDOMNode(this.refs.Directory).value;
+        config.FileSettings.AmazonS3AccessKeyId = ReactDOM.findDOMNode(this.refs.AmazonS3AccessKeyId).value;
+        config.FileSettings.AmazonS3SecretAccessKey = ReactDOM.findDOMNode(this.refs.AmazonS3SecretAccessKey).value;
+        config.FileSettings.AmazonS3Bucket = ReactDOM.findDOMNode(this.refs.AmazonS3Bucket).value;
+        config.FileSettings.AmazonS3Region = ReactDOM.findDOMNode(this.refs.AmazonS3Region).value;
+        config.FileSettings.EnablePublicLink = ReactDOM.findDOMNode(this.refs.EnablePublicLink).checked;
 
-        config.FileSettings.PublicLinkSalt = React.findDOMNode(this.refs.PublicLinkSalt).value.trim();
+        config.FileSettings.PublicLinkSalt = ReactDOM.findDOMNode(this.refs.PublicLinkSalt).value.trim();
 
         if (config.FileSettings.PublicLinkSalt === '') {
             config.FileSettings.PublicLinkSalt = crypto.randomBytes(256).toString('base64').substring(0, 32);
-            React.findDOMNode(this.refs.PublicLinkSalt).value = config.FileSettings.PublicLinkSalt;
+            ReactDOM.findDOMNode(this.refs.PublicLinkSalt).value = config.FileSettings.PublicLinkSalt;
         }
 
         var thumbnailWidth = 120;
-        if (!isNaN(parseInt(React.findDOMNode(this.refs.ThumbnailWidth).value, 10))) {
-            thumbnailWidth = parseInt(React.findDOMNode(this.refs.ThumbnailWidth).value, 10);
+        if (!isNaN(parseInt(ReactDOM.findDOMNode(this.refs.ThumbnailWidth).value, 10))) {
+            thumbnailWidth = parseInt(ReactDOM.findDOMNode(this.refs.ThumbnailWidth).value, 10);
         }
         config.FileSettings.ThumbnailWidth = thumbnailWidth;
-        React.findDOMNode(this.refs.ThumbnailWidth).value = thumbnailWidth;
+        ReactDOM.findDOMNode(this.refs.ThumbnailWidth).value = thumbnailWidth;
 
         var thumbnailHeight = 100;
-        if (!isNaN(parseInt(React.findDOMNode(this.refs.ThumbnailHeight).value, 10))) {
-            thumbnailHeight = parseInt(React.findDOMNode(this.refs.ThumbnailHeight).value, 10);
+        if (!isNaN(parseInt(ReactDOM.findDOMNode(this.refs.ThumbnailHeight).value, 10))) {
+            thumbnailHeight = parseInt(ReactDOM.findDOMNode(this.refs.ThumbnailHeight).value, 10);
         }
         config.FileSettings.ThumbnailHeight = thumbnailHeight;
-        React.findDOMNode(this.refs.ThumbnailHeight).value = thumbnailHeight;
+        ReactDOM.findDOMNode(this.refs.ThumbnailHeight).value = thumbnailHeight;
 
         var previewWidth = 1024;
-        if (!isNaN(parseInt(React.findDOMNode(this.refs.PreviewWidth).value, 10))) {
-            previewWidth = parseInt(React.findDOMNode(this.refs.PreviewWidth).value, 10);
+        if (!isNaN(parseInt(ReactDOM.findDOMNode(this.refs.PreviewWidth).value, 10))) {
+            previewWidth = parseInt(ReactDOM.findDOMNode(this.refs.PreviewWidth).value, 10);
         }
         config.FileSettings.PreviewWidth = previewWidth;
-        React.findDOMNode(this.refs.PreviewWidth).value = previewWidth;
+        ReactDOM.findDOMNode(this.refs.PreviewWidth).value = previewWidth;
 
         var previewHeight = 0;
-        if (!isNaN(parseInt(React.findDOMNode(this.refs.PreviewHeight).value, 10))) {
-            previewHeight = parseInt(React.findDOMNode(this.refs.PreviewHeight).value, 10);
+        if (!isNaN(parseInt(ReactDOM.findDOMNode(this.refs.PreviewHeight).value, 10))) {
+            previewHeight = parseInt(ReactDOM.findDOMNode(this.refs.PreviewHeight).value, 10);
         }
         config.FileSettings.PreviewHeight = previewHeight;
-        React.findDOMNode(this.refs.PreviewHeight).value = previewHeight;
+        ReactDOM.findDOMNode(this.refs.PreviewHeight).value = previewHeight;
 
         var profileWidth = 128;
-        if (!isNaN(parseInt(React.findDOMNode(this.refs.ProfileWidth).value, 10))) {
-            profileWidth = parseInt(React.findDOMNode(this.refs.ProfileWidth).value, 10);
+        if (!isNaN(parseInt(ReactDOM.findDOMNode(this.refs.ProfileWidth).value, 10))) {
+            profileWidth = parseInt(ReactDOM.findDOMNode(this.refs.ProfileWidth).value, 10);
         }
         config.FileSettings.ProfileWidth = profileWidth;
-        React.findDOMNode(this.refs.ProfileWidth).value = profileWidth;
+        ReactDOM.findDOMNode(this.refs.ProfileWidth).value = profileWidth;
 
         var profileHeight = 128;
-        if (!isNaN(parseInt(React.findDOMNode(this.refs.ProfileHeight).value, 10))) {
-            profileHeight = parseInt(React.findDOMNode(this.refs.ProfileHeight).value, 10);
+        if (!isNaN(parseInt(ReactDOM.findDOMNode(this.refs.ProfileHeight).value, 10))) {
+            profileHeight = parseInt(ReactDOM.findDOMNode(this.refs.ProfileHeight).value, 10);
         }
         config.FileSettings.ProfileHeight = profileHeight;
-        React.findDOMNode(this.refs.ProfileHeight).value = profileHeight;
+        ReactDOM.findDOMNode(this.refs.ProfileHeight).value = profileHeight;
 
         Client.saveConfig(
             config,
diff --git a/web/react/components/admin_console/log_settings.jsx b/web/react/components/admin_console/log_settings.jsx
index 367605f148..931818bb82 100644
--- a/web/react/components/admin_console/log_settings.jsx
+++ b/web/react/components/admin_console/log_settings.jsx
@@ -46,12 +46,12 @@ export default class LogSettings extends React.Component {
         $('#save-button').button('loading');
 
         var config = this.props.config;
-        config.LogSettings.EnableConsole = React.findDOMNode(this.refs.consoleEnable).checked;
-        config.LogSettings.ConsoleLevel = React.findDOMNode(this.refs.consoleLevel).value;
-        config.LogSettings.EnableFile = React.findDOMNode(this.refs.fileEnable).checked;
-        config.LogSettings.FileLevel = React.findDOMNode(this.refs.fileLevel).value;
-        config.LogSettings.FileLocation = React.findDOMNode(this.refs.fileLocation).value.trim();
-        config.LogSettings.FileFormat = React.findDOMNode(this.refs.fileFormat).value.trim();
+        config.LogSettings.EnableConsole = ReactDOM.findDOMNode(this.refs.consoleEnable).checked;
+        config.LogSettings.ConsoleLevel = ReactDOM.findDOMNode(this.refs.consoleLevel).value;
+        config.LogSettings.EnableFile = ReactDOM.findDOMNode(this.refs.fileEnable).checked;
+        config.LogSettings.FileLevel = ReactDOM.findDOMNode(this.refs.fileLevel).value;
+        config.LogSettings.FileLocation = ReactDOM.findDOMNode(this.refs.fileLocation).value.trim();
+        config.LogSettings.FileFormat = ReactDOM.findDOMNode(this.refs.fileFormat).value.trim();
 
         Client.saveConfig(
             config,
diff --git a/web/react/components/admin_console/privacy_settings.jsx b/web/react/components/admin_console/privacy_settings.jsx
index 70ec04f4a1..f2d22f36e7 100644
--- a/web/react/components/admin_console/privacy_settings.jsx
+++ b/web/react/components/admin_console/privacy_settings.jsx
@@ -28,8 +28,8 @@ export default class PrivacySettings extends React.Component {
         $('#save-button').button('loading');
 
         var config = this.props.config;
-        config.PrivacySettings.ShowEmailAddress = React.findDOMNode(this.refs.ShowEmailAddress).checked;
-        config.PrivacySettings.ShowFullName = React.findDOMNode(this.refs.ShowFullName).checked;
+        config.PrivacySettings.ShowEmailAddress = ReactDOM.findDOMNode(this.refs.ShowEmailAddress).checked;
+        config.PrivacySettings.ShowFullName = ReactDOM.findDOMNode(this.refs.ShowFullName).checked;
 
         Client.saveConfig(
             config,
diff --git a/web/react/components/admin_console/rate_settings.jsx b/web/react/components/admin_console/rate_settings.jsx
index 65c39ac423..4d71777c47 100644
--- a/web/react/components/admin_console/rate_settings.jsx
+++ b/web/react/components/admin_console/rate_settings.jsx
@@ -46,23 +46,23 @@ export default class RateSettings extends React.Component {
         $('#save-button').button('loading');
 
         var config = this.props.config;
-        config.RateLimitSettings.EnableRateLimiter = React.findDOMNode(this.refs.EnableRateLimiter).checked;
-        config.RateLimitSettings.VaryByRemoteAddr = React.findDOMNode(this.refs.VaryByRemoteAddr).checked;
-        config.RateLimitSettings.VaryByHeader = React.findDOMNode(this.refs.VaryByHeader).value.trim();
+        config.RateLimitSettings.EnableRateLimiter = ReactDOM.findDOMNode(this.refs.EnableRateLimiter).checked;
+        config.RateLimitSettings.VaryByRemoteAddr = ReactDOM.findDOMNode(this.refs.VaryByRemoteAddr).checked;
+        config.RateLimitSettings.VaryByHeader = ReactDOM.findDOMNode(this.refs.VaryByHeader).value.trim();
 
         var PerSec = 10;
-        if (!isNaN(parseInt(React.findDOMNode(this.refs.PerSec).value, 10))) {
-            PerSec = parseInt(React.findDOMNode(this.refs.PerSec).value, 10);
+        if (!isNaN(parseInt(ReactDOM.findDOMNode(this.refs.PerSec).value, 10))) {
+            PerSec = parseInt(ReactDOM.findDOMNode(this.refs.PerSec).value, 10);
         }
         config.RateLimitSettings.PerSec = PerSec;
-        React.findDOMNode(this.refs.PerSec).value = PerSec;
+        ReactDOM.findDOMNode(this.refs.PerSec).value = PerSec;
 
         var MemoryStoreSize = 10000;
-        if (!isNaN(parseInt(React.findDOMNode(this.refs.MemoryStoreSize).value, 10))) {
-            MemoryStoreSize = parseInt(React.findDOMNode(this.refs.MemoryStoreSize).value, 10);
+        if (!isNaN(parseInt(ReactDOM.findDOMNode(this.refs.MemoryStoreSize).value, 10))) {
+            MemoryStoreSize = parseInt(ReactDOM.findDOMNode(this.refs.MemoryStoreSize).value, 10);
         }
         config.RateLimitSettings.MemoryStoreSize = MemoryStoreSize;
-        React.findDOMNode(this.refs.MemoryStoreSize).value = MemoryStoreSize;
+        ReactDOM.findDOMNode(this.refs.MemoryStoreSize).value = MemoryStoreSize;
 
         Client.saveConfig(
             config,
diff --git a/web/react/components/admin_console/reset_password_modal.jsx b/web/react/components/admin_console/reset_password_modal.jsx
index 75264be45e..35d3cdd176 100644
--- a/web/react/components/admin_console/reset_password_modal.jsx
+++ b/web/react/components/admin_console/reset_password_modal.jsx
@@ -18,7 +18,7 @@ export default class ResetPasswordModal extends React.Component {
 
     doSubmit(e) {
         e.preventDefault();
-        var password = React.findDOMNode(this.refs.password).value;
+        var password = ReactDOM.findDOMNode(this.refs.password).value;
 
         if (!password || password.length < 5) {
             this.setState({serverError: 'Please enter at least 5 characters.'});
@@ -34,7 +34,7 @@ export default class ResetPasswordModal extends React.Component {
 
         Client.resetPassword(data,
             () => {
-                this.props.onModalSubmit(React.findDOMNode(this.refs.password).value);
+                this.props.onModalSubmit(ReactDOM.findDOMNode(this.refs.password).value);
             },
             (err) => {
                 this.setState({serverError: err.message});
diff --git a/web/react/components/admin_console/select_team_modal.jsx b/web/react/components/admin_console/select_team_modal.jsx
index 21d1c25c34..22189821b0 100644
--- a/web/react/components/admin_console/select_team_modal.jsx
+++ b/web/react/components/admin_console/select_team_modal.jsx
@@ -13,7 +13,7 @@ export default class SelectTeamModal extends React.Component {
 
     doSubmit(e) {
         e.preventDefault();
-        this.props.onModalSubmit(React.findDOMNode(this.refs.team).value);
+        this.props.onModalSubmit(ReactDOM.findDOMNode(this.refs.team).value);
     }
     doCancel() {
         this.props.onModalDismissed();
diff --git a/web/react/components/admin_console/service_settings.jsx b/web/react/components/admin_console/service_settings.jsx
index f29d626461..4105ba6dae 100644
--- a/web/react/components/admin_console/service_settings.jsx
+++ b/web/react/components/admin_console/service_settings.jsx
@@ -27,28 +27,28 @@ export default class ServiceSettings extends React.Component {
         $('#save-button').button('loading');
 
         var config = this.props.config;
-        config.ServiceSettings.ListenAddress = React.findDOMNode(this.refs.ListenAddress).value.trim();
+        config.ServiceSettings.ListenAddress = ReactDOM.findDOMNode(this.refs.ListenAddress).value.trim();
         if (config.ServiceSettings.ListenAddress === '') {
             config.ServiceSettings.ListenAddress = ':8065';
-            React.findDOMNode(this.refs.ListenAddress).value = config.ServiceSettings.ListenAddress;
+            ReactDOM.findDOMNode(this.refs.ListenAddress).value = config.ServiceSettings.ListenAddress;
         }
 
-        config.ServiceSettings.SegmentDeveloperKey = React.findDOMNode(this.refs.SegmentDeveloperKey).value.trim();
-        config.ServiceSettings.GoogleDeveloperKey = React.findDOMNode(this.refs.GoogleDeveloperKey).value.trim();
-        config.ServiceSettings.EnableIncomingWebhooks = React.findDOMNode(this.refs.EnableIncomingWebhooks).checked;
-        config.ServiceSettings.EnablePostUsernameOverride = React.findDOMNode(this.refs.EnablePostUsernameOverride).checked;
-        config.ServiceSettings.EnablePostIconOverride = React.findDOMNode(this.refs.EnablePostIconOverride).checked;
-        config.ServiceSettings.EnableTesting = React.findDOMNode(this.refs.EnableTesting).checked;
-        config.ServiceSettings.EnableSecurityFixAlert = React.findDOMNode(this.refs.EnableSecurityFixAlert).checked;
+        config.ServiceSettings.SegmentDeveloperKey = ReactDOM.findDOMNode(this.refs.SegmentDeveloperKey).value.trim();
+        config.ServiceSettings.GoogleDeveloperKey = ReactDOM.findDOMNode(this.refs.GoogleDeveloperKey).value.trim();
+        config.ServiceSettings.EnableIncomingWebhooks = ReactDOM.findDOMNode(this.refs.EnableIncomingWebhooks).checked;
+        config.ServiceSettings.EnablePostUsernameOverride = ReactDOM.findDOMNode(this.refs.EnablePostUsernameOverride).checked;
+        config.ServiceSettings.EnablePostIconOverride = ReactDOM.findDOMNode(this.refs.EnablePostIconOverride).checked;
+        config.ServiceSettings.EnableTesting = ReactDOM.findDOMNode(this.refs.EnableTesting).checked;
+        config.ServiceSettings.EnableSecurityFixAlert = ReactDOM.findDOMNode(this.refs.EnableSecurityFixAlert).checked;
 
-        //config.ServiceSettings.EnableOAuthServiceProvider = React.findDOMNode(this.refs.EnableOAuthServiceProvider).checked;
+        //config.ServiceSettings.EnableOAuthServiceProvider = ReactDOM.findDOMNode(this.refs.EnableOAuthServiceProvider).checked;
 
         var MaximumLoginAttempts = 10;
-        if (!isNaN(parseInt(React.findDOMNode(this.refs.MaximumLoginAttempts).value, 10))) {
-            MaximumLoginAttempts = parseInt(React.findDOMNode(this.refs.MaximumLoginAttempts).value, 10);
+        if (!isNaN(parseInt(ReactDOM.findDOMNode(this.refs.MaximumLoginAttempts).value, 10))) {
+            MaximumLoginAttempts = parseInt(ReactDOM.findDOMNode(this.refs.MaximumLoginAttempts).value, 10);
         }
         config.ServiceSettings.MaximumLoginAttempts = MaximumLoginAttempts;
-        React.findDOMNode(this.refs.MaximumLoginAttempts).value = MaximumLoginAttempts;
+        ReactDOM.findDOMNode(this.refs.MaximumLoginAttempts).value = MaximumLoginAttempts;
 
         Client.saveConfig(
             config,
diff --git a/web/react/components/admin_console/sql_settings.jsx b/web/react/components/admin_console/sql_settings.jsx
index 655daa30c0..b43108bf72 100644
--- a/web/react/components/admin_console/sql_settings.jsx
+++ b/web/react/components/admin_console/sql_settings.jsx
@@ -29,27 +29,27 @@ export default class SqlSettings extends React.Component {
         $('#save-button').button('loading');
 
         var config = this.props.config;
-        config.SqlSettings.Trace = React.findDOMNode(this.refs.Trace).checked;
-        config.SqlSettings.AtRestEncryptKey = React.findDOMNode(this.refs.AtRestEncryptKey).value.trim();
+        config.SqlSettings.Trace = ReactDOM.findDOMNode(this.refs.Trace).checked;
+        config.SqlSettings.AtRestEncryptKey = ReactDOM.findDOMNode(this.refs.AtRestEncryptKey).value.trim();
 
         if (config.SqlSettings.AtRestEncryptKey === '') {
             config.SqlSettings.AtRestEncryptKey = crypto.randomBytes(256).toString('base64').substring(0, 32);
-            React.findDOMNode(this.refs.AtRestEncryptKey).value = config.SqlSettings.AtRestEncryptKey;
+            ReactDOM.findDOMNode(this.refs.AtRestEncryptKey).value = config.SqlSettings.AtRestEncryptKey;
         }
 
         var MaxOpenConns = 10;
-        if (!isNaN(parseInt(React.findDOMNode(this.refs.MaxOpenConns).value, 10))) {
-            MaxOpenConns = parseInt(React.findDOMNode(this.refs.MaxOpenConns).value, 10);
+        if (!isNaN(parseInt(ReactDOM.findDOMNode(this.refs.MaxOpenConns).value, 10))) {
+            MaxOpenConns = parseInt(ReactDOM.findDOMNode(this.refs.MaxOpenConns).value, 10);
         }
         config.SqlSettings.MaxOpenConns = MaxOpenConns;
-        React.findDOMNode(this.refs.MaxOpenConns).value = MaxOpenConns;
+        ReactDOM.findDOMNode(this.refs.MaxOpenConns).value = MaxOpenConns;
 
         var MaxIdleConns = 10;
-        if (!isNaN(parseInt(React.findDOMNode(this.refs.MaxIdleConns).value, 10))) {
-            MaxIdleConns = parseInt(React.findDOMNode(this.refs.MaxIdleConns).value, 10);
+        if (!isNaN(parseInt(ReactDOM.findDOMNode(this.refs.MaxIdleConns).value, 10))) {
+            MaxIdleConns = parseInt(ReactDOM.findDOMNode(this.refs.MaxIdleConns).value, 10);
         }
         config.SqlSettings.MaxIdleConns = MaxIdleConns;
-        React.findDOMNode(this.refs.MaxIdleConns).value = MaxIdleConns;
+        ReactDOM.findDOMNode(this.refs.MaxIdleConns).value = MaxIdleConns;
 
         Client.saveConfig(
             config,
@@ -79,7 +79,7 @@ export default class SqlSettings extends React.Component {
             return;
         }
 
-        React.findDOMNode(this.refs.AtRestEncryptKey).value = crypto.randomBytes(256).toString('base64').substring(0, 32);
+        ReactDOM.findDOMNode(this.refs.AtRestEncryptKey).value = crypto.randomBytes(256).toString('base64').substring(0, 32);
         var s = {saveNeeded: true, serverError: this.state.serverError};
         this.setState(s);
     }
diff --git a/web/react/components/admin_console/team_settings.jsx b/web/react/components/admin_console/team_settings.jsx
index a517c56fe3..da4299714a 100644
--- a/web/react/components/admin_console/team_settings.jsx
+++ b/web/react/components/admin_console/team_settings.jsx
@@ -27,17 +27,17 @@ export default class TeamSettings extends React.Component {
         $('#save-button').button('loading');
 
         var config = this.props.config;
-        config.TeamSettings.SiteName = React.findDOMNode(this.refs.SiteName).value.trim();
-        config.TeamSettings.RestrictCreationToDomains = React.findDOMNode(this.refs.RestrictCreationToDomains).value.trim();
-        config.TeamSettings.EnableTeamCreation = React.findDOMNode(this.refs.EnableTeamCreation).checked;
-        config.TeamSettings.EnableUserCreation = React.findDOMNode(this.refs.EnableUserCreation).checked;
+        config.TeamSettings.SiteName = ReactDOM.findDOMNode(this.refs.SiteName).value.trim();
+        config.TeamSettings.RestrictCreationToDomains = ReactDOM.findDOMNode(this.refs.RestrictCreationToDomains).value.trim();
+        config.TeamSettings.EnableTeamCreation = ReactDOM.findDOMNode(this.refs.EnableTeamCreation).checked;
+        config.TeamSettings.EnableUserCreation = ReactDOM.findDOMNode(this.refs.EnableUserCreation).checked;
 
         var MaxUsersPerTeam = 50;
-        if (!isNaN(parseInt(React.findDOMNode(this.refs.MaxUsersPerTeam).value, 10))) {
-            MaxUsersPerTeam = parseInt(React.findDOMNode(this.refs.MaxUsersPerTeam).value, 10);
+        if (!isNaN(parseInt(ReactDOM.findDOMNode(this.refs.MaxUsersPerTeam).value, 10))) {
+            MaxUsersPerTeam = parseInt(ReactDOM.findDOMNode(this.refs.MaxUsersPerTeam).value, 10);
         }
         config.TeamSettings.MaxUsersPerTeam = MaxUsersPerTeam;
-        React.findDOMNode(this.refs.MaxUsersPerTeam).value = MaxUsersPerTeam;
+        ReactDOM.findDOMNode(this.refs.MaxUsersPerTeam).value = MaxUsersPerTeam;
 
         Client.saveConfig(
             config,
diff --git a/web/react/components/change_url_modal.jsx b/web/react/components/change_url_modal.jsx
index f8db13392c..714e93ff8d 100644
--- a/web/react/components/change_url_modal.jsx
+++ b/web/react/components/change_url_modal.jsx
@@ -29,7 +29,7 @@ export default class ChangeUrlModal extends React.Component {
     }
     componentDidUpdate(prevProps) {
         if (this.props.show === true && prevProps.show === false) {
-            React.findDOMNode(this.refs.urlinput).select();
+            ReactDOM.findDOMNode(this.refs.urlinput).select();
         }
     }
     onURLChanged(e) {
@@ -60,7 +60,7 @@ export default class ChangeUrlModal extends React.Component {
     doSubmit(e) {
         e.preventDefault();
 
-        const url = React.findDOMNode(this.refs.urlinput).value;
+        const url = ReactDOM.findDOMNode(this.refs.urlinput).value;
         const cleanedURL = Utils.cleanUpUrlable(url);
         if (cleanedURL !== url || url.length < 2 || url.indexOf('__') > -1) {
             this.setState({urlError: this.getURLError(url)});
diff --git a/web/react/components/channel_header.jsx b/web/react/components/channel_header.jsx
index e47db073d4..7582de6c4a 100644
--- a/web/react/components/channel_header.jsx
+++ b/web/react/components/channel_header.jsx
@@ -17,6 +17,9 @@ const AppDispatcher = require('../dispatcher/app_dispatcher.jsx');
 const Constants = require('../utils/constants.jsx');
 const ActionTypes = Constants.ActionTypes;
 
+const Popover = ReactBootstrap.Popover;
+const OverlayTrigger = ReactBootstrap.OverlayTrigger;
+
 export default class ChannelHeader extends React.Component {
     constructor(props) {
         super(props);
@@ -110,7 +113,21 @@ export default class ChannelHeader extends React.Component {
         }
 
         const channel = this.state.channel;
-        const popoverContent = React.renderToString(<MessageWrapper message={channel.description}/>);
+        const popoverContent = (
+            <Popover
+                id='hader-popover'
+                bStyle='info'
+                bSize='large'
+                placement='bottom'
+                className='description'
+                onMouseOver={() => this.refs.descriptionOverlay.show()}
+                onMouseOut={() => this.refs.descriptionOverlay.hide()}
+            >
+                <MessageWrapper
+                    message={channel.description}
+                />
+            </Popover>
+        );
         let channelTitle = channel.display_name;
         const currentId = UserStore.getCurrentId();
         const isAdmin = Utils.isAdmin(this.state.memberChannel.roles) || Utils.isAdmin(this.state.memberTeam.roles);
@@ -301,75 +318,82 @@ export default class ChannelHeader extends React.Component {
 
         return (
             <table className='channel-header alt'>
-                <tr>
-                    <th>
-                        <div className='channel-header__info'>
-                            <div className='dropdown'>
+                <tbody>
+                    <tr>
+                        <th>
+                            <div className='channel-header__info'>
+                                <div className='dropdown'>
+                                    <a
+                                        href='#'
+                                        className='dropdown-toggle theme'
+                                        type='button'
+                                        id='channel_header_dropdown'
+                                        data-toggle='dropdown'
+                                        aria-expanded='true'
+                                    >
+                                        <strong className='heading'>{channelTitle} </strong>
+                                        <span className='glyphicon glyphicon-chevron-down header-dropdown__icon' />
+                                    </a>
+                                    <ul
+                                        className='dropdown-menu'
+                                        role='menu'
+                                        aria-labelledby='channel_header_dropdown'
+                                    >
+                                        {dropdownContents}
+                                    </ul>
+                                </div>
+                                <OverlayTrigger
+                                    trigger={['hover', 'focus']}
+                                    placement='bottom'
+                                    overlay={popoverContent}
+                                    ref='descriptionOverlay'
+                                >
+                                <div
+                                    onClick={TextFormatting.handleClick}
+                                    className='description'
+                                    dangerouslySetInnerHTML={{__html: TextFormatting.formatText(channel.description, {singleline: true, mentionHighlight: false})}}
+                                />
+                                </OverlayTrigger>
+                            </div>
+                        </th>
+                        <th>
+                            <PopoverListMembers
+                                members={this.state.users}
+                                channelId={channel.id}
+                            />
+                        </th>
+                        <th className='search-bar__container'><NavbarSearchBox /></th>
+                        <th>
+                            <div className='dropdown channel-header__links'>
                                 <a
                                     href='#'
                                     className='dropdown-toggle theme'
                                     type='button'
-                                    id='channel_header_dropdown'
+                                    id='channel_header_right_dropdown'
                                     data-toggle='dropdown'
                                     aria-expanded='true'
                                 >
-                                    <strong className='heading'>{channelTitle} </strong>
-                                    <span className='glyphicon glyphicon-chevron-down header-dropdown__icon' />
+                                    <span dangerouslySetInnerHTML={{__html: Constants.MENU_ICON}} />
                                 </a>
                                 <ul
-                                    className='dropdown-menu'
+                                    className='dropdown-menu dropdown-menu-right'
                                     role='menu'
-                                    aria-labelledby='channel_header_dropdown'
+                                    aria-labelledby='channel_header_right_dropdown'
                                 >
-                                    {dropdownContents}
+                                    <li role='presentation'>
+                                        <a
+                                            role='menuitem'
+                                            href='#'
+                                            onClick={this.searchMentions}
+                                        >
+                                            Recent Mentions
+                                        </a>
+                                    </li>
                                 </ul>
                             </div>
-                            <div
-                                data-toggle='popover'
-                                data-content={popoverContent}
-                                className='description'
-                                onClick={TextFormatting.handleClick}
-                                dangerouslySetInnerHTML={{__html: TextFormatting.formatText(channel.description, {singleline: true, mentionHighlight: false})}}
-                            />
-                        </div>
-                    </th>
-                    <th>
-                        <PopoverListMembers
-                            members={this.state.users}
-                            channelId={channel.id}
-                        />
-                    </th>
-                    <th className='search-bar__container'><NavbarSearchBox /></th>
-                    <th>
-                        <div className='dropdown channel-header__links'>
-                            <a
-                                href='#'
-                                className='dropdown-toggle theme'
-                                type='button'
-                                id='channel_header_right_dropdown'
-                                data-toggle='dropdown'
-                                aria-expanded='true'
-                            >
-                                <span dangerouslySetInnerHTML={{__html: Constants.MENU_ICON}} />
-                            </a>
-                            <ul
-                                className='dropdown-menu dropdown-menu-right'
-                                role='menu'
-                                aria-labelledby='channel_header_right_dropdown'
-                            >
-                                <li role='presentation'>
-                                    <a
-                                        role='menuitem'
-                                        href='#'
-                                        onClick={this.searchMentions}
-                                    >
-                                        Recent Mentions
-                                    </a>
-                                </li>
-                            </ul>
-                        </div>
-                    </th>
-                </tr>
+                        </th>
+                    </tr>
+                </tbody>
             </table>
         );
     }
diff --git a/web/react/components/channel_info_modal.jsx b/web/react/components/channel_info_modal.jsx
index d6de958e7b..bccd8d0b9d 100644
--- a/web/react/components/channel_info_modal.jsx
+++ b/web/react/components/channel_info_modal.jsx
@@ -15,7 +15,7 @@ export default class CommandList extends React.Component {
     componentDidMount() {
         var self = this;
         if (this.refs.modal) {
-            $(React.findDOMNode(this.refs.modal)).on('show.bs.modal', function show(e) {
+            $(ReactDOM.findDOMNode(this.refs.modal)).on('show.bs.modal', function show(e) {
                 var button = e.relatedTarget;
                 self.setState({channel_id: $(button).attr('data-channelid')});
             });
diff --git a/web/react/components/channel_invite_modal.jsx b/web/react/components/channel_invite_modal.jsx
index 1e621c6834..7c77700953 100644
--- a/web/react/components/channel_invite_modal.jsx
+++ b/web/react/components/channel_invite_modal.jsx
@@ -56,8 +56,8 @@ export default class ChannelInviteModal extends React.Component {
         };
     }
     componentDidMount() {
-        $(React.findDOMNode(this)).on('hidden.bs.modal', this.onHide);
-        $(React.findDOMNode(this)).on('show.bs.modal', this.onShow);
+        $(ReactDOM.findDOMNode(this)).on('hidden.bs.modal', this.onHide);
+        $(ReactDOM.findDOMNode(this)).on('show.bs.modal', this.onShow);
 
         ChannelStore.addExtraInfoChangeListener(this.onListenerChange);
         ChannelStore.addChangeListener(this.onListenerChange);
diff --git a/web/react/components/channel_members.jsx b/web/react/components/channel_members.jsx
index 0cd3849773..86cc2464d7 100644
--- a/web/react/components/channel_members.jsx
+++ b/web/react/components/channel_members.jsx
@@ -74,9 +74,9 @@ export default class ChannelMembers extends React.Component {
     componentDidMount() {
         ChannelStore.addExtraInfoChangeListener(this.onChange);
         ChannelStore.addChangeListener(this.onChange);
-        $(React.findDOMNode(this.refs.modal)).on('hidden.bs.modal', this.onHide);
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('hidden.bs.modal', this.onHide);
 
-        $(React.findDOMNode(this.refs.modal)).on('show.bs.modal', this.onShow);
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('show.bs.modal', this.onShow);
     }
     componentWillUnmount() {
         ChannelStore.removeExtraInfoChangeListener(this.onChange);
diff --git a/web/react/components/channel_notifications.jsx b/web/react/components/channel_notifications.jsx
index 2114be9054..6151d4bdd7 100644
--- a/web/react/components/channel_notifications.jsx
+++ b/web/react/components/channel_notifications.jsx
@@ -51,7 +51,7 @@ export default class ChannelNotifications extends React.Component {
     componentDidMount() {
         ChannelStore.addChangeListener(this.onListenerChange);
 
-        $(React.findDOMNode(this.refs.modal)).on('show.bs.modal', this.onShow);
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('show.bs.modal', this.onShow);
     }
     componentWillUnmount() {
         ChannelStore.removeChangeListener(this.onListenerChange);
@@ -104,7 +104,7 @@ export default class ChannelNotifications extends React.Component {
     }
     handleUpdateNotifyLevel(notifyLevel) {
         this.setState({notifyLevel});
-        React.findDOMNode(this.refs.modal).focus();
+        ReactDOM.findDOMNode(this.refs.modal).focus();
     }
     createNotifyLevelSection(serverError) {
         var handleUpdateSection;
@@ -266,7 +266,7 @@ export default class ChannelNotifications extends React.Component {
 
     handleUpdateMarkUnreadLevel(markUnreadLevel) {
         this.setState({markUnreadLevel});
-        React.findDOMNode(this.refs.modal).focus();
+        ReactDOM.findDOMNode(this.refs.modal).focus();
     }
 
     createMarkUnreadLevelSection(serverError) {
diff --git a/web/react/components/create_comment.jsx b/web/react/components/create_comment.jsx
index fa3f82c2ed..2df3dc40f3 100644
--- a/web/react/components/create_comment.jsx
+++ b/web/react/components/create_comment.jsx
@@ -128,7 +128,7 @@ export default class CreateComment extends React.Component {
     commentMsgKeyPress(e) {
         if (e.which === 13 && !e.shiftKey && !e.altKey) {
             e.preventDefault();
-            React.findDOMNode(this.refs.textbox).blur();
+            ReactDOM.findDOMNode(this.refs.textbox).blur();
             this.handleSubmit(e);
         }
 
@@ -191,7 +191,7 @@ export default class CreateComment extends React.Component {
     handleTextDrop(text) {
         const newText = this.state.messageText + text;
         this.handleUserInput(newText);
-        Utils.setCaretPosition(React.findDOMNode(this.refs.textbox.refs.message), newText.length);
+        Utils.setCaretPosition(ReactDOM.findDOMNode(this.refs.textbox.refs.message), newText.length);
     }
     removePreview(id) {
         let previews = this.state.previews;
diff --git a/web/react/components/create_post.jsx b/web/react/components/create_post.jsx
index f350793833..6203e567a8 100644
--- a/web/react/components/create_post.jsx
+++ b/web/react/components/create_post.jsx
@@ -174,7 +174,7 @@ export default class CreatePost extends React.Component {
     postMsgKeyPress(e) {
         if (e.which === 13 && !e.shiftKey && !e.altKey) {
             e.preventDefault();
-            React.findDOMNode(this.refs.textbox).blur();
+            ReactDOM.findDOMNode(this.refs.textbox).blur();
             this.handleSubmit(e);
         }
 
@@ -192,7 +192,7 @@ export default class CreatePost extends React.Component {
         PostStore.storeCurrentDraft(draft);
     }
     resizePostHolder() {
-        const height = $(window).height() - $(React.findDOMNode(this.refs.topDiv)).height() - 50;
+        const height = $(window).height() - $(ReactDOM.findDOMNode(this.refs.topDiv)).height() - 50;
         $('.post-list-holder-by-time').css('height', `${height}px`);
         $(window).trigger('resize');
         if ($(window).width() > 960) {
@@ -243,7 +243,7 @@ export default class CreatePost extends React.Component {
     handleTextDrop(text) {
         const newText = this.state.messageText + text;
         this.handleUserInput(newText);
-        Utils.setCaretPosition(React.findDOMNode(this.refs.textbox.refs.message), newText.length);
+        Utils.setCaretPosition(ReactDOM.findDOMNode(this.refs.textbox.refs.message), newText.length);
     }
     removePreview(id) {
         const previews = Object.assign([], this.state.previews);
diff --git a/web/react/components/delete_channel_modal.jsx b/web/react/components/delete_channel_modal.jsx
index 9358c98d71..b7d633b385 100644
--- a/web/react/components/delete_channel_modal.jsx
+++ b/web/react/components/delete_channel_modal.jsx
@@ -41,7 +41,7 @@ export default class DeleteChannelModal extends React.Component {
         });
     }
     componentDidMount() {
-        $(React.findDOMNode(this.refs.modal)).on('show.bs.modal', this.onShow);
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('show.bs.modal', this.onShow);
     }
     render() {
         const channel = ChannelStore.getCurrent();
diff --git a/web/react/components/delete_post_modal.jsx b/web/react/components/delete_post_modal.jsx
index ea7d76b1e6..3a3dabce53 100644
--- a/web/react/components/delete_post_modal.jsx
+++ b/web/react/components/delete_post_modal.jsx
@@ -73,7 +73,7 @@ export default class DeletePostModal extends React.Component {
         this.setState(newState);
     }
     componentDidMount() {
-        $(React.findDOMNode(this.refs.modal)).on('show.bs.modal', this.onShow);
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('show.bs.modal', this.onShow);
         PostStore.addSelectedPostChangeListener(this.onListenerChange);
     }
     componentWillUnmount() {
diff --git a/web/react/components/edit_channel_modal.jsx b/web/react/components/edit_channel_modal.jsx
index 6ccf12be6a..d63a1db30d 100644
--- a/web/react/components/edit_channel_modal.jsx
+++ b/web/react/components/edit_channel_modal.jsx
@@ -34,7 +34,7 @@ export default class EditChannelModal extends React.Component {
             function handleUpdateSuccess() {
                 this.setState({serverError: ''});
                 AsyncClient.getChannel(this.state.channelId);
-                $(React.findDOMNode(this.refs.modal)).modal('hide');
+                $(ReactDOM.findDOMNode(this.refs.modal)).modal('hide');
             }.bind(this),
             function handleUpdateError(err) {
                 if (err.message === 'Invalid channel_description parameter') {
@@ -56,11 +56,11 @@ export default class EditChannelModal extends React.Component {
         this.setState({description: $(button).attr('data-desc'), title: $(button).attr('data-title'), channelId: $(button).attr('data-channelid'), serverError: ''});
     }
     componentDidMount() {
-        $(React.findDOMNode(this.refs.modal)).on('show.bs.modal', this.onShow);
-        $(React.findDOMNode(this.refs.modal)).on('hidden.bs.modal', this.handleClose);
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('show.bs.modal', this.onShow);
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('hidden.bs.modal', this.handleClose);
     }
     componentWillUnmount() {
-        $(React.findDOMNode(this.refs.modal)).off('hidden.bs.modal', this.handleClose);
+        $(ReactDOM.findDOMNode(this.refs.modal)).off('hidden.bs.modal', this.handleClose);
     }
     render() {
         var serverError = null;
diff --git a/web/react/components/edit_post_modal.jsx b/web/react/components/edit_post_modal.jsx
index 165a28a64c..3dbff18cb9 100644
--- a/web/react/components/edit_post_modal.jsx
+++ b/web/react/components/edit_post_modal.jsx
@@ -52,7 +52,7 @@ export default class EditPostModal extends React.Component {
     handleEditKeyPress(e) {
         if (e.which === 13 && !e.shiftKey && !e.altKey) {
             e.preventDefault();
-            React.findDOMNode(this.refs.editbox).blur();
+            ReactDOM.findDOMNode(this.refs.editbox).blur();
             this.handleEdit(e);
         }
     }
@@ -62,16 +62,16 @@ export default class EditPostModal extends React.Component {
     componentDidMount() {
         var self = this;
 
-        $(React.findDOMNode(this.refs.modal)).on('hidden.bs.modal', function onHidden() {
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('hidden.bs.modal', function onHidden() {
             self.setState({editText: '', title: '', channel_id: '', post_id: '', comments: 0, refocusId: '', error: ''});
         });
 
-        $(React.findDOMNode(this.refs.modal)).on('show.bs.modal', function onShow(e) {
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('show.bs.modal', function onShow(e) {
             var button = e.relatedTarget;
             self.setState({editText: $(button).attr('data-message'), title: $(button).attr('data-title'), channel_id: $(button).attr('data-channelid'), post_id: $(button).attr('data-postid'), comments: $(button).attr('data-comments'), refocusId: $(button).attr('data-refoucsid')});
         });
 
-        $(React.findDOMNode(this.refs.modal)).on('shown.bs.modal', function onShown() {
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('shown.bs.modal', function onShown() {
             self.refs.editbox.resize();
         });
     }
diff --git a/web/react/components/file_attachment.jsx b/web/react/components/file_attachment.jsx
index 659da4f5ec..c6dff65507 100644
--- a/web/react/components/file_attachment.jsx
+++ b/web/react/components/file_attachment.jsx
@@ -43,7 +43,7 @@ export default class FileAttachment extends React.Component {
                     return function loader() {
                         $(this).remove();
                         if (name in self.refs) {
-                            var imgDiv = React.findDOMNode(self.refs[name]);
+                            var imgDiv = ReactDOM.findDOMNode(self.refs[name]);
 
                             $(imgDiv).removeClass('post__load');
                             $(imgDiv).addClass('post__image');
@@ -82,7 +82,7 @@ export default class FileAttachment extends React.Component {
         if (nextState.fileSize !== this.state.fileSize) {
             if (this.refs.fileSize) {
                 // update the UI element to display the file size without re-rendering the whole component
-                React.findDOMNode(this.refs.fileSize).innerHTML = utils.fileSizeToString(nextState.fileSize);
+                ReactDOM.findDOMNode(this.refs.fileSize).innerHTML = utils.fileSizeToString(nextState.fileSize);
 
                 return false;
             }
diff --git a/web/react/components/file_upload.jsx b/web/react/components/file_upload.jsx
index e947fc50ce..8854a54df3 100644
--- a/web/react/components/file_upload.jsx
+++ b/web/react/components/file_upload.jsx
@@ -86,7 +86,7 @@ export default class FileUpload extends React.Component {
     }
 
     handleChange() {
-        var element = $(React.findDOMNode(this.refs.fileInput));
+        var element = $(ReactDOM.findDOMNode(this.refs.fileInput));
 
         this.uploadFiles(element.prop('files'));
 
@@ -115,7 +115,7 @@ export default class FileUpload extends React.Component {
     }
 
     componentDidMount() {
-        var inputDiv = React.findDOMNode(this.refs.input);
+        var inputDiv = ReactDOM.findDOMNode(this.refs.input);
         var self = this;
 
         if (this.props.postType === 'post') {
diff --git a/web/react/components/find_team.jsx b/web/react/components/find_team.jsx
index 9e3e3a6837..e324f36661 100644
--- a/web/react/components/find_team.jsx
+++ b/web/react/components/find_team.jsx
@@ -17,7 +17,7 @@ export default class FindTeam extends React.Component {
 
         var state = { };
 
-        var email = React.findDOMNode(this.refs.email).value.trim().toLowerCase();
+        var email = ReactDOM.findDOMNode(this.refs.email).value.trim().toLowerCase();
         if (!email || !utils.isEmail(email)) {
             state.email_error = 'Please enter a valid email address';
             this.setState(state);
diff --git a/web/react/components/get_link_modal.jsx b/web/react/components/get_link_modal.jsx
index eb6bfa9b6c..325e86f3db 100644
--- a/web/react/components/get_link_modal.jsx
+++ b/web/react/components/get_link_modal.jsx
@@ -22,12 +22,12 @@ export default class GetLinkModal extends React.Component {
     }
     componentDidMount() {
         if (this.refs.modal) {
-            $(React.findDOMNode(this.refs.modal)).on('show.bs.modal', this.onShow);
-            $(React.findDOMNode(this.refs.modal)).on('hide.bs.modal', this.onHide);
+            $(ReactDOM.findDOMNode(this.refs.modal)).on('show.bs.modal', this.onShow);
+            $(ReactDOM.findDOMNode(this.refs.modal)).on('hide.bs.modal', this.onHide);
         }
     }
     handleClick() {
-        var copyTextarea = $(React.findDOMNode(this.refs.textarea));
+        var copyTextarea = $(ReactDOM.findDOMNode(this.refs.textarea));
         copyTextarea.select();
 
         try {
diff --git a/web/react/components/invite_member_modal.jsx b/web/react/components/invite_member_modal.jsx
index c2f2c15aca..90290099d0 100644
--- a/web/react/components/invite_member_modal.jsx
+++ b/web/react/components/invite_member_modal.jsx
@@ -36,7 +36,7 @@ export default class InviteMemberModal extends React.Component {
             var notEmpty = false;
             for (var i = 0; i < self.state.inviteIds.length; i++) {
                 var index = self.state.inviteIds[i];
-                if (React.findDOMNode(self.refs['email' + index]).value.trim() !== '') {
+                if (ReactDOM.findDOMNode(self.refs['email' + index]).value.trim() !== '') {
                     notEmpty = true;
                     break;
                 }
@@ -69,7 +69,7 @@ export default class InviteMemberModal extends React.Component {
         for (var i = 0; i < count; i++) {
             var index = inviteIds[i];
             var invite = {};
-            invite.email = React.findDOMNode(this.refs['email' + index]).value.trim();
+            invite.email = ReactDOM.findDOMNode(this.refs['email' + index]).value.trim();
             if (!invite.email || !utils.isEmail(invite.email)) {
                 emailErrors[index] = 'Please enter a valid email address';
                 valid = false;
@@ -77,9 +77,9 @@ export default class InviteMemberModal extends React.Component {
                 emailErrors[index] = '';
             }
 
-            invite.firstName = React.findDOMNode(this.refs['first_name' + index]).value.trim();
+            invite.firstName = ReactDOM.findDOMNode(this.refs['first_name' + index]).value.trim();
 
-            invite.lastName = React.findDOMNode(this.refs['last_name' + index]).value.trim();
+            invite.lastName = ReactDOM.findDOMNode(this.refs['last_name' + index]).value.trim();
 
             invites.push(invite);
         }
@@ -95,8 +95,8 @@ export default class InviteMemberModal extends React.Component {
 
         Client.inviteMembers(data,
             function success() {
-                $(React.findDOMNode(this.refs.modal)).attr('data-confirm', 'true');
-                $(React.findDOMNode(this.refs.modal)).modal('hide');
+                $(ReactDOM.findDOMNode(this.refs.modal)).attr('data-confirm', 'true');
+                $(ReactDOM.findDOMNode(this.refs.modal)).modal('hide');
             }.bind(this),
             function fail(err) {
                 if (err.message === 'This person is already on your team') {
@@ -110,8 +110,8 @@ export default class InviteMemberModal extends React.Component {
     }
 
     componentDidUpdate() {
-        $(React.findDOMNode(this.refs.modalBody)).css('max-height', $(window).height() - 200);
-        $(React.findDOMNode(this.refs.modalBody)).css('overflow-y', 'scroll');
+        $(ReactDOM.findDOMNode(this.refs.modalBody)).css('max-height', $(window).height() - 200);
+        $(ReactDOM.findDOMNode(this.refs.modalBody)).css('overflow-y', 'scroll');
     }
 
     addInviteFields() {
@@ -126,9 +126,9 @@ export default class InviteMemberModal extends React.Component {
 
         for (var i = 0; i < inviteIds.length; i++) {
             var index = inviteIds[i];
-            React.findDOMNode(this.refs['email' + index]).value = '';
-            React.findDOMNode(this.refs['first_name' + index]).value = '';
-            React.findDOMNode(this.refs['last_name' + index]).value = '';
+            ReactDOM.findDOMNode(this.refs['email' + index]).value = '';
+            ReactDOM.findDOMNode(this.refs['first_name' + index]).value = '';
+            ReactDOM.findDOMNode(this.refs['last_name' + index]).value = '';
         }
 
         this.setState({
diff --git a/web/react/components/login.jsx b/web/react/components/login.jsx
index f81822e1ed..c982d57caa 100644
--- a/web/react/components/login.jsx
+++ b/web/react/components/login.jsx
@@ -25,14 +25,14 @@ export default class Login extends React.Component {
             return;
         }
 
-        const email = React.findDOMNode(this.refs.email).value.trim();
+        const email = ReactDOM.findDOMNode(this.refs.email).value.trim();
         if (!email) {
             state.serverError = 'An email is required';
             this.setState(state);
             return;
         }
 
-        const password = React.findDOMNode(this.refs.password).value.trim();
+        const password = ReactDOM.findDOMNode(this.refs.password).value.trim();
         if (!password) {
             state.serverError = 'A password is required';
             this.setState(state);
diff --git a/web/react/components/mention_list.jsx b/web/react/components/mention_list.jsx
index b9ba5f58c2..8c1da942d8 100644
--- a/web/react/components/mention_list.jsx
+++ b/web/react/components/mention_list.jsx
@@ -61,7 +61,7 @@ export default class MentionList extends React.Component {
     }
     onClick(e) {
         if (!($('#' + this.props.id).is(e.target) || $('#' + this.props.id).has(e.target).length ||
-              ('mentionlist' in this.refs && $(React.findDOMNode(this.refs.mentionlist)).has(e.target).length))) {
+              ('mentionlist' in this.refs && $(ReactDOM.findDOMNode(this.refs.mentionlist)).has(e.target).length))) {
             this.setState({mentionText: '-1'});
         }
     }
diff --git a/web/react/components/more_channels.jsx b/web/react/components/more_channels.jsx
index 884b0d6caa..a20c5cad5d 100644
--- a/web/react/components/more_channels.jsx
+++ b/web/react/components/more_channels.jsx
@@ -31,12 +31,12 @@ export default class MoreChannels extends React.Component {
     }
     componentDidMount() {
         ChannelStore.addMoreChangeListener(this.onListenerChange);
-        $(React.findDOMNode(this.refs.modal)).on('shown.bs.modal', function shown() {
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('shown.bs.modal', function shown() {
             asyncClient.getMoreChannels(true);
         });
 
         var self = this;
-        $(React.findDOMNode(this.refs.modal)).on('show.bs.modal', function show(e) {
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('show.bs.modal', function show(e) {
             var button = e.relatedTarget;
             self.setState({channelType: $(button).attr('data-channeltype')});
         });
@@ -54,7 +54,7 @@ export default class MoreChannels extends React.Component {
         this.setState({joiningChannel: channelIndex});
         client.joinChannel(channel.id,
             function joinSuccess() {
-                $(React.findDOMNode(this.refs.modal)).modal('hide');
+                $(ReactDOM.findDOMNode(this.refs.modal)).modal('hide');
                 asyncClient.getChannel(channel.id);
                 utils.switchChannel(channel);
                 this.setState({joiningChannel: -1});
@@ -65,7 +65,7 @@ export default class MoreChannels extends React.Component {
         );
     }
     handleNewChannel() {
-        $(React.findDOMNode(this.refs.modal)).modal('hide');
+        $(ReactDOM.findDOMNode(this.refs.modal)).modal('hide');
         this.setState({showNewChannelModal: true});
     }
     render() {
diff --git a/web/react/components/more_direct_channels.jsx b/web/react/components/more_direct_channels.jsx
index 99babe714d..08b64de8be 100644
--- a/web/react/components/more_direct_channels.jsx
+++ b/web/react/components/more_direct_channels.jsx
@@ -54,7 +54,7 @@ export default class MoreDirectChannels extends React.Component {
     }
 
     handleFilterChange() {
-        const filter = React.findDOMNode(this.refs.filter).value;
+        const filter = ReactDOM.findDOMNode(this.refs.filter).value;
 
         if (filter !== this.state.filter) {
             this.setState({filter});
diff --git a/web/react/components/navbar.jsx b/web/react/components/navbar.jsx
index 6503bd8010..b8b634481f 100644
--- a/web/react/components/navbar.jsx
+++ b/web/react/components/navbar.jsx
@@ -14,6 +14,9 @@ var Constants = require('../utils/constants.jsx');
 var ActionTypes = Constants.ActionTypes;
 var AppDispatcher = require('../dispatcher/app_dispatcher.jsx');
 
+var Popover = ReactBootstrap.Popover;
+var OverlayTrigger = ReactBootstrap.OverlayTrigger;
+
 export default class Navbar extends React.Component {
     constructor(props) {
         super(props);
@@ -224,11 +227,15 @@ export default class Navbar extends React.Component {
             return (
                 <div className='navbar-brand'>
                     <div className='dropdown'>
-                        <div
-                            data-toggle='popover'
-                            data-content={popoverContent}
-                            className='description info-popover'
-                        />
+                        <OverlayTrigger
+                            trigger='click'
+                            placement='bottom'
+                            overlay={popoverContent}
+                            className='description'
+                            rootClose={true}
+                        >
+                            <div className='description info-popover'/>
+                        </OverlayTrigger>
                         <a
                             href='#'
                             className='dropdown-toggle theme'
@@ -330,11 +337,17 @@ export default class Navbar extends React.Component {
         var isDirect = false;
 
         if (channel) {
-            popoverContent = React.renderToString(
-                <MessageWrapper
-                    message={channel.description}
-                    options={{singleline: true, mentionHighlight: false}}
-                />
+            popoverContent = (
+                <Popover
+                    bsStyle='info'
+                    placement='bottom'
+                    id='description-popover'
+                >
+                    <MessageWrapper
+                        message={channel.description}
+                        options={{singleline: true, mentionHighlight: false}}
+                    />
+                </Popover>
             );
             isAdmin = Utils.isAdmin(this.state.member.roles);
 
@@ -354,19 +367,28 @@ export default class Navbar extends React.Component {
             }
 
             if (channel.description.length === 0) {
-                popoverContent = React.renderToString(
-                    <div>
-                        No channel description yet. <br/>
-                        <a
-                            href='#'
-                            data-toggle='modal'
-                            data-desc={channel.description}
-                            data-title={channel.display_name}
-                            data-channelid={channel.id}
-                            data-target='#edit_channel'
-                        >
-                            Click here
-                        </a> to add one.</div>
+                popoverContent = (
+                    <Popover
+                        bsStyle='info'
+                        placement='bottom'
+                        id='description-popover'
+                    >
+                        <div>
+                            {'No channel description yet.'}
+                            <br/>
+                            <a
+                                href='#'
+                                data-toggle='modal'
+                                data-desc={channel.description}
+                                data-title={channel.display_name}
+                                data-channelid={channel.id}
+                                data-target='#edit_channel'
+                            >
+                                {'Click here'}
+                            </a>
+                            {' to add one.'}
+                        </div>
+                    </Popover>
                 );
             }
         }
diff --git a/web/react/components/navbar_dropdown.jsx b/web/react/components/navbar_dropdown.jsx
index 49d517419e..e0410800f7 100644
--- a/web/react/components/navbar_dropdown.jsx
+++ b/web/react/components/navbar_dropdown.jsx
@@ -40,7 +40,7 @@ export default class NavbarDropdown extends React.Component {
         UserStore.addTeamsChangeListener(this.onListenerChange);
         TeamStore.addChangeListener(this.onListenerChange);
 
-        $(React.findDOMNode(this.refs.dropdown)).on('hide.bs.dropdown', () => {
+        $(ReactDOM.findDOMNode(this.refs.dropdown)).on('hide.bs.dropdown', () => {
             this.blockToggle = true;
             setTimeout(() => {
                 this.blockToggle = false;
@@ -51,7 +51,7 @@ export default class NavbarDropdown extends React.Component {
         UserStore.removeTeamsChangeListener(this.onListenerChange);
         TeamStore.removeChangeListener(this.onListenerChange);
 
-        $(React.findDOMNode(this.refs.dropdown)).off('hide.bs.dropdown');
+        $(ReactDOM.findDOMNode(this.refs.dropdown)).off('hide.bs.dropdown');
     }
     onListenerChange() {
         var newState = getStateFromStores();
diff --git a/web/react/components/new_channel_modal.jsx b/web/react/components/new_channel_modal.jsx
index c3d9c046d1..4e6280c99e 100644
--- a/web/react/components/new_channel_modal.jsx
+++ b/web/react/components/new_channel_modal.jsx
@@ -25,7 +25,7 @@ export default class NewChannelModal extends React.Component {
     handleSubmit(e) {
         e.preventDefault();
 
-        const displayName = React.findDOMNode(this.refs.display_name).value.trim();
+        const displayName = ReactDOM.findDOMNode(this.refs.display_name).value.trim();
         if (displayName.length < 1) {
             this.setState({displayNameError: 'This field is required'});
             return;
@@ -35,8 +35,8 @@ export default class NewChannelModal extends React.Component {
     }
     handleChange() {
         const newData = {
-            displayName: React.findDOMNode(this.refs.display_name).value,
-            description: React.findDOMNode(this.refs.channel_desc).value
+            displayName: ReactDOM.findDOMNode(this.refs.display_name).value,
+            description: ReactDOM.findDOMNode(this.refs.channel_desc).value
         };
         this.props.onDataChanged(newData);
     }
diff --git a/web/react/components/password_reset_form.jsx b/web/react/components/password_reset_form.jsx
index 6112adbafb..217f1b3936 100644
--- a/web/react/components/password_reset_form.jsx
+++ b/web/react/components/password_reset_form.jsx
@@ -15,7 +15,7 @@ export default class PasswordResetForm extends React.Component {
         e.preventDefault();
         var state = {};
 
-        var password = React.findDOMNode(this.refs.password).value.trim();
+        var password = ReactDOM.findDOMNode(this.refs.password).value.trim();
         if (!password || password.length < 5) {
             state.error = 'Please enter at least 5 characters.';
             this.setState(state);
diff --git a/web/react/components/password_reset_send_link.jsx b/web/react/components/password_reset_send_link.jsx
index f547499b07..8f1890705d 100644
--- a/web/react/components/password_reset_send_link.jsx
+++ b/web/react/components/password_reset_send_link.jsx
@@ -16,7 +16,7 @@ export default class PasswordResetSendLink extends React.Component {
         e.preventDefault();
         var state = {};
 
-        var email = React.findDOMNode(this.refs.email).value.trim().toLowerCase();
+        var email = ReactDOM.findDOMNode(this.refs.email).value.trim().toLowerCase();
         if (!email || !Utils.isEmail(email)) {
             state.error = 'Please enter a valid email address.';
             this.setState(state);
@@ -33,7 +33,7 @@ export default class PasswordResetSendLink extends React.Component {
         client.sendPasswordReset(data,
              function passwordResetSent() {
                  this.setState({error: null, updateText: <p>A password reset link has been sent to <b>{email}</b> for your <b>{this.props.teamDisplayName}</b> team on {window.location.hostname}.</p>, moreUpdateText: 'Please check your inbox.'});
-                 $(React.findDOMNode(this.refs.reset_form)).hide();
+                 $(ReactDOM.findDOMNode(this.refs.reset_form)).hide();
              }.bind(this),
              function passwordResetFailedToSend(err) {
                  this.setState({error: err.message, update_text: null, moreUpdateText: null});
diff --git a/web/react/components/post_body.jsx b/web/react/components/post_body.jsx
index e87ac6743c..1db0b12e71 100644
--- a/web/react/components/post_body.jsx
+++ b/web/react/components/post_body.jsx
@@ -37,7 +37,7 @@ export default class PostBody extends React.Component {
     }
 
     parseEmojis() {
-        twemoji.parse(React.findDOMNode(this), {size: Constants.EMOJI_SIZE});
+        twemoji.parse(ReactDOM.findDOMNode(this), {size: Constants.EMOJI_SIZE});
     }
 
     componentDidMount() {
diff --git a/web/react/components/post_deleted_modal.jsx b/web/react/components/post_deleted_modal.jsx
index 87afc6a7f3..ba07a22f54 100644
--- a/web/react/components/post_deleted_modal.jsx
+++ b/web/react/components/post_deleted_modal.jsx
@@ -15,7 +15,7 @@ export default class PostDeletedModal extends React.Component {
         this.state = {};
     }
     componentDidMount() {
-        $(React.findDOMNode(this.refs.modal)).on('hidden.bs.modal', () => {
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('hidden.bs.modal', () => {
             this.handleClose();
         });
     }
diff --git a/web/react/components/post_list.jsx b/web/react/components/post_list.jsx
index 643b38af5b..7e5160c2b9 100644
--- a/web/react/components/post_list.jsx
+++ b/web/react/components/post_list.jsx
@@ -107,7 +107,7 @@ export default class PostList extends React.Component {
         UserStore.addStatusesChangeListener(this.onTimeChange);
         SocketStore.addChangeListener(this.onSocketChange);
 
-        const postHolder = $(React.findDOMNode(this.refs.postlist));
+        const postHolder = $(ReactDOM.findDOMNode(this.refs.postlist));
 
         $(window).resize(() => {
             this.resize();
@@ -133,7 +133,7 @@ export default class PostList extends React.Component {
 
             $('.top-visible-post').removeClass('top-visible-post');
 
-            $(React.findDOMNode(this.refs.postlistcontent)).children().each(function select() {
+            $(ReactDOM.findDOMNode(this.refs.postlistcontent)).children().each(function select() {
                 if ($(this).position().top + $(this).height() / 2 > 0) {
                     $(this).addClass('top-visible-post');
                     return false;
@@ -158,7 +158,7 @@ export default class PostList extends React.Component {
         SocketStore.removeChangeListener(this.onSocketChange);
         $('body').off('click.userpopover');
         $(window).off('resize');
-        var postHolder = $(React.findDOMNode(this.refs.postlist));
+        var postHolder = $(ReactDOM.findDOMNode(this.refs.postlist));
         postHolder.off('scroll');
     }
     componentDidUpdate(prevProps, prevState) {
@@ -214,7 +214,7 @@ export default class PostList extends React.Component {
         }
     }
     componentWillUpdate() {
-        var postHolder = $(React.findDOMNode(this.refs.postlist));
+        var postHolder = $(ReactDOM.findDOMNode(this.refs.postlist));
         this.prevScrollTop = postHolder.scrollTop();
     }
     componentWillReceiveProps(nextProps) {
@@ -225,7 +225,7 @@ export default class PostList extends React.Component {
         }
     }
     resize() {
-        const postHolder = $(React.findDOMNode(this.refs.postlist));
+        const postHolder = $(ReactDOM.findDOMNode(this.refs.postlist));
         if ($('#create_post').length > 0) {
             const height = $(window).height() - $('#create_post').height() - $('#error_bar').outerHeight() - 50;
             postHolder.css('height', height + 'px');
@@ -233,12 +233,12 @@ export default class PostList extends React.Component {
     }
     scrollTo(val) {
         this.isUserScroll = false;
-        var postHolder = $(React.findDOMNode(this.refs.postlist));
+        var postHolder = $(ReactDOM.findDOMNode(this.refs.postlist));
         postHolder[0].scrollTop = val;
     }
     scrollToBottom(force) {
         this.isUserScroll = false;
-        var postHolder = $(React.findDOMNode(this.refs.postlist));
+        var postHolder = $(ReactDOM.findDOMNode(this.refs.postlist));
         if ($('#new_message_' + this.props.channelId)[0] && !this.userHasSeenNew && !force) {
             $('#new_message_' + this.props.channelId)[0].scrollIntoView();
         } else {
@@ -596,14 +596,14 @@ export default class PostList extends React.Component {
         var order = this.state.postList.order;
         var channelId = this.props.channelId;
 
-        $(React.findDOMNode(this.refs.loadmore)).text('Retrieving more messages...');
+        $(ReactDOM.findDOMNode(this.refs.loadmore)).text('Retrieving more messages...');
 
         Client.getPostsPage(
             channelId,
             order.length,
             Constants.POST_CHUNK_SIZE,
             function success(data) {
-                $(React.findDOMNode(this.refs.loadmore)).text('Load more messages');
+                $(ReactDOM.findDOMNode(this.refs.loadmore)).text('Load more messages');
                 this.gotMorePosts = true;
                 this.setState({numToDisplay: this.state.numToDisplay + Constants.POST_CHUNK_SIZE});
 
@@ -628,7 +628,7 @@ export default class PostList extends React.Component {
                 Client.getProfiles();
             }.bind(this),
             function fail(err) {
-                $(React.findDOMNode(this.refs.loadmore)).text('Load more messages');
+                $(ReactDOM.findDOMNode(this.refs.loadmore)).text('Load more messages');
                 AsyncClient.dispatchError(err, 'getPosts');
             }.bind(this)
         );
diff --git a/web/react/components/register_app_modal.jsx b/web/react/components/register_app_modal.jsx
index e93c44126d..3d4d9bf458 100644
--- a/web/react/components/register_app_modal.jsx
+++ b/web/react/components/register_app_modal.jsx
@@ -14,7 +14,7 @@ export default class RegisterAppModal extends React.Component {
         this.state = {clientId: '', clientSecret: '', saved: false};
     }
     componentDidMount() {
-        $(React.findDOMNode(this)).on('hide.bs.modal', this.onHide);
+        $(ReactDOM.findDOMNode(this)).on('hide.bs.modal', this.onHide);
     }
     register() {
         var state = this.state;
@@ -22,7 +22,7 @@ export default class RegisterAppModal extends React.Component {
 
         var app = {};
 
-        var name = this.refs.name.getDOMNode().value;
+        var name = this.refs.name.value;
         if (!name || name.length === 0) {
             state.nameError = 'Application name must be filled in.';
             this.setState(state);
@@ -31,7 +31,7 @@ export default class RegisterAppModal extends React.Component {
         state.nameError = null;
         app.name = name;
 
-        var homepage = this.refs.homepage.getDOMNode().value;
+        var homepage = this.refs.homepage.value;
         if (!homepage || homepage.length === 0) {
             state.homepageError = 'Homepage must be filled in.';
             this.setState(state);
@@ -40,10 +40,10 @@ export default class RegisterAppModal extends React.Component {
         state.homepageError = null;
         app.homepage = homepage;
 
-        var desc = this.refs.desc.getDOMNode().value;
+        var desc = this.refs.desc.value;
         app.description = desc;
 
-        var rawCallbacks = this.refs.callback.getDOMNode().value.trim();
+        var rawCallbacks = this.refs.callback.value.trim();
         if (!rawCallbacks || rawCallbacks.length === 0) {
             state.callbackError = 'At least one callback URL must be filled in.';
             this.setState(state);
@@ -73,7 +73,7 @@ export default class RegisterAppModal extends React.Component {
         this.setState({clientId: '', clientSecret: '', saved: false});
     }
     save() {
-        this.setState({saved: this.refs.save.getDOMNode().checked});
+        this.setState({saved: this.refs.save.checked});
     }
     render() {
         var nameError;
diff --git a/web/react/components/removed_from_channel_modal.jsx b/web/react/components/removed_from_channel_modal.jsx
index ca35d6fb07..7cf0a2ef19 100644
--- a/web/react/components/removed_from_channel_modal.jsx
+++ b/web/react/components/removed_from_channel_modal.jsx
@@ -37,13 +37,13 @@ export default class RemovedFromChannelModal extends React.Component {
     }
 
     componentDidMount() {
-        $(React.findDOMNode(this)).on('show.bs.modal', this.handleShow);
-        $(React.findDOMNode(this)).on('hidden.bs.modal', this.handleClose);
+        $(ReactDOM.findDOMNode(this)).on('show.bs.modal', this.handleShow);
+        $(ReactDOM.findDOMNode(this)).on('hidden.bs.modal', this.handleClose);
     }
 
     componentWillUnmount() {
-        $(React.findDOMNode(this)).off('show.bs.modal', this.handleShow);
-        $(React.findDOMNode(this)).off('hidden.bs.modal', this.handleClose);
+        $(ReactDOM.findDOMNode(this)).off('show.bs.modal', this.handleShow);
+        $(ReactDOM.findDOMNode(this)).off('hidden.bs.modal', this.handleClose);
     }
 
     render() {
diff --git a/web/react/components/rename_channel_modal.jsx b/web/react/components/rename_channel_modal.jsx
index 7f7d4554cf..80f0956f2a 100644
--- a/web/react/components/rename_channel_modal.jsx
+++ b/web/react/components/rename_channel_modal.jsx
@@ -76,13 +76,13 @@ export default class RenameChannelModal extends React.Component {
 
         Client.updateChannel(channel,
             function handleUpdateSuccess() {
-                $(React.findDOMNode(this.refs.modal)).modal('hide');
+                $(ReactDOM.findDOMNode(this.refs.modal)).modal('hide');
 
                 AsyncClient.getChannel(channel.id);
                 Utils.updateAddressBar(channel.name);
 
-                React.findDOMNode(this.refs.displayName).value = '';
-                React.findDOMNode(this.refs.channelName).value = '';
+                ReactDOM.findDOMNode(this.refs.displayName).value = '';
+                ReactDOM.findDOMNode(this.refs.channelName).value = '';
             }.bind(this),
             function handleUpdateError(err) {
                 state.serverError = err.message;
@@ -92,15 +92,15 @@ export default class RenameChannelModal extends React.Component {
         );
     }
     onNameChange() {
-        this.setState({channelName: React.findDOMNode(this.refs.channelName).value});
+        this.setState({channelName: ReactDOM.findDOMNode(this.refs.channelName).value});
     }
     onDisplayNameChange() {
-        this.setState({displayName: React.findDOMNode(this.refs.displayName).value});
+        this.setState({displayName: ReactDOM.findDOMNode(this.refs.displayName).value});
     }
     displayNameKeyUp() {
-        const displayName = React.findDOMNode(this.refs.displayName).value.trim();
+        const displayName = ReactDOM.findDOMNode(this.refs.displayName).value.trim();
         const channelName = Utils.cleanUpUrlable(displayName);
-        React.findDOMNode(this.refs.channelName).value = channelName;
+        ReactDOM.findDOMNode(this.refs.channelName).value = channelName;
         this.setState({channelName: channelName});
     }
     handleClose() {
@@ -119,11 +119,11 @@ export default class RenameChannelModal extends React.Component {
         this.setState({displayName: button.attr('data-display'), channelName: button.attr('data-name'), channelId: button.attr('data-channelid')});
     }
     componentDidMount() {
-        $(React.findDOMNode(this.refs.modal)).on('show.bs.modal', this.handleShow);
-        $(React.findDOMNode(this.refs.modal)).on('hidden.bs.modal', this.handleClose);
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('show.bs.modal', this.handleShow);
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('hidden.bs.modal', this.handleClose);
     }
     componentWillUnmount() {
-        $(React.findDOMNode(this.refs.modal)).off('hidden.bs.modal', this.handleClose);
+        $(ReactDOM.findDOMNode(this.refs.modal)).off('hidden.bs.modal', this.handleClose);
     }
     render() {
         let displayNameError = null;
diff --git a/web/react/components/rhs_comment.jsx b/web/react/components/rhs_comment.jsx
index d1ed9b2c09..402e640800 100644
--- a/web/react/components/rhs_comment.jsx
+++ b/web/react/components/rhs_comment.jsx
@@ -55,7 +55,7 @@ export default class RhsComment extends React.Component {
         this.forceUpdate();
     }
     parseEmojis() {
-        twemoji.parse(React.findDOMNode(this), {size: Constants.EMOJI_SIZE});
+        twemoji.parse(ReactDOM.findDOMNode(this), {size: Constants.EMOJI_SIZE});
     }
     componentDidMount() {
         this.parseEmojis();
diff --git a/web/react/components/rhs_root_post.jsx b/web/react/components/rhs_root_post.jsx
index 442d3483ef..a9f1fcd309 100644
--- a/web/react/components/rhs_root_post.jsx
+++ b/web/react/components/rhs_root_post.jsx
@@ -19,7 +19,7 @@ export default class RhsRootPost extends React.Component {
         this.state = {};
     }
     parseEmojis() {
-        twemoji.parse(React.findDOMNode(this), {size: Constants.EMOJI_SIZE});
+        twemoji.parse(ReactDOM.findDOMNode(this), {size: Constants.EMOJI_SIZE});
     }
     componentDidMount() {
         this.parseEmojis();
diff --git a/web/react/components/search_bar.jsx b/web/react/components/search_bar.jsx
index a6f9441ec5..2e9764bd9a 100644
--- a/web/react/components/search_bar.jsx
+++ b/web/react/components/search_bar.jsx
@@ -90,7 +90,7 @@ export default class SearchBar extends React.Component {
                 function success(data) {
                     this.setState({isSearching: false});
                     if (utils.isMobile()) {
-                        React.findDOMNode(this.refs.search).value = '';
+                        ReactDOM.findDOMNode(this.refs.search).value = '';
                     }
 
                     AppDispatcher.handleServerAction({
diff --git a/web/react/components/setting_picture.jsx b/web/react/components/setting_picture.jsx
index c9031e67c3..2f577fe39b 100644
--- a/web/react/components/setting_picture.jsx
+++ b/web/react/components/setting_picture.jsx
@@ -12,7 +12,7 @@ export default class SettingPicture extends React.Component {
         if (file) {
             var reader = new FileReader();
 
-            var img = React.findDOMNode(this.refs.image);
+            var img = ReactDOM.findDOMNode(this.refs.image);
             reader.onload = function load(e) {
                 $(img).attr('src', e.target.result);
             };
diff --git a/web/react/components/setting_upload.jsx b/web/react/components/setting_upload.jsx
index c7107b84da..a25789dfff 100644
--- a/web/react/components/setting_upload.jsx
+++ b/web/react/components/setting_upload.jsx
@@ -37,7 +37,7 @@ export default class SettingsUpload extends React.Component {
 
     doSubmit(e) {
         e.preventDefault();
-        var inputnode = React.findDOMNode(this.refs.uploadinput);
+        var inputnode = ReactDOM.findDOMNode(this.refs.uploadinput);
         if (inputnode.files && inputnode.files[0]) {
             this.props.submit(inputnode.files[0]);
         } else {
diff --git a/web/react/components/sidebar.jsx b/web/react/components/sidebar.jsx
index e7d90bb881..7a209de2b8 100644
--- a/web/react/components/sidebar.jsx
+++ b/web/react/components/sidebar.jsx
@@ -284,13 +284,13 @@ export default class Sidebar extends React.Component {
         this.updateUnreadIndicators();
     }
     updateUnreadIndicators() {
-        const container = $(React.findDOMNode(this.refs.container));
+        const container = $(ReactDOM.findDOMNode(this.refs.container));
 
         var showTopUnread = false;
         var showBottomUnread = false;
 
         if (this.firstUnreadChannel) {
-            var firstUnreadElement = $(React.findDOMNode(this.refs[this.firstUnreadChannel]));
+            var firstUnreadElement = $(ReactDOM.findDOMNode(this.refs[this.firstUnreadChannel]));
 
             if (firstUnreadElement.position().top + firstUnreadElement.height() < 0) {
                 showTopUnread = true;
@@ -298,7 +298,7 @@ export default class Sidebar extends React.Component {
         }
 
         if (this.lastUnreadChannel) {
-            var lastUnreadElement = $(React.findDOMNode(this.refs[this.lastUnreadChannel]));
+            var lastUnreadElement = $(ReactDOM.findDOMNode(this.refs[this.lastUnreadChannel]));
 
             if (lastUnreadElement.position().top > container.height()) {
                 showBottomUnread = true;
diff --git a/web/react/components/signup_user_complete.jsx b/web/react/components/signup_user_complete.jsx
index 98f862e69b..f74c29d27a 100644
--- a/web/react/components/signup_user_complete.jsx
+++ b/web/react/components/signup_user_complete.jsx
@@ -28,7 +28,7 @@ export default class SignupUserComplete extends React.Component {
     handleSubmit(e) {
         e.preventDefault();
 
-        const providedEmail = React.findDOMNode(this.refs.email).value.trim();
+        const providedEmail = ReactDOM.findDOMNode(this.refs.email).value.trim();
         if (!providedEmail) {
             this.setState({nameError: '', emailError: 'This field is required', passwordError: ''});
             return;
@@ -39,7 +39,7 @@ export default class SignupUserComplete extends React.Component {
             return;
         }
 
-        const providedUsername = React.findDOMNode(this.refs.name).value.trim().toLowerCase();
+        const providedUsername = ReactDOM.findDOMNode(this.refs.name).value.trim().toLowerCase();
         if (!providedUsername) {
             this.setState({nameError: 'This field is required', emailError: '', passwordError: '', serverError: ''});
             return;
@@ -59,7 +59,7 @@ export default class SignupUserComplete extends React.Component {
             return;
         }
 
-        const providedPassword = React.findDOMNode(this.refs.password).value.trim();
+        const providedPassword = ReactDOM.findDOMNode(this.refs.password).value.trim();
         if (!providedPassword || providedPassword.length < 5) {
             this.setState({nameError: '', emailError: '', passwordError: 'Please enter at least 5 characters', serverError: ''});
             return;
diff --git a/web/react/components/team_members.jsx b/web/react/components/team_members.jsx
index 0f60d93b21..33590c89ad 100644
--- a/web/react/components/team_members.jsx
+++ b/web/react/components/team_members.jsx
@@ -44,11 +44,11 @@ export default class TeamMembers extends React.Component {
         UserStore.addChangeListener(this.onChange);
 
         var self = this;
-        $(React.findDOMNode(this.refs.modal)).on('hidden.bs.modal', function show() {
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('hidden.bs.modal', function show() {
             self.setState({render_members: false});
         });
 
-        $(React.findDOMNode(this.refs.modal)).on('show.bs.modal', function hide() {
+        $(ReactDOM.findDOMNode(this.refs.modal)).on('show.bs.modal', function hide() {
             self.setState({render_members: true});
         });
     }
diff --git a/web/react/components/team_signup_display_name_page.jsx b/web/react/components/team_signup_display_name_page.jsx
index c91ed08116..4d08274e4b 100644
--- a/web/react/components/team_signup_display_name_page.jsx
+++ b/web/react/components/team_signup_display_name_page.jsx
@@ -21,7 +21,7 @@ export default class TeamSignupDisplayNamePage extends React.Component {
     submitNext(e) {
         e.preventDefault();
 
-        var displayName = React.findDOMNode(this.refs.name).value.trim();
+        var displayName = ReactDOM.findDOMNode(this.refs.name).value.trim();
         if (!displayName) {
             this.setState({nameError: 'This field is required'});
             return;
diff --git a/web/react/components/team_signup_email_item.jsx b/web/react/components/team_signup_email_item.jsx
index 7253e80e92..1d2b24ed75 100644
--- a/web/react/components/team_signup_email_item.jsx
+++ b/web/react/components/team_signup_email_item.jsx
@@ -13,10 +13,10 @@ export default class TeamSignupEmailItem extends React.Component {
         this.state = {};
     }
     getValue() {
-        return React.findDOMNode(this.refs.email).value.trim();
+        return ReactDOM.findDOMNode(this.refs.email).value.trim();
     }
     validate(teamEmail) {
-        const email = React.findDOMNode(this.refs.email).value.trim().toLowerCase();
+        const email = ReactDOM.findDOMNode(this.refs.email).value.trim().toLowerCase();
 
         if (!email) {
             return true;
diff --git a/web/react/components/team_signup_password_page.jsx b/web/react/components/team_signup_password_page.jsx
index cb9a9f05b9..daa898b533 100644
--- a/web/react/components/team_signup_password_page.jsx
+++ b/web/react/components/team_signup_password_page.jsx
@@ -22,7 +22,7 @@ export default class TeamSignupPasswordPage extends React.Component {
     submitNext(e) {
         e.preventDefault();
 
-        var password = React.findDOMNode(this.refs.password).value.trim();
+        var password = ReactDOM.findDOMNode(this.refs.password).value.trim();
         if (!password || password.length < 5) {
             this.setState({passwordError: 'Please enter at least 5 characters'});
             return;
diff --git a/web/react/components/team_signup_url_page.jsx b/web/react/components/team_signup_url_page.jsx
index 3fb0aaa27c..67e4c9dd7a 100644
--- a/web/react/components/team_signup_url_page.jsx
+++ b/web/react/components/team_signup_url_page.jsx
@@ -23,7 +23,7 @@ export default class TeamSignupUrlPage extends React.Component {
     submitNext(e) {
         e.preventDefault();
 
-        const name = React.findDOMNode(this.refs.name).value.trim();
+        const name = ReactDOM.findDOMNode(this.refs.name).value.trim();
         if (!name) {
             this.setState({nameError: 'This field is required'});
             return;
diff --git a/web/react/components/team_signup_username_page.jsx b/web/react/components/team_signup_username_page.jsx
index 82dabad3d3..fa8a031a0a 100644
--- a/web/react/components/team_signup_username_page.jsx
+++ b/web/react/components/team_signup_username_page.jsx
@@ -21,7 +21,7 @@ export default class TeamSignupUsernamePage extends React.Component {
     submitNext(e) {
         e.preventDefault();
 
-        var name = React.findDOMNode(this.refs.name).value.trim().toLowerCase();
+        var name = ReactDOM.findDOMNode(this.refs.name).value.trim().toLowerCase();
 
         var usernameError = Utils.isValidUsername(name);
         if (usernameError === 'Cannot use a reserved word as a username.') {
diff --git a/web/react/components/team_signup_welcome_page.jsx b/web/react/components/team_signup_welcome_page.jsx
index 2d7ef081f9..1e9d8df0a6 100644
--- a/web/react/components/team_signup_welcome_page.jsx
+++ b/web/react/components/team_signup_welcome_page.jsx
@@ -36,7 +36,7 @@ export default class TeamSignupWelcomePage extends React.Component {
 
         var state = {useDiff: true, serverError: ''};
 
-        var email = React.findDOMNode(this.refs.email).value.trim().toLowerCase();
+        var email = ReactDOM.findDOMNode(this.refs.email).value.trim().toLowerCase();
         if (!email || !Utils.isEmail(email)) {
             state.emailError = 'Please enter a valid email address';
             this.setState(state);
diff --git a/web/react/components/team_signup_with_email.jsx b/web/react/components/team_signup_with_email.jsx
index ba32a9f976..ff4ccd4d8b 100644
--- a/web/react/components/team_signup_with_email.jsx
+++ b/web/react/components/team_signup_with_email.jsx
@@ -17,7 +17,7 @@ export default class EmailSignUpPage extends React.Component {
         var team = {};
         var state = {serverError: ''};
 
-        team.email = React.findDOMNode(this.refs.email).value.trim().toLowerCase();
+        team.email = ReactDOM.findDOMNode(this.refs.email).value.trim().toLowerCase();
         if (!team.email || !Utils.isEmail(team.email)) {
             state.emailError = 'Please enter a valid email address';
             state.inValid = true;
diff --git a/web/react/components/team_signup_with_sso.jsx b/web/react/components/team_signup_with_sso.jsx
index 6ccf762c19..a0ccdf2c79 100644
--- a/web/react/components/team_signup_with_sso.jsx
+++ b/web/react/components/team_signup_with_sso.jsx
@@ -54,7 +54,7 @@ export default class SSOSignUpPage extends React.Component {
         );
     }
     nameChange() {
-        this.setState({name: React.findDOMNode(this.refs.teamname).value.trim()});
+        this.setState({name: ReactDOM.findDOMNode(this.refs.teamname).value.trim()});
     }
     render() {
         var nameError = null;
diff --git a/web/react/components/textbox.jsx b/web/react/components/textbox.jsx
index 741dbcd5d2..d51fb95239 100644
--- a/web/react/components/textbox.jsx
+++ b/web/react/components/textbox.jsx
@@ -83,7 +83,7 @@ export default class Textbox extends React.Component {
 
     componentDidUpdate() {
         if (this.caret >= 0) {
-            Utils.setCaretPosition(React.findDOMNode(this.refs.message), this.caret);
+            Utils.setCaretPosition(ReactDOM.findDOMNode(this.refs.message), this.caret);
             this.caret = -1;
         }
         if (this.doProcessMentions) {
@@ -97,7 +97,7 @@ export default class Textbox extends React.Component {
         if (!this.addedMention) {
             this.checkForNewMention(nextProps.messageText);
         }
-        const text = React.findDOMNode(this.refs.message).value;
+        const text = ReactDOM.findDOMNode(this.refs.message).value;
         if (nextProps.channelId !== this.props.channelId || nextProps.messageText !== text) {
             this.doProcessMentions = true;
         }
@@ -117,11 +117,11 @@ export default class Textbox extends React.Component {
     }
 
     handleChange() {
-        this.props.onUserInput(React.findDOMNode(this.refs.message).value);
+        this.props.onUserInput(ReactDOM.findDOMNode(this.refs.message).value);
     }
 
     handleKeyPress(e) {
-        const text = React.findDOMNode(this.refs.message).value;
+        const text = ReactDOM.findDOMNode(this.refs.message).value;
 
         if (!this.refs.commands.isEmpty() && text.indexOf('/') === 0 && e.which === 13) {
             this.refs.commands.addFirstCommand();
@@ -130,7 +130,7 @@ export default class Textbox extends React.Component {
         }
 
         if (!this.doProcessMentions) {
-            const caret = Utils.getCaretPosition(React.findDOMNode(this.refs.message));
+            const caret = Utils.getCaretPosition(ReactDOM.findDOMNode(this.refs.message));
             const preText = text.substring(0, caret);
             const lastSpace = preText.lastIndexOf(' ');
             const lastAt = preText.lastIndexOf('@');
@@ -144,7 +144,7 @@ export default class Textbox extends React.Component {
     }
 
     handleKeyDown(e) {
-        if (Utils.getSelectedText(React.findDOMNode(this.refs.message)) !== '') {
+        if (Utils.getSelectedText(ReactDOM.findDOMNode(this.refs.message)) !== '') {
             this.doProcessMentions = true;
         }
 
@@ -154,7 +154,7 @@ export default class Textbox extends React.Component {
     }
 
     handleBackspace() {
-        const text = React.findDOMNode(this.refs.message).value;
+        const text = ReactDOM.findDOMNode(this.refs.message).value;
         if (text.indexOf('/') === 0) {
             this.refs.commands.getSuggestedCommands(text.substring(0, text.length - 1));
         }
@@ -163,7 +163,7 @@ export default class Textbox extends React.Component {
             return;
         }
 
-        const caret = Utils.getCaretPosition(React.findDOMNode(this.refs.message));
+        const caret = Utils.getCaretPosition(ReactDOM.findDOMNode(this.refs.message));
         const preText = text.substring(0, caret);
         const lastSpace = preText.lastIndexOf(' ');
         const lastAt = preText.lastIndexOf('@');
@@ -174,7 +174,7 @@ export default class Textbox extends React.Component {
     }
 
     checkForNewMention(text) {
-        const caret = Utils.getCaretPosition(React.findDOMNode(this.refs.message));
+        const caret = Utils.getCaretPosition(ReactDOM.findDOMNode(this.refs.message));
 
         const preText = text.substring(0, caret);
 
@@ -201,7 +201,7 @@ export default class Textbox extends React.Component {
     }
 
     addMention(name) {
-        const caret = Utils.getCaretPosition(React.findDOMNode(this.refs.message));
+        const caret = Utils.getCaretPosition(ReactDOM.findDOMNode(this.refs.message));
 
         const text = this.props.messageText;
 
@@ -224,14 +224,14 @@ export default class Textbox extends React.Component {
     }
 
     addCommand(cmd) {
-        const elm = React.findDOMNode(this.refs.message);
+        const elm = ReactDOM.findDOMNode(this.refs.message);
         elm.value = cmd;
         this.handleChange();
     }
 
     resize() {
-        const e = React.findDOMNode(this.refs.message);
-        const w = React.findDOMNode(this.refs.wrapper);
+        const e = ReactDOM.findDOMNode(this.refs.message);
+        const w = ReactDOM.findDOMNode(this.refs.wrapper);
 
         const prevHeight = $(e).height();
 
@@ -259,14 +259,14 @@ export default class Textbox extends React.Component {
     }
 
     handleFocus() {
-        const elm = React.findDOMNode(this.refs.message);
+        const elm = ReactDOM.findDOMNode(this.refs.message);
         if (elm.title === elm.value) {
             elm.value = '';
         }
     }
 
     handleBlur() {
-        const elm = React.findDOMNode(this.refs.message);
+        const elm = ReactDOM.findDOMNode(this.refs.message);
         if (elm.value === '') {
             elm.value = elm.title;
         }
diff --git a/web/react/components/user_settings/import_theme_modal.jsx b/web/react/components/user_settings/import_theme_modal.jsx
index de0663874f..1a9ac0ad39 100644
--- a/web/react/components/user_settings/import_theme_modal.jsx
+++ b/web/react/components/user_settings/import_theme_modal.jsx
@@ -35,7 +35,7 @@ export default class ImportThemeModal extends React.Component {
     handleSubmit(e) {
         e.preventDefault();
 
-        const text = React.findDOMNode(this.refs.input).value;
+        const text = ReactDOM.findDOMNode(this.refs.input).value;
 
         if (!this.isInputValid(text)) {
             this.setState({inputError: 'Invalid format, please try copying and pasting in again.'});
diff --git a/web/react/components/user_settings/user_settings_appearance.jsx b/web/react/components/user_settings/user_settings_appearance.jsx
index a16440d555..7f363e92e9 100644
--- a/web/react/components/user_settings/user_settings_appearance.jsx
+++ b/web/react/components/user_settings/user_settings_appearance.jsx
@@ -29,14 +29,14 @@ export default class UserSettingsAppearance extends React.Component {
         UserStore.addChangeListener(this.onChange);
 
         if (this.props.activeSection === 'theme') {
-            $(React.findDOMNode(this.refs[this.state.theme])).addClass('active-border');
+            $(ReactDOM.findDOMNode(this.refs[this.state.theme])).addClass('active-border');
         }
         $('#user_settings').on('hidden.bs.modal', this.handleClose);
     }
     componentDidUpdate() {
         if (this.props.activeSection === 'theme') {
             $('.color-btn').removeClass('active-border');
-            $(React.findDOMNode(this.refs[this.state.theme])).addClass('active-border');
+            $(ReactDOM.findDOMNode(this.refs[this.state.theme])).addClass('active-border');
         }
     }
     componentWillUnmount() {
diff --git a/web/react/components/user_settings/user_settings_general.jsx b/web/react/components/user_settings/user_settings_general.jsx
index 0e872315d5..9c03f77a64 100644
--- a/web/react/components/user_settings/user_settings_general.jsx
+++ b/web/react/components/user_settings/user_settings_general.jsx
@@ -211,7 +211,7 @@ export default class UserSettingsGeneralTab extends React.Component {
         this.props.updateSection(section);
     }
     handleClose() {
-        $(React.findDOMNode(this)).find('.form-control').each(function clearForms() {
+        $(ReactDOM.findDOMNode(this)).find('.form-control').each(function clearForms() {
             this.value = '';
         });
 
diff --git a/web/react/components/user_settings/user_settings_notifications.jsx b/web/react/components/user_settings/user_settings_notifications.jsx
index 4728a33ee4..4dbb9b96fd 100644
--- a/web/react/components/user_settings/user_settings_notifications.jsx
+++ b/web/react/components/user_settings/user_settings_notifications.jsx
@@ -129,7 +129,7 @@ export default class NotificationsTab extends React.Component {
         );
     }
     handleClose() {
-        $(React.findDOMNode(this)).find('.form-control').each(function clearField() {
+        $(ReactDOM.findDOMNode(this)).find('.form-control').each(function clearField() {
             this.value = '';
         });
 
@@ -158,15 +158,15 @@ export default class NotificationsTab extends React.Component {
     }
     handleNotifyRadio(notifyLevel) {
         this.setState({notifyLevel: notifyLevel});
-        React.findDOMNode(this.refs.wrapper).focus();
+        ReactDOM.findDOMNode(this.refs.wrapper).focus();
     }
     handleEmailRadio(enableEmail) {
         this.setState({enableEmail: enableEmail});
-        React.findDOMNode(this.refs.wrapper).focus();
+        ReactDOM.findDOMNode(this.refs.wrapper).focus();
     }
     handleSoundRadio(enableSound) {
         this.setState({enableSound: enableSound});
-        React.findDOMNode(this.refs.wrapper).focus();
+        ReactDOM.findDOMNode(this.refs.wrapper).focus();
     }
     updateUsernameKey(val) {
         this.setState({usernameKey: val});
@@ -184,10 +184,10 @@ export default class NotificationsTab extends React.Component {
         this.setState({channelKey: val});
     }
     updateCustomMentionKeys() {
-        var checked = React.findDOMNode(this.refs.customcheck).checked;
+        var checked = ReactDOM.findDOMNode(this.refs.customcheck).checked;
 
         if (checked) {
-            var text = React.findDOMNode(this.refs.custommentions).value;
+            var text = ReactDOM.findDOMNode(this.refs.custommentions).value;
 
             // remove all spaces and split string into individual keys
             this.setState({customKeys: text.replace(/ /g, ''), customKeysChecked: true});
@@ -196,7 +196,7 @@ export default class NotificationsTab extends React.Component {
         }
     }
     onCustomChange() {
-        React.findDOMNode(this.refs.customcheck).checked = true;
+        ReactDOM.findDOMNode(this.refs.customcheck).checked = true;
         this.updateCustomMentionKeys();
     }
     render() {
diff --git a/web/react/components/user_settings/user_settings_security.jsx b/web/react/components/user_settings/user_settings_security.jsx
index 74190781c0..983a10df0b 100644
--- a/web/react/components/user_settings/user_settings_security.jsx
+++ b/web/react/components/user_settings/user_settings_security.jsx
@@ -82,7 +82,7 @@ export default class SecurityTab extends React.Component {
         $('#user_settings').modal('hide');
     }
     handleClose() {
-        $(React.findDOMNode(this)).find('.form-control').each(function resetValue() {
+        $(ReactDOM.findDOMNode(this)).find('.form-control').each(function resetValue() {
             this.value = '';
         });
         this.setState({currentPassword: '', newPassword: '', confirmPassword: '', serverError: null, passwordError: null});
diff --git a/web/react/components/view_image.jsx b/web/react/components/view_image.jsx
index c5f0abc126..f756934709 100644
--- a/web/react/components/view_image.jsx
+++ b/web/react/components/view_image.jsx
@@ -77,7 +77,7 @@ export default class ViewImageModal extends React.Component {
     }
     onModalHidden() {
         if (this.refs.video) {
-            var video = React.findDOMNode(this.refs.video);
+            var video = ReactDOM.findDOMNode(this.refs.video);
             video.pause();
             video.currentTime = 0;
         }
diff --git a/web/react/pages/admin_console.jsx b/web/react/pages/admin_console.jsx
index 7e7dcfae81..c89cb4edc8 100644
--- a/web/react/pages/admin_console.jsx
+++ b/web/react/pages/admin_console.jsx
@@ -6,17 +6,17 @@ var SelectTeamModal = require('../components/admin_console/select_team_modal.jsx
 var AdminController = require('../components/admin_console/admin_controller.jsx');
 
 export function setupAdminConsolePage() {
-    React.render(
+    ReactDOM.render(
         <AdminController />,
         document.getElementById('admin_controller')
     );
 
-    React.render(
+    ReactDOM.render(
         <SelectTeamModal />,
         document.getElementById('select_team_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <ErrorBar/>,
         document.getElementById('error_bar')
     );
diff --git a/web/react/pages/authorize.jsx b/web/react/pages/authorize.jsx
index 1338e6cc28..2bc8b539d4 100644
--- a/web/react/pages/authorize.jsx
+++ b/web/react/pages/authorize.jsx
@@ -4,7 +4,7 @@
 var Authorize = require('../components/authorize.jsx');
 
 function setupAuthorizePage(props) {
-    React.render(
+    ReactDOM.render(
         <Authorize
             teamName={props.TeamName}
             appName={props.AppName}
diff --git a/web/react/pages/channel.jsx b/web/react/pages/channel.jsx
index 698213eef5..d9b78dada1 100644
--- a/web/react/pages/channel.jsx
+++ b/web/react/pages/channel.jsx
@@ -55,22 +55,22 @@ function setupChannelPage(props) {
     });
 
     // ChannelLoader must be rendered first
-    React.render(
+    ReactDOM.render(
         <ChannelLoader/>,
         document.getElementById('channel_loader')
     );
 
-    React.render(
+    ReactDOM.render(
         <ErrorBar/>,
         document.getElementById('error_bar')
     );
 
-    React.render(
+    ReactDOM.render(
         <Navbar teamDisplayName={props.TeamDisplayName} />,
         document.getElementById('navbar')
     );
 
-    React.render(
+    ReactDOM.render(
         <Sidebar
             teamDisplayName={props.TeamDisplayName}
             teamName={props.TeamName}
@@ -79,112 +79,112 @@ function setupChannelPage(props) {
         document.getElementById('sidebar-left')
     );
 
-    React.render(
+    ReactDOM.render(
         <GetLinkModal />,
         document.getElementById('get_link_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <UserSettingsModal />,
         document.getElementById('user_settings_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <ImportThemeModal />,
         document.getElementById('import_theme_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <TeamSettingsModal teamDisplayName={props.TeamDisplayName} />,
         document.getElementById('team_settings_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <TeamMembersModal teamDisplayName={props.TeamDisplayName} />,
         document.getElementById('team_members_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <MemberInviteModal teamType={props.TeamType} />,
         document.getElementById('invite_member_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <ChannelHeader />,
         document.getElementById('channel-header')
     );
 
-    React.render(
+    ReactDOM.render(
         <EditChannelModal />,
         document.getElementById('edit_channel_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <DeleteChannelModal />,
         document.getElementById('delete_channel_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <RenameChannelModal />,
         document.getElementById('rename_channel_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <ChannelNotificationsModal />,
         document.getElementById('channel_notifications_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <ChannelMembersModal />,
         document.getElementById('channel_members_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <ChannelInviteModal />,
         document.getElementById('channel_invite_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <ChannelInfoModal />,
         document.getElementById('channel_info_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <MoreChannelsModal />,
         document.getElementById('more_channels_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <PostListContainer />,
         document.getElementById('post-list')
     );
 
-    React.render(
+    ReactDOM.render(
         <EditPostModal />,
         document.getElementById('edit_post_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <DeletePostModal />,
         document.getElementById('delete_post_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <PostDeletedModal />,
         document.getElementById('post_deleted_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <CreatePost />,
         document.getElementById('post-create')
     );
 
-    React.render(
+    ReactDOM.render(
         <SidebarRight />,
         document.getElementById('sidebar-right')
     );
 
-    React.render(
+    ReactDOM.render(
         <SidebarRightMenu
             teamDisplayName={props.TeamDisplayName}
             teamType={props.TeamType}
@@ -192,44 +192,44 @@ function setupChannelPage(props) {
         document.getElementById('sidebar-menu')
     );
 
-    React.render(
+    ReactDOM.render(
         <MentionList id='post_textbox' />,
         document.getElementById('post_mention_tab')
     );
 
-    React.render(
+    ReactDOM.render(
         <MentionList id='reply_textbox' />,
         document.getElementById('reply_mention_tab')
     );
 
-    React.render(
+    ReactDOM.render(
         <MentionList id='edit_textbox' />,
         document.getElementById('edit_mention_tab')
     );
 
-    React.render(
+    ReactDOM.render(
         <AccessHistoryModal />,
         document.getElementById('access_history_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <ActivityLogModal />,
         document.getElementById('activity_log_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <RemovedFromChannelModal />,
         document.getElementById('removed_from_channel_modal')
     );
 
-    React.render(
+    ReactDOM.render(
         <FileUploadOverlay
             overlayType='center'
         />,
         document.getElementById('file_upload_overlay')
     );
 
-    React.render(
+    ReactDOM.render(
         <RegisterAppModal />,
         document.getElementById('register_app_modal')
     );
diff --git a/web/react/pages/find_team.jsx b/web/react/pages/find_team.jsx
index d901e380b8..f95fce5c6a 100644
--- a/web/react/pages/find_team.jsx
+++ b/web/react/pages/find_team.jsx
@@ -4,7 +4,7 @@
 var FindTeam = require('../components/find_team.jsx');
 
 function setupFindTeamPage() {
-    React.render(
+    ReactDOM.render(
         <FindTeam />,
         document.getElementById('find-team')
     );
diff --git a/web/react/pages/login.jsx b/web/react/pages/login.jsx
index 17835c47f9..430de980c2 100644
--- a/web/react/pages/login.jsx
+++ b/web/react/pages/login.jsx
@@ -4,7 +4,7 @@
 var Login = require('../components/login.jsx');
 
 function setupLoginPage(props) {
-    React.render(
+    ReactDOM.render(
         <Login
             teamDisplayName={props.TeamDisplayName}
             teamName={props.TeamName}
diff --git a/web/react/pages/password_reset.jsx b/web/react/pages/password_reset.jsx
index 6f9c5eab1b..aef9ab3f9e 100644
--- a/web/react/pages/password_reset.jsx
+++ b/web/react/pages/password_reset.jsx
@@ -4,7 +4,7 @@
 var PasswordReset = require('../components/password_reset.jsx');
 
 function setupPasswordResetPage(props) {
-    React.render(
+    ReactDOM.render(
         <PasswordReset
             isReset={props.IsReset}
             teamDisplayName={props.TeamDisplayName}
diff --git a/web/react/pages/signup_team.jsx b/web/react/pages/signup_team.jsx
index 06b5cfad9a..dc8394a777 100644
--- a/web/react/pages/signup_team.jsx
+++ b/web/react/pages/signup_team.jsx
@@ -4,7 +4,7 @@
 var SignupTeam = require('../components/signup_team.jsx');
 
 function setupSignupTeamPage() {
-    React.render(
+    ReactDOM.render(
         <SignupTeam />,
         document.getElementById('signup-team')
     );
diff --git a/web/react/pages/signup_team_complete.jsx b/web/react/pages/signup_team_complete.jsx
index 5721178678..44ec05b988 100644
--- a/web/react/pages/signup_team_complete.jsx
+++ b/web/react/pages/signup_team_complete.jsx
@@ -4,7 +4,7 @@
 var SignupTeamComplete = require('../components/signup_team_complete.jsx');
 
 function setupSignupTeamCompletePage(props) {
-    React.render(
+    ReactDOM.render(
         <SignupTeamComplete
             email={props.Email}
             hash={props.Hash}
diff --git a/web/react/pages/signup_user_complete.jsx b/web/react/pages/signup_user_complete.jsx
index 63a55b4a17..a0e0962ff8 100644
--- a/web/react/pages/signup_user_complete.jsx
+++ b/web/react/pages/signup_user_complete.jsx
@@ -4,7 +4,7 @@
 var SignupUserComplete = require('../components/signup_user_complete.jsx');
 
 function setupSignupUserCompletePage(props) {
-    React.render(
+    ReactDOM.render(
         <SignupUserComplete
             teamId={props.TeamId}
             teamName={props.TeamName}
diff --git a/web/react/pages/verify.jsx b/web/react/pages/verify.jsx
index 7f06ff6fb3..7535009b32 100644
--- a/web/react/pages/verify.jsx
+++ b/web/react/pages/verify.jsx
@@ -4,7 +4,7 @@
 var EmailVerify = require('../components/email_verify.jsx');
 
 global.window.setupVerifyPage = function setupVerifyPage(props) {
-    React.render(
+    ReactDOM.render(
         <EmailVerify
             isVerified={props.IsVerified}
             teamURL={props.TeamURL}