upgrade to react 0.14.0

33 files changed, 96 insertions, 81 deletions

diff --git a/server/sonar-web/gulp/scripts.js b/server/sonar-web/gulp/scripts.js
index 644e64eeba3..c59dd002856 100644
--- a/server/sonar-web/gulp/scripts.js
+++ b/server/sonar-web/gulp/scripts.js
@@ -75,6 +75,7 @@ module.exports.main = function (output, production, dev, watch) {
       function (bundle) {
         return bundle
             .require('react', { expose: 'react' })
+            .require('react-dom', { expose: 'react-dom' })
             .require('backbone', { expose: 'backbone' })
             .require('backbone.marionette', { expose: 'backbone.marionette' })
             .require('moment/min/moment-with-locales', { expose: 'moment' });
@@ -98,6 +99,7 @@ module.exports.apps = function (output, production, dev, watch, done) {
           function (bundle) {
             return bundle
                 .external('react')
+                .external('react-dom')
                 .external('backbone')
                 .external('backbone.marionette')
                 .external('moment');
@@ -118,6 +120,7 @@ module.exports.widgets = function (output, production, dev, watch) {
       function (bundle) {
         return bundle
             .external('react')
+            .external('react-dom')
             .external('backbone')
             .external('backbone.marionette')
             .require('moment/min/moment-with-locales', { expose: 'moment' })
@@ -156,4 +159,4 @@ module.exports.sonar = function (output, production) {
       .pipe(gulpif(production, buffer()))
       .pipe(gulpif(production, uglify()))
       .pipe(gulp.dest(path.join(output, 'js')));
-};
\ No newline at end of file
+};
diff --git a/server/sonar-web/package.json b/server/sonar-web/package.json
index 7f2a33ad171..9a3c6870090 100644
--- a/server/sonar-web/package.json
+++ b/server/sonar-web/package.json
@@ -37,7 +37,9 @@
     "jsdom": "6.5.1",
     "mocha": "2.3.3",
     "moment": "2.10.6",
-    "react": "0.13.3",
+    "react": "^0.14.0",
+    "react-addons-test-utils": "^0.14.0",
+    "react-dom": "^0.14.0",
     "sinon": "1.15.4",
     "sinon-chai": "2.8.0",
     "underscore": "1.8.3",
diff --git a/server/sonar-web/src/main/js/apps/background-tasks/app.js b/server/sonar-web/src/main/js/apps/background-tasks/app.js
index 268ca65e336..9830bc967f0 100644
--- a/server/sonar-web/src/main/js/apps/background-tasks/app.js
+++ b/server/sonar-web/src/main/js/apps/background-tasks/app.js
@@ -1,7 +1,8 @@
 import React from 'react';
+import ReactDOM from 'react-dom';
 import Main from './main';
 
 window.sonarqube.appStarted.then(options => {
   let el = document.querySelector(options.el);
-  React.render(<Main options={options}/>, el);
+  ReactDOM.render(<Main options={options}/>, el);
 });
diff --git a/server/sonar-web/src/main/js/apps/background-tasks/search.js b/server/sonar-web/src/main/js/apps/background-tasks/search.js
index acd864f1b33..f2d70c15cd7 100644
--- a/server/sonar-web/src/main/js/apps/background-tasks/search.js
+++ b/server/sonar-web/src/main/js/apps/background-tasks/search.js
@@ -44,8 +44,8 @@ export default React.createClass({
 
   onDateChange(newDate) {
     if (newDate === DATE.CUSTOM) {
-      let minDateRaw = React.findDOMNode(this.refs.minDate).value,
-          maxDateRaw = React.findDOMNode(this.refs.maxDate).value,
+      let minDateRaw = this.refs.minDate.value,
+          maxDateRaw = this.refs.maxDate.value,
           minDate = moment(minDateRaw, DATE_FORMAT, true),
           maxDate = moment(maxDateRaw, DATE_FORMAT, true);
       this.props.onDateChange(newDate,
@@ -68,8 +68,8 @@ export default React.createClass({
       onSelect: this.onDateInputChange
     };
     if ($.fn.datepicker) {
-      $(React.findDOMNode(this.refs.minDate)).datepicker(opts);
-      $(React.findDOMNode(this.refs.maxDate)).datepicker(opts);
+      $(this.refs.minDate).datepicker(opts);
+      $(this.refs.maxDate).datepicker(opts);
     }
   },
 
@@ -92,7 +92,7 @@ export default React.createClass({
   },
 
   onSearch() {
-    let searchInput = React.findDOMNode(this.refs.searchInput),
+    let searchInput = this.refs.searchInput,
         query = searchInput.value;
     this.props.onSearch(query);
   },
diff --git a/server/sonar-web/src/main/js/apps/global-permissions/app.js b/server/sonar-web/src/main/js/apps/global-permissions/app.js
index f010e11b6e0..49a34472e74 100644
--- a/server/sonar-web/src/main/js/apps/global-permissions/app.js
+++ b/server/sonar-web/src/main/js/apps/global-permissions/app.js
@@ -1,8 +1,9 @@
 import React from 'react';
+import ReactDOM from 'react-dom';
 import Main from './main';
 import '../../helpers/handlebars-helpers';
 
 window.sonarqube.appStarted.then(options => {
   var el = document.querySelector(options.el);
-  React.render(<Main/>, el);
+  ReactDOM.render(<Main/>, el);
 });
diff --git a/server/sonar-web/src/main/js/apps/overview/app.js b/server/sonar-web/src/main/js/apps/overview/app.js
index 29fabe96cd3..f2912244670 100644
--- a/server/sonar-web/src/main/js/apps/overview/app.js
+++ b/server/sonar-web/src/main/js/apps/overview/app.js
@@ -1,6 +1,7 @@
 import $ from 'jquery';
 import _ from 'underscore';
 import React from 'react';
+import ReactDOM from 'react-dom';
 import { Overview } from './main';
 
 class App {
@@ -9,7 +10,7 @@ class App {
     _.extend(opts.component, options.component);
     $('html').toggleClass('dashboard-page', opts.component.hasSnapshot);
     let el = document.querySelector(opts.el);
-    React.render(<Overview {...opts}/>, el);
+    ReactDOM.render(<Overview {...opts}/>, el);
   }
 }
 
diff --git a/server/sonar-web/src/main/js/apps/overview/domain/timeline.js b/server/sonar-web/src/main/js/apps/overview/domain/timeline.js
index baa63d6016c..cef1012c012 100644
--- a/server/sonar-web/src/main/js/apps/overview/domain/timeline.js
+++ b/server/sonar-web/src/main/js/apps/overview/domain/timeline.js
@@ -62,7 +62,7 @@ export class DomainTimeline extends React.Component {
   }
 
   handleMetricChange () {
-    let metric = React.findDOMNode(this.refs.metricSelect).value;
+    let metric = this.refs.metricSelect.value;
     this.setState({ currentMetric: metric }, this.requestTimeMachineData);
   }
 
diff --git a/server/sonar-web/src/main/js/apps/permission-templates/app.js b/server/sonar-web/src/main/js/apps/permission-templates/app.js
index aec705a28d6..e8c443eb4e9 100644
--- a/server/sonar-web/src/main/js/apps/permission-templates/app.js
+++ b/server/sonar-web/src/main/js/apps/permission-templates/app.js
@@ -1,8 +1,9 @@
 import React from 'react';
+import ReactDOM from 'react-dom';
 import Main from './main';
 import '../../helpers/handlebars-helpers';
 
 window.sonarqube.appStarted.then(options => {
   var el = document.querySelector(options.el);
-  React.render(<Main topQualifiers={options.rootQualifiers}/>, el);
+  ReactDOM.render(<Main topQualifiers={options.rootQualifiers}/>, el);
 });
diff --git a/server/sonar-web/src/main/js/apps/permission-templates/permission-template.js b/server/sonar-web/src/main/js/apps/permission-templates/permission-template.js
index a4814d570c0..b821c7cc9a6 100644
--- a/server/sonar-web/src/main/js/apps/permission-templates/permission-template.js
+++ b/server/sonar-web/src/main/js/apps/permission-templates/permission-template.js
@@ -69,6 +69,7 @@ export default React.createClass({
       return (
           <td key={p.key}>
             <table>
+              <tbody>
               <tr>
                 <td className="spacer-right">Users</td>
                 <td className="spacer-left bordered-left">{p.usersCount}</td>
@@ -85,6 +86,7 @@ export default React.createClass({
                      data-toggle="tooltip" href="#"></a>
                 </td>
               </tr>
+              </tbody>
             </table>
           </td>
       );
diff --git a/server/sonar-web/src/main/js/apps/project-permissions/app.js b/server/sonar-web/src/main/js/apps/project-permissions/app.js
index 1c6f5645fc6..299c94f9bb7 100644
--- a/server/sonar-web/src/main/js/apps/project-permissions/app.js
+++ b/server/sonar-web/src/main/js/apps/project-permissions/app.js
@@ -1,5 +1,6 @@
 import $ from 'jquery';
 import React from 'react';
+import ReactDOM from 'react-dom';
 import Main from './main';
 import '../../helpers/handlebars-helpers';
 
@@ -10,6 +11,6 @@ function requestPermissionTemplates () {
 window.sonarqube.appStarted.then(options => {
   requestPermissionTemplates().done(r => {
     var el = document.querySelector(options.el);
-    React.render(<Main permissionTemplates={r.permissionTemplates} componentId={options.componentId}/>, el);
+    ReactDOM.render(<Main permissionTemplates={r.permissionTemplates} componentId={options.componentId}/>, el);
   });
 });
diff --git a/server/sonar-web/src/main/js/apps/project-permissions/project.js b/server/sonar-web/src/main/js/apps/project-permissions/project.js
index 57b87b71cbd..ce1b9dae58c 100644
--- a/server/sonar-web/src/main/js/apps/project-permissions/project.js
+++ b/server/sonar-web/src/main/js/apps/project-permissions/project.js
@@ -46,6 +46,7 @@ export default React.createClass({
       return (
           <td key={p.key}>
             <table>
+              <tbody>
               <tr>
                 <td className="spacer-right">Users</td>
                 <td className="spacer-left bordered-left">{p.usersCount}</td>
@@ -62,6 +63,7 @@ export default React.createClass({
                      data-toggle="tooltip" href="#"></a>
                 </td>
               </tr>
+              </tbody>
             </table>
           </td>
       );
diff --git a/server/sonar-web/src/main/js/apps/project-permissions/search.js b/server/sonar-web/src/main/js/apps/project-permissions/search.js
index dfc243f8636..d50bf8255fd 100644
--- a/server/sonar-web/src/main/js/apps/project-permissions/search.js
+++ b/server/sonar-web/src/main/js/apps/project-permissions/search.js
@@ -16,7 +16,7 @@ export default React.createClass({
   },
 
   search() {
-    let q = React.findDOMNode(this.refs.input).value;
+    let q = this.refs.input.value;
     this.props.search(q);
   },
 
diff --git a/server/sonar-web/src/main/js/apps/projects/app.js b/server/sonar-web/src/main/js/apps/projects/app.js
index 917d7342adc..627a8a9b9cd 100644
--- a/server/sonar-web/src/main/js/apps/projects/app.js
+++ b/server/sonar-web/src/main/js/apps/projects/app.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import ReactDOM from 'react-dom';
 import Main from './main';
 import {getCurrentUser} from '../../api/users';
 import '../../helpers/handlebars-helpers';
@@ -8,7 +9,7 @@ window.sonarqube.appStarted.then(options => {
     let el = document.querySelector(options.el),
         hasProvisionPermission = user.permissions.global.indexOf('provisioning') !== -1,
         topLevelQualifiers = options.rootQualifiers;
-    React.render(<Main hasProvisionPermission={hasProvisionPermission}
+    ReactDOM.render(<Main hasProvisionPermission={hasProvisionPermission}
                        topLevelQualifiers={topLevelQualifiers}/>, el);
   });
 });
diff --git a/server/sonar-web/src/main/js/apps/projects/search.js b/server/sonar-web/src/main/js/apps/projects/search.js
index 5c5668af1e5..a5cebad2a63 100644
--- a/server/sonar-web/src/main/js/apps/projects/search.js
+++ b/server/sonar-web/src/main/js/apps/projects/search.js
@@ -16,7 +16,7 @@ export default React.createClass({
   },
 
   search() {
-    let q = React.findDOMNode(this.refs.input).value;
+    let q = this.refs.input.value;
     this.props.onSearch(q);
   },
 
@@ -86,6 +86,7 @@ export default React.createClass({
     return (
         <div className="panel panel-vertical bordered-bottom spacer-bottom">
           <table className="data">
+            <tbody>
             <tr>
               <td className="thin text-middle">
                 {this.renderCheckbox()}
@@ -110,6 +111,7 @@ export default React.createClass({
                 </button>
               </td>
             </tr>
+            </tbody>
           </table>
           {this.renderGhostsDescription()}
         </div>
diff --git a/server/sonar-web/src/main/js/apps/system/app.js b/server/sonar-web/src/main/js/apps/system/app.js
index b4b9a61c4a6..201edde4270 100644
--- a/server/sonar-web/src/main/js/apps/system/app.js
+++ b/server/sonar-web/src/main/js/apps/system/app.js
@@ -1,9 +1,10 @@
 import React from 'react';
+import ReactDOM from 'react-dom';
 import Main from './main';
 
 window.sonarqube.appStarted.then(options => {
   var el = document.querySelector(options.el);
-  React.render(<Main/>, el);
+  ReactDOM.render(<Main/>, el);
 });
 
 
diff --git a/server/sonar-web/src/main/js/apps/system/item-log-level.js b/server/sonar-web/src/main/js/apps/system/item-log-level.js
index 3e924a2781e..2ca73615e1b 100644
--- a/server/sonar-web/src/main/js/apps/system/item-log-level.js
+++ b/server/sonar-web/src/main/js/apps/system/item-log-level.js
@@ -9,7 +9,7 @@ export default React.createClass({
   },
 
   onChange() {
-    let newValue = React.findDOMNode(this.refs.select).value;
+    let newValue = this.refs.select.value;
     setLogLevel(newValue).then(() => {
       this.setState({ level: newValue });
     });
diff --git a/server/sonar-web/src/main/js/apps/system/item-object.js b/server/sonar-web/src/main/js/apps/system/item-object.js
index 15583def4bb..4260abc60c3 100644
--- a/server/sonar-web/src/main/js/apps/system/item-object.js
+++ b/server/sonar-web/src/main/js/apps/system/item-object.js
@@ -9,6 +9,6 @@ export default React.createClass({
         <td><ItemValue value={this.props.value[key]}/></td>
       </tr>;
     });
-    return <table className="data">{rows}</table>;
+    return <table className="data"><tbody>{rows}</tbody></table>;
   }
 });
diff --git a/server/sonar-web/src/main/js/components/charts/mixins/resize-mixin.js b/server/sonar-web/src/main/js/components/charts/mixins/resize-mixin.js
index 206cb90f355..ebd7360fe07 100644
--- a/server/sonar-web/src/main/js/components/charts/mixins/resize-mixin.js
+++ b/server/sonar-web/src/main/js/components/charts/mixins/resize-mixin.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import ReactDOM from 'react-dom';
 
 export const ResizeMixin = {
   componentDidMount () {
@@ -15,7 +16,7 @@ export const ResizeMixin = {
   },
 
   handleResize () {
-    let boundingClientRect = React.findDOMNode(this).parentNode.getBoundingClientRect();
+    let boundingClientRect = ReactDOM.findDOMNode(this).parentNode.getBoundingClientRect();
     let newWidth = this.props.width || boundingClientRect.width;
     let newHeight = this.props.height || boundingClientRect.height;
     this.setState({ width: newWidth, height: newHeight });
diff --git a/server/sonar-web/src/main/js/components/charts/mixins/tooltips-mixin.js b/server/sonar-web/src/main/js/components/charts/mixins/tooltips-mixin.js
index 1fcfc6add89..240edee02c5 100644
--- a/server/sonar-web/src/main/js/components/charts/mixins/tooltips-mixin.js
+++ b/server/sonar-web/src/main/js/components/charts/mixins/tooltips-mixin.js
@@ -1,5 +1,6 @@
 import $ from 'jquery';
 import React from 'react';
+import ReactDOM from 'react-dom';
 
 export const TooltipsMixin = {
   componentDidMount () {
@@ -12,7 +13,7 @@ export const TooltipsMixin = {
 
   initTooltips () {
     if ($.fn.tooltip) {
-      $('[data-toggle="tooltip"]', React.findDOMNode(this))
+      $('[data-toggle="tooltip"]', ReactDOM.findDOMNode(this))
           .tooltip({ container: 'body', placement: 'bottom', html: true });
     }
   }
diff --git a/server/sonar-web/src/main/js/components/select-list/controls.jsx b/server/sonar-web/src/main/js/components/select-list/controls.jsx
index e351fb01229..3165c9d5cca 100644
--- a/server/sonar-web/src/main/js/components/select-list/controls.jsx
+++ b/server/sonar-web/src/main/js/components/select-list/controls.jsx
@@ -8,7 +8,7 @@ export default React.createClass({
   },
 
   search() {
-    let query = React.findDOMNode(this.refs.search).value;
+    let query = this.refs.search.value;
     this.props.search(query);
   },
 
diff --git a/server/sonar-web/src/main/js/main/nav/app.js b/server/sonar-web/src/main/js/main/nav/app.js
index 93b54d6a3cd..14576f59cdd 100644
--- a/server/sonar-web/src/main/js/main/nav/app.js
+++ b/server/sonar-web/src/main/js/main/nav/app.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import ReactDOM from 'react-dom';
 import GlobalNav from './global/global-nav';
 import ComponentNav from './component/component-nav';
 import SettingsNav from './settings/settings-nav';
@@ -36,7 +37,7 @@ export default class App {
     return getGlobalNavigation().then(r => {
       const el = document.getElementById('global-navigation');
       if (el) {
-        React.render(<GlobalNav {...options} {...r}/>, el);
+        ReactDOM.render(<GlobalNav {...options} {...r}/>, el);
       }
       return r;
     });
@@ -46,7 +47,7 @@ export default class App {
     return getComponentNavigation(options.componentKey).then(r => {
       const el = document.getElementById('context-navigation');
       if (el) {
-        React.render(<ComponentNav component={r} conf={r.configuration || {}}/>, el);
+        ReactDOM.render(<ComponentNav component={r} conf={r.configuration || {}}/>, el);
       }
       return r;
     });
@@ -56,7 +57,7 @@ export default class App {
     return getSettingsNavigation().then(r => {
       const el = document.getElementById('context-navigation');
       if (el) {
-        React.render(<SettingsNav {...options}/>, el);
+        ReactDOM.render(<SettingsNav {...options}/>, el);
       }
       return r;
     });
diff --git a/server/sonar-web/src/main/js/main/nav/component/component-nav.js b/server/sonar-web/src/main/js/main/nav/component/component-nav.js
index f4c6ee1c976..9b1140f1834 100644
--- a/server/sonar-web/src/main/js/main/nav/component/component-nav.js
+++ b/server/sonar-web/src/main/js/main/nav/component/component-nav.js
@@ -1,6 +1,7 @@
 import $ from 'jquery';
 import _ from 'underscore';
 import React from 'react';
+import ReactDOM from 'react-dom';
 import {STATUSES} from '../../../apps/background-tasks/constants';
 import {getTasksForComponent} from '../../../api/ce';
 import ComponentNavFavorite from './component-nav-favorite';
@@ -33,7 +34,7 @@ export default React.createClass({
   },
 
   initTooltips() {
-    $('[data-toggle="tooltip"]', React.findDOMNode(this)).tooltip({
+    $('[data-toggle="tooltip"]', ReactDOM.findDOMNode(this)).tooltip({
       container: 'body',
       placement: 'bottom',
       delay: { show: 0, hide: 1000 },
diff --git a/server/sonar-web/src/main/js/main/nav/global/global-nav-search.js b/server/sonar-web/src/main/js/main/nav/global/global-nav-search.js
index f717bf37122..6e09db56906 100644
--- a/server/sonar-web/src/main/js/main/nav/global/global-nav-search.js
+++ b/server/sonar-web/src/main/js/main/nav/global/global-nav-search.js
@@ -41,7 +41,7 @@ export default React.createClass({
   },
 
   renderSearchView() {
-    let searchContainer = React.findDOMNode(this.refs.container);
+    let searchContainer = this.refs.container;
     this.searchView = new SearchView({
       model: new Backbone.Model(this.props),
       hide: this.closeSearch
@@ -65,7 +65,7 @@ export default React.createClass({
   },
 
   onClickOutside(e) {
-    if (!contains(React.findDOMNode(this.refs.dropdown), e.target)) {
+    if (!contains(this.refs.dropdown, e.target)) {
       this.closeSearch();
     }
   },
diff --git a/server/sonar-web/tests/apps/background-tasks-test.js b/server/sonar-web/tests/apps/background-tasks-test.js
index 6e79e2d7f71..15ac381e2a0 100644
--- a/server/sonar-web/tests/apps/background-tasks-test.js
+++ b/server/sonar-web/tests/apps/background-tasks-test.js
@@ -1,5 +1,8 @@
 /* eslint no-unused-expressions: 0 */
-import React from 'react/addons';
+import React from 'react';
+import ReactDOM from 'react-dom';
+import TestUtils from 'react-addons-test-utils';
+
 import Header from '../../src/main/js/apps/background-tasks/header';
 import Stats from '../../src/main/js/apps/background-tasks/stats';
 import Search from '../../src/main/js/apps/background-tasks/search';
@@ -7,7 +10,6 @@ import Tasks from '../../src/main/js/apps/background-tasks/tasks';
 import {STATUSES, CURRENTS, DEBOUNCE_DELAY} from '../../src/main/js/apps/background-tasks/constants';
 import {formatDuration} from '../../src/main/js/apps/background-tasks/helpers';
 
-let TestUtils = React.addons.TestUtils;
 let chai = require('chai');
 let expect = chai.expect;
 let sinon = require('sinon');
@@ -63,7 +65,7 @@ describe('Background Tasks', function () {
                                                            onCurrentsChange={spy}
                                                            onDateChange={spy}
                                                            onSearch={searchSpy}/>);
-      let searchInput = React.findDOMNode(TestUtils.findRenderedDOMComponentWithClass(component, 'search-box-input'));
+      let searchInput = ReactDOM.findDOMNode(TestUtils.findRenderedDOMComponentWithClass(component, 'search-box-input'));
       searchInput.value = 'some search query';
       TestUtils.Simulate.change(searchInput);
       setTimeout(() => {
@@ -80,7 +82,7 @@ describe('Background Tasks', function () {
                                                            onCurrentsChange={spy}
                                                            onDateChange={spy}
                                                            refresh={reloadSpy}/>);
-      let reloadButton = React.findDOMNode(component.refs.reloadButton);
+      let reloadButton = component.refs.reloadButton;
       expect(reloadSpy).to.not.have.been.called;
       TestUtils.Simulate.click(reloadButton);
       expect(reloadSpy).to.have.been.called;
@@ -91,32 +93,32 @@ describe('Background Tasks', function () {
     describe('Pending', () => {
       it('should show zero pending', () => {
         let result = TestUtils.renderIntoDocument(<Stats pendingCount="0"/>),
-            pendingCounter = React.findDOMNode(result.refs.pendingCount);
+            pendingCounter = result.refs.pendingCount;
         expect(pendingCounter.textContent).to.contain('0');
       });
 
       it('should show 5 pending', () => {
         let result = TestUtils.renderIntoDocument(<Stats pendingCount="5"/>),
-            pendingCounter = React.findDOMNode(result.refs.pendingCount);
+            pendingCounter = result.refs.pendingCount;
         expect(pendingCounter.textContent).to.contain('5');
       });
 
       it('should not show cancel pending button', () => {
         let result = TestUtils.renderIntoDocument(<Stats pendingCount="0"/>),
-            cancelPending = React.findDOMNode(result.refs.cancelPending);
+            cancelPending = result.refs.cancelPending;
         expect(cancelPending).to.not.be.ok;
       });
 
       it('should show cancel pending button', () => {
         let result = TestUtils.renderIntoDocument(<Stats pendingCount="5"/>),
-            cancelPending = React.findDOMNode(result.refs.cancelPending);
+            cancelPending = result.refs.cancelPending;
         expect(cancelPending).to.be.ok;
       });
 
       it('should trigger cancelling pending', () => {
         let spy = sinon.spy();
         let result = TestUtils.renderIntoDocument(<Stats pendingCount="5" cancelPending={spy}/>),
-            cancelPending = React.findDOMNode(result.refs.cancelPending);
+            cancelPending = result.refs.cancelPending;
         expect(spy).to.not.have.been.called;
         TestUtils.Simulate.click(cancelPending);
         expect(spy).to.have.been.called;
@@ -126,32 +128,32 @@ describe('Background Tasks', function () {
     describe('Failures', () => {
       it('should show zero failures', () => {
         let result = TestUtils.renderIntoDocument(<Stats failuresCount="0"/>),
-            failureCounter = React.findDOMNode(result.refs.failureCount);
+            failureCounter = result.refs.failureCount;
         expect(failureCounter.textContent).to.contain('0');
       });
 
       it('should show 5 failures', () => {
         let result = TestUtils.renderIntoDocument(<Stats failuresCount="5"/>),
-            failureCounter = React.findDOMNode(result.refs.failureCount);
+            failureCounter = result.refs.failureCount;
         expect(failureCounter.textContent).to.contain('5');
       });
 
       it('should not show link to failures', () => {
         let result = TestUtils.renderIntoDocument(<Stats failuresCount="0"/>),
-            failureCounter = React.findDOMNode(result.refs.failureCount);
+            failureCounter = result.refs.failureCount;
         expect(failureCounter.tagName.toLowerCase()).to.not.equal('a');
       });
 
       it('should show link to failures', () => {
         let result = TestUtils.renderIntoDocument(<Stats failuresCount="5"/>),
-            failureCounter = React.findDOMNode(result.refs.failureCount);
+            failureCounter = result.refs.failureCount;
         expect(failureCounter.tagName.toLowerCase()).to.equal('a');
       });
 
       it('should trigger filtering failures', () => {
         let spy = sinon.spy();
         let result = TestUtils.renderIntoDocument(<Stats failuresCount="5" showFailures={spy}/>),
-            failureCounter = React.findDOMNode(result.refs.failureCount);
+            failureCounter = result.refs.failureCount;
         expect(spy).to.not.have.been.called;
         TestUtils.Simulate.click(failureCounter);
         expect(spy).to.have.been.called;
@@ -161,19 +163,19 @@ describe('Background Tasks', function () {
     describe('In Progress Duration', () => {
       it('should show duration', () => {
         let result = TestUtils.renderIntoDocument(<Stats inProgressDuration="173"/>),
-            inProgressDuration = React.findDOMNode(result.refs.inProgressDuration);
+            inProgressDuration = result.refs.inProgressDuration;
         expect(inProgressDuration.textContent).to.include('173ms');
       });
 
       it('should format duration', () => {
         let result = TestUtils.renderIntoDocument(<Stats inProgressDuration="1073"/>),
-            inProgressDuration = React.findDOMNode(result.refs.inProgressDuration);
+            inProgressDuration = result.refs.inProgressDuration;
         expect(inProgressDuration.textContent).to.include('1s');
       });
 
       it('should not show duration', () => {
         let result = TestUtils.renderIntoDocument(<Stats/>),
-            inProgressDuration = React.findDOMNode(result.refs.inProgressDuration);
+            inProgressDuration = result.refs.inProgressDuration;
         expect(inProgressDuration).to.not.be.ok;
       });
     });
diff --git a/server/sonar-web/tests/apps/permission-templates-test.js b/server/sonar-web/tests/apps/permission-templates-test.js
index b79adde98a5..be99e6f54fd 100644
--- a/server/sonar-web/tests/apps/permission-templates-test.js
+++ b/server/sonar-web/tests/apps/permission-templates-test.js
@@ -1,9 +1,10 @@
 /* eslint no-unused-expressions: 0 */
-import React from 'react/addons';
+import React from 'react';
+import TestUtils from 'react-addons-test-utils';
+
 import Defaults from '../../src/main/js/apps/permission-templates/permission-template-defaults';
 import SetDefaults from '../../src/main/js/apps/permission-templates/permission-template-set-defaults';
 
-let TestUtils = React.addons.TestUtils;
 let expect = require('chai').expect;
 let sinon = require('sinon');
 
diff --git a/server/sonar-web/tests/apps/projects-test.js b/server/sonar-web/tests/apps/projects-test.js
index 0bb891f7496..3fb1768df84 100644
--- a/server/sonar-web/tests/apps/projects-test.js
+++ b/server/sonar-web/tests/apps/projects-test.js
@@ -1,7 +1,8 @@
-import React from 'react/addons';
+import React from 'react';
+import TestUtils from 'react-addons-test-utils';
+
 import Projects from '../../src/main/js/apps/projects/projects';
 
-let TestUtils = React.addons.TestUtils;
 let expect = require('chai').expect;
 let sinon = require('sinon');
 
diff --git a/server/sonar-web/tests/apps/system-test.js b/server/sonar-web/tests/apps/system-test.js
index 1d2aa97bf97..a7a9c529d2d 100644
--- a/server/sonar-web/tests/apps/system-test.js
+++ b/server/sonar-web/tests/apps/system-test.js
@@ -1,7 +1,9 @@
-import React from 'react/addons';
+import React from 'react';
+import ReactDOM from 'react-dom';
+import TestUtils from 'react-addons-test-utils';
+
 import ItemValue from '../../src/main/js/apps/system/item-value';
 
-let TestUtils = React.addons.TestUtils;
 let expect = require('chai').expect;
 let sinon = require('sinon');
 
@@ -10,7 +12,7 @@ describe('System', function () {
   describe('Item Value', function () {
     it('should render string', () => {
       let result = TestUtils.renderIntoDocument(<ItemValue value="/some/path/as/an/example"/>);
-      let content = React.findDOMNode(TestUtils.findRenderedDOMComponentWithTag(result, 'code'));
+      let content = ReactDOM.findDOMNode(TestUtils.findRenderedDOMComponentWithTag(result, 'code'));
       expect(content.textContent).to.equal('/some/path/as/an/example');
     });
 
@@ -68,7 +70,7 @@ describe('System', function () {
 
     it('should set initial value', () => {
       let result = TestUtils.renderIntoDocument(<ItemValue value="DEBUG" name="Logs Level"/>);
-      let select = React.findDOMNode(TestUtils.findRenderedDOMComponentWithTag(result, 'select'));
+      let select = ReactDOM.findDOMNode(TestUtils.findRenderedDOMComponentWithTag(result, 'select'));
       expect(select.value).to.equal('DEBUG');
     });
 
@@ -84,7 +86,7 @@ describe('System', function () {
 
     it('should change value', () => {
       let result = TestUtils.renderIntoDocument(<ItemValue value="INFO" name="Logs Level"/>);
-      let select = React.findDOMNode(TestUtils.findRenderedDOMComponentWithTag(result, 'select'));
+      let select = ReactDOM.findDOMNode(TestUtils.findRenderedDOMComponentWithTag(result, 'select'));
       select.value = 'TRACE';
       TestUtils.Simulate.change(select);
       expect(fetchUrl).to.equal('/api/system/change_log_level');
diff --git a/server/sonar-web/tests/components/charts/bar-chart-test.js b/server/sonar-web/tests/components/charts/bar-chart-test.js
index d2cc1f7784a..894d02a483e 100644
--- a/server/sonar-web/tests/components/charts/bar-chart-test.js
+++ b/server/sonar-web/tests/components/charts/bar-chart-test.js
@@ -1,12 +1,10 @@
-import React from 'react/addons';
+import React from 'react';
+import TestUtils from 'react-addons-test-utils';
 import { expect } from 'chai';
 
 import { BarChart } from '../../../src/main/js/components/charts/bar-chart';
 
 
-let TestUtils = React.addons.TestUtils;
-
-
 describe('Bar Chart', function () {
 
   it('should display bars', function () {
diff --git a/server/sonar-web/tests/components/charts/bubble-chart-test.js b/server/sonar-web/tests/components/charts/bubble-chart-test.js
index fd09799ac1d..f9994eacd54 100644
--- a/server/sonar-web/tests/components/charts/bubble-chart-test.js
+++ b/server/sonar-web/tests/components/charts/bubble-chart-test.js
@@ -1,12 +1,10 @@
-import React from 'react/addons';
+import React from 'react';
+import TestUtils from 'react-addons-test-utils';
 import { expect } from 'chai';
 
 import { BubbleChart } from '../../../src/main/js/components/charts/bubble-chart';
 
 
-let TestUtils = React.addons.TestUtils;
-
-
 describe('Bubble Chart', function () {
 
   it('should display bubbles', function () {
diff --git a/server/sonar-web/tests/components/charts/line-chart-test.js b/server/sonar-web/tests/components/charts/line-chart-test.js
index a8fecef1ffd..5e6ee4175b3 100644
--- a/server/sonar-web/tests/components/charts/line-chart-test.js
+++ b/server/sonar-web/tests/components/charts/line-chart-test.js
@@ -1,12 +1,10 @@
-import React from 'react/addons';
+import React from 'react';
+import TestUtils from 'react-addons-test-utils';
 import { expect } from 'chai';
 
 import { LineChart } from '../../../src/main/js/components/charts/line-chart';
 
 
-let TestUtils = React.addons.TestUtils;
-
-
 describe('Line Chart', function () {
 
   it('should display line', function () {
diff --git a/server/sonar-web/tests/components/charts/treemap-test.js b/server/sonar-web/tests/components/charts/treemap-test.js
index 31b838c3904..f5322ed26a0 100644
--- a/server/sonar-web/tests/components/charts/treemap-test.js
+++ b/server/sonar-web/tests/components/charts/treemap-test.js
@@ -1,12 +1,10 @@
-import React from 'react/addons';
+import React from 'react';
+import TestUtils from 'react-addons-test-utils';
 import { expect } from 'chai';
 
 import { Treemap } from '../../../src/main/js/components/charts/treemap';
 
 
-let TestUtils = React.addons.TestUtils;
-
-
 describe('Treemap', function () {
 
   it('should display', function () {
diff --git a/server/sonar-web/tests/components/charts/work-cloud-test.js b/server/sonar-web/tests/components/charts/work-cloud-test.js
index 9d904c4fd29..4bdafe1d472 100644
--- a/server/sonar-web/tests/components/charts/work-cloud-test.js
+++ b/server/sonar-web/tests/components/charts/work-cloud-test.js
@@ -1,12 +1,10 @@
-import React from 'react/addons';
+import React from 'react';
+import TestUtils from 'react-addons-test-utils';
 import { expect } from 'chai';
 
 import { WordCloud } from '../../../src/main/js/components/charts/word-cloud';
 
 
-let TestUtils = React.addons.TestUtils;
-
-
 describe('Word Cloud', function () {
 
   it('should display', function () {
diff --git a/server/sonar-web/tests/nav-test.js b/server/sonar-web/tests/nav-test.js
index c06cfa81723..fc9f18eaaff 100644
--- a/server/sonar-web/tests/nav-test.js
+++ b/server/sonar-web/tests/nav-test.js
@@ -1,16 +1,13 @@
-import React from 'react/addons';
+import React from 'react';
+import TestUtils from 'react-addons-test-utils';
 import ComponentNavBreadcrumbs from '../src/main/js/main/nav/component/component-nav-breadcrumbs';
 
-let TestUtils = React.addons.TestUtils;
+
 let expect = require('chai').expect;
 
+
 describe('Nav', function () {
   describe('ComponentNavBreadcrumbs', () => {
-    it('should not render unless `props.breadcrumbs`', function () {
-      var result = React.renderToStaticMarkup(React.createElement(ComponentNavBreadcrumbs, null));
-      expect(result).to.equal('<noscript></noscript>');
-    });
-
     it('should not render breadcrumbs with one element', function () {
       var breadcrumbs = [
         { key: 'my-project', name: 'My Project', qualifier: 'TRK' }