Merge branch '42734-reenable-eslint-commits-js' into 'master'

Re-enable eslint in `commits.js` file

Closes #42734

See merge request gitlab-org/gitlab-ce!17096

app/assets/javascripts/commits.js

-/* eslint-disable func-names, wrap-iife, consistent-return,
-  no-return-assign, no-param-reassign, one-var-declaration-per-line, no-unused-vars,
-  prefer-template, object-shorthand, prefer-arrow-callback */
-
 import { pluralize } from './lib/utils/text_utility';
 import { localTimeAgo } from './lib/utils/datetime_utility';
 import Pager from './pager';
 import axios from './lib/utils/axios_utils';
 
-export default (function () {
-  const CommitsList = {};
-
-  CommitsList.timer = null;
+export default class CommitsList {
+  constructor(limit = 0) {
+    this.timer = null;
 
-  CommitsList.init = function (limit) {
     this.$contentList = $('.content_list');
 
-    $('body').on('click', '.day-commits-table li.commit', function (e) {
-      if (e.target.nodeName !== 'A') {
-        location.href = $(this).attr('url');
-        e.stopPropagation();
-        return false;
-      }
-    });
-
-    Pager.init(parseInt(limit, 10), false, false, this.processCommits);
+    Pager.init(parseInt(limit, 10), false, false, this.processCommits.bind(this));
 
     this.content = $('#commits-list');
     this.searchField = $('#commits-search');
     this.lastSearch = this.searchField.val();
-    return this.initSearch();
-  };
+    this.initSearch();
+  }
 
-  CommitsList.initSearch = function () {
+  initSearch() {
     this.timer = null;
-    return this.searchField.keyup((function (_this) {
-      return function () {
-        clearTimeout(_this.timer);
-        return _this.timer = setTimeout(_this.filterResults, 500);
-      };
-    })(this));
-  };
+    this.searchField.on('keyup', () => {
+      clearTimeout(this.timer);
+      this.timer = setTimeout(this.filterResults.bind(this), 500);
+    });
+  }
 
-  CommitsList.filterResults = function () {
+  filterResults() {
     const form = $('.commits-search-form');
-    const search = CommitsList.searchField.val();
-    if (search === CommitsList.lastSearch) return Promise.resolve();
-    const commitsUrl = form.attr('action') + '?' + form.serialize();
-    CommitsList.content.fadeTo('fast', 0.5);
+    const search = this.searchField.val();
+    if (search === this.lastSearch) return Promise.resolve();
+    const commitsUrl = `${form.attr('action')}?${form.serialize()}`;
+    this.content.fadeTo('fast', 0.5);
     const params = form.serializeArray().reduce((acc, obj) => Object.assign(acc, {
       [obj.name]: obj.value,
     }), {});
@@ -55,9 +39,9 @@ export default (function () {
       params,
     })
       .then(({ data }) => {
-        CommitsList.lastSearch = search;
-        CommitsList.content.html(data.html);
-        CommitsList.content.fadeTo('fast', 1.0);
+        this.lastSearch = search;
+        this.content.html(data.html);
+        this.content.fadeTo('fast', 1.0);
 
         // Change url so if user reload a page - search results are saved
         history.replaceState({
@@ -65,16 +49,16 @@ export default (function () {
         }, document.title, commitsUrl);
       })
       .catch(() => {
-        CommitsList.content.fadeTo('fast', 1.0);
-        CommitsList.lastSearch = null;
+        this.content.fadeTo('fast', 1.0);
+        this.lastSearch = null;
       });
-  };
+  }
 
   // Prepare loaded data.
-  CommitsList.processCommits = (data) => {
+  processCommits(data) {
     let processedData = data;
     const $processedData = $(processedData);
-    const $commitsHeadersLast = CommitsList.$contentList.find('li.js-commit-header').last();
+    const $commitsHeadersLast = this.$contentList.find('li.js-commit-header').last();
     const lastShownDay = $commitsHeadersLast.data('day');
     const $loadedCommitsHeadersFirst = $processedData.filter('li.js-commit-header').first();
     const loadedShownDayFirst = $loadedCommitsHeadersFirst.data('day');
@@ -97,7 +81,5 @@ export default (function () {
     localTimeAgo($processedData.find('.js-timeago'));
 
     return processedData;
-  };
-
-  return CommitsList;
-})();
+  }
+}

app/assets/javascripts/pages/projects/commits/show/index.js

@@ -3,7 +3,7 @@ import GpgBadges from '~/gpg_badges';
 import ShortcutsNavigation from '~/shortcuts_navigation';
 
 export default () => {
-  CommitsList.init(document.querySelector('.js-project-commits-show').dataset.commitsLimit);
+  new CommitsList(document.querySelector('.js-project-commits-show').dataset.commitsLimit); // eslint-disable-line no-new
   new ShortcutsNavigation(); // eslint-disable-line no-new
   GpgBadges.fetch();
 };

spec/javascripts/commits_spec.js

@@ -4,6 +4,8 @@ import axios from '~/lib/utils/axios_utils';
 import CommitsList from '~/commits';
 
 describe('Commits List', () => {
+  let commitsList;
+
   beforeEach(() => {
     setFixtures(`
       <form class="commits-search-form" action="/h5bp/html5-boilerplate/commits/master">
@@ -11,6 +13,7 @@ describe('Commits List', () => {
       </form>
       <ol id="commits-list"></ol>
       `);
+    commitsList = new CommitsList(25);
   });
 
   it('should be defined', () => {
@@ -19,7 +22,7 @@ describe('Commits List', () => {
 
   describe('processCommits', () => {
     it('should join commit headers', () => {
-      CommitsList.$contentList = $(`
+      commitsList.$contentList = $(`
         <div>
           <li class="commit-header" data-day="2016-09-20">
             <span class="day">20 Sep, 2016</span>
@@ -39,7 +42,7 @@ describe('Commits List', () => {
 
       // The last commit header should be removed
       // since the previous one has the same data-day value.
-      expect(CommitsList.processCommits(data).find('li.commit-header').length).toBe(0);
+      expect(commitsList.processCommits(data).find('li.commit-header').length).toBe(0);
     });
   });
 
@@ -48,8 +51,7 @@ describe('Commits List', () => {
     let mock;
 
     beforeEach(() => {
-      CommitsList.init(25);
-      CommitsList.searchField.val('');
+      commitsList.searchField.val('');
 
       spyOn(history, 'replaceState').and.stub();
       mock = new MockAdapter(axios);
@@ -66,11 +68,11 @@ describe('Commits List', () => {
     });
 
     it('should save the last search string', (done) => {
-      CommitsList.searchField.val('GitLab');
-      CommitsList.filterResults()
+      commitsList.searchField.val('GitLab');
+      commitsList.filterResults()
         .then(() => {
           expect(ajaxSpy).toHaveBeenCalled();
-          expect(CommitsList.lastSearch).toEqual('GitLab');
+          expect(commitsList.lastSearch).toEqual('GitLab');
 
           done();
         })
@@ -78,10 +80,10 @@ describe('Commits List', () => {
     });
 
     it('should not make ajax call if the input does not change', (done) => {
-      CommitsList.filterResults()
+      commitsList.filterResults()
         .then(() => {
           expect(ajaxSpy).not.toHaveBeenCalled();
-          expect(CommitsList.lastSearch).toEqual('');
+          expect(commitsList.lastSearch).toEqual('');
 
           done();
         })