Bug 1364894 - Fix ESLint issues found by Neutrino 9 (#4056)

This pre-emptively fixes the issues found by the newer ESLint and
ESLint plugins that come with Neutrino 9 - in order to reduce the
size of the Neutrino 9 PR.

neutrino-custom/lint.js

@@ -53,7 +53,53 @@ module.exports = (neutrino) => {
                     radix: 'off',
                     'react/forbid-prop-types': 'off',
                     'react/no-multi-comp': 'off',
+                    // Backport of:
+                    // https://github.com/airbnb/javascript/blob/eslint-config-airbnb-v17.1.0/packages/eslint-config-airbnb/rules/react.js#L230-L272
+                    // Remove once we're on eslint-config-airbnb v17.
+                    'react/sort-comp': ['error', {
+                      order: [
+                        'static-methods',
+                        'instance-variables',
+                        'lifecycle',
+                        '/^on.+$/',
+                        'getters',
+                        'setters',
+                        '/^(get|set)(?!(InitialState$|DefaultProps$|ChildContext$)).+$/',
+                        'instance-methods',
+                        'everything-else',
+                        'rendering',
+                      ],
+                      groups: {
+                        lifecycle: [
+                          'displayName',
+                          'propTypes',
+                          'contextTypes',
+                          'childContextTypes',
+                          'mixins',
+                          'statics',
+                          'defaultProps',
+                          'constructor',
+                          'getDefaultProps',
+                          'getInitialState',
+                          'state',
+                          'getChildContext',
+                          'componentWillMount',
+                          'componentDidMount',
+                          'componentWillReceiveProps',
+                          'shouldComponentUpdate',
+                          'componentWillUpdate',
+                          'componentDidUpdate',
+                          'componentWillUnmount',
+                        ],
+                        rendering: [
+                          '/^render.+$/',
+                          'render',
+                        ],
+                      },
+                    }],
                 },
+                // Remove once we're on newer ESLint that has the updated browser globals list.
+                globals: ['AbortController'],
             },
         }));
 };

package.json

@@ -92,7 +92,7 @@
   },
   "scripts": {
     "build": "node ./node_modules/neutrino/bin/neutrino build --presets ./neutrino-custom/production.js",
-    "lint": "node ./node_modules/eslint/bin/eslint.js --cache --ext js,jsx \".*.js\" \"*.js\" ui/ neutrino-custom/lint.js",
+    "lint": "node ./node_modules/eslint/bin/eslint.js --cache --ext js,jsx \".*.js\" \"*.js\" ui/ tests/ui/ neutrino-custom/lint.js",
     "start": "node ./node_modules/neutrino/bin/neutrino start --presets ./neutrino-custom/development.js",
     "start:local": "BACKEND_DOMAIN=http://localhost:8000 node ./node_modules/neutrino/bin/neutrino start --presets ./neutrino-custom/development.js",
     "start:stage": "BACKEND_DOMAIN=https://treeherder.allizom.org node ./node_modules/neutrino/bin/neutrino start --presets ./neutrino-custom/development.js",

tests/ui/unit/filters.tests.js

@@ -1,3 +1,7 @@
+import angular from 'angular';
+
+const { inject } = window;
+
 describe('getRevisionUrl filter', () => {
     let $filter;
     beforeEach(angular.mock.module('treeherder'));

tests/ui/unit/models/jobs.tests.js

@@ -3,6 +3,8 @@ import * as fetchMock from 'fetch-mock';
 import JobModel from '../../../../ui/models/job';
 import { getProjectUrl } from '../../../../ui/helpers/url';
 
+const { getJSONFixture } = window;
+
 describe('JobModel', () => {
   const repoName = 'mozilla-inbound';
 

tests/ui/unit/models/resultsets.tests.js

@@ -1,7 +1,10 @@
+import angular from 'angular';
 import * as fetchMock from 'fetch-mock';
 
 import { getProjectUrl } from '../../../../ui/helpers/url';
 
+const { getJSONFixture, inject } = window;
+
 describe('ThResultSetStore', () => {
 
     let model;

tests/ui/unit/react/groups.tests.jsx

@@ -1,3 +1,4 @@
+import angular from 'angular';
 import React from 'react';
 import { mount } from 'enzyme';
 
@@ -5,6 +6,8 @@ import JobGroup from '../../../../ui/job-view/pushes/JobGroup';
 import { thEvents } from '../../../../ui/helpers/constants';
 import FilterModel from '../../../../ui/models/filter';
 
+const { getJSONFixture, inject } = window;
+
 describe('JobGroup component', () => {
   let $injector;
   let $rootScope;

tests/ui/unit/react/revisions.tests.jsx

@@ -221,4 +221,3 @@ describe('initials filter', function () {
     expect(userPushInitials.html()).toEqual('<div class="icon-superscript user-push-initials" data-job-clear-on-click="true">ST</div>');
   });
 });
-

ui/entry-login.jsx

@@ -2,6 +2,7 @@ import React from 'react';
 import { render } from 'react-dom';
 import { AppContainer } from 'react-hot-loader';
 import 'font-awesome/css/font-awesome.css';
+
 import LoginCallback from './js/auth/LoginCallback';
 import './css/login.css';
 

ui/intermittent-failures/GenericTable.jsx

@@ -61,6 +61,7 @@ class GenericTable extends React.Component {
     }
     return {};
   }
+
   render() {
     const { bugs, columns, trStyling, totalPages } = this.props;
     const { columnId, descending } = this.state;

ui/intermittent-failures/redux/actions.js

@@ -66,4 +66,3 @@ export const updateTreeName = (tree, name) => ({
   type: `UPDATE_${name}_VIEW_TREE`,
   tree,
 });
-

ui/job-view/CustomJobActions.jsx

@@ -216,7 +216,7 @@ export default class CustomJobActions extends React.Component {
               <span className="fa fa-check-square-o" aria-hidden="true" />
               <span>{triggering ? 'Triggering' : 'Trigger'}</span>
             </Button> :
-            <p className="help-block" > Custom actions require login </p>
+            <p className="help-block"> Custom actions require login </p>
           }
           <Button color="secondary" onClick={toggle}>Cancel</Button>
         </ModalFooter>

ui/job-view/details/DetailsPanel.jsx

@@ -145,7 +145,7 @@ class DetailsPanel extends React.Component {
         // Cancel the in-progress fetch requests.
         this.selectJobController.abort();
       }
-      // eslint-disable-next-line no-undef
+
       this.selectJobController = new AbortController();
 
       let jobDetails = [];

ui/job-view/details/tabs/autoclassify/AutoclassifyToolbar.jsx

@@ -83,4 +83,3 @@ AutoclassifyToolbar.propTypes = {
   onEdit: PropTypes.func.isRequired,
   onPin: PropTypes.func.isRequired,
 };
-

ui/job-view/details/tabs/autoclassify/LineOptionModel.js

@@ -19,4 +19,3 @@ export default class LineOptionModel {
     });
   }
 }
-

ui/job-view/details/tabs/failureSummary/FailureSummaryTab.jsx

@@ -67,7 +67,7 @@ class FailureSummaryTab extends React.Component {
         <ul className="list-unstyled failure-summary-list" ref={this.fsMount}>
           {suggestions.map((suggestion, index) =>
             (<SuggestionsListItem
-              key={index}  // eslint-disable-line react/no-array-index-key
+              key={index} // eslint-disable-line react/no-array-index-key
               index={index}
               suggestion={suggestion}
               toggleBugFiler={() => this.fileBug(suggestion)}

ui/job-view/headerbars/WatchedRepo.jsx

@@ -66,6 +66,10 @@ export default class WatchedRepo extends React.Component {
     this.treeStatusIntervalId = setInterval(this.updateTreeStatus, 2 * 60 * 1000);
   }
 
+  componentWillUnmount() {
+    clearInterval(this.treeStatusIntervalId);
+  }
+
   componentDidCatch(error) {
     this.setState({
       hasBoundaryError: true,
@@ -73,10 +77,6 @@ export default class WatchedRepo extends React.Component {
     });
   }
 
-  componentWillUnmount() {
-    clearInterval(this.treeStatusIntervalId);
-  }
-
   updateTreeStatus() {
     const { repo, repoName, setCurrentRepoTreeStatus } = this.props;
     const watchedRepoName = repo.name;

ui/job-view/pushes/JobButton.jsx

@@ -129,7 +129,7 @@ JobButtonComponent.propTypes = {
   status: PropTypes.string.isRequired,
   platform: PropTypes.object.isRequired,
   filterPlatformCb: PropTypes.func.isRequired,
-  failureClassificationId: PropTypes.number,  // runnable jobs won't have this
+  failureClassificationId: PropTypes.number, // runnable jobs won't have this
 };
 
 JobButtonComponent.defaultProps = {

ui/job-view/pushes/Push.jsx

@@ -33,6 +33,7 @@ export default class Push extends React.Component {
       pushGroupState: 'collapsed',
     };
   }
+
   componentDidMount() {
     this.showRunnableJobs = this.showRunnableJobs.bind(this);
     this.hideRunnableJobs = this.hideRunnableJobs.bind(this);

ui/job-view/pushes/Revision.jsx

@@ -75,4 +75,3 @@ Revision.propTypes = {
   revision: PropTypes.object.isRequired,
   repo: PropTypes.object.isRequired,
 };
-

ui/js/auth/LoginCallback.jsx

@@ -1,9 +1,10 @@
 import React from 'react';
 import Icon from 'react-fontawesome';
+
 import AuthService from './AuthService';
 import { webAuth, parseHash } from './auth-utils';
 
-export default class LoginCallback extends React.PureComponent {
+class LoginCallback extends React.PureComponent {
   constructor(props) {
     super(props);
 
@@ -70,3 +71,5 @@ export default class LoginCallback extends React.PureComponent {
     );
   }
 }
+
+export default LoginCallback;

ui/test-view/index.jsx

@@ -4,6 +4,7 @@ import { Provider } from 'react-redux';
 import { AppContainer } from 'react-hot-loader';
 import 'bootstrap/dist/css/bootstrap.min.css';
 import 'font-awesome/css/font-awesome.css';
+
 import '../css/treeherder-test-view.css';
 import { store, actions } from './redux/store';
 import App from './ui/App';

ui/test-view/redux/configureStore.js

@@ -179,12 +179,13 @@ async function fetchTests(store, fetchParams) {
   // the failed tests.
   // Note: this is in contrast to the "testfailed" entry coming from pushStatus; those are jobs.
   store.dispatch(groupsStore.actions.fetchCounts(pushData.repository.name, getId(pushData.id)));
-  const failedJobs = Object
-    .values(payload.groups)
-    .reduce((gacc, tests) => gacc.concat(Object
-        .values(tests)
-        .reduce((jacc, test) => jacc.concat(test.jobs), []))
-      , []);
+  const failedJobs = Object.values(payload.groups).reduce(
+    (gacc, tests) =>
+      gacc.concat(
+        Object.values(tests).reduce((jacc, test) => jacc.concat(test.jobs), []),
+      ),
+    [],
+  );
   store.dispatch({
     type: groupsStore.types.RENDER_COUNTS,
     payload: {

ui/test-view/ui/Test.jsx

@@ -105,6 +105,7 @@ class TestComponent extends React.Component {
     super(props);
     this.onClick = this.onClick.bind(this);
   }
+
   onClick() {
     store.dispatch(actions.groups.fetchBugsSingleTest(
       this.props.test,