Add latest changes from gitlab-org/gitlab@master

34 files changed, 335 insertions, 213 deletions

diff --git a/app/assets/javascripts/behaviors/preview_markdown.js b/app/assets/javascripts/behaviors/preview_markdown.js
index 1909830e9ed..a07942d87cb 100644
--- a/app/assets/javascripts/behaviors/preview_markdown.js
+++ b/app/assets/javascripts/behaviors/preview_markdown.js
@@ -1,4 +1,4 @@
-/* eslint-disable func-names, no-var, prefer-arrow-callback */
+/* eslint-disable func-names, no-var */
 
 import $ from 'jquery';
 import axios from '~/lib/utils/axios_utils';
@@ -45,26 +45,22 @@ MarkdownPreview.prototype.showPreview = function($form) {
     this.hideReferencedUsers($form);
   } else {
     preview.addClass('md-preview-loading').text(__('Loading...'));
-    this.fetchMarkdownPreview(
-      mdText,
-      url,
-      function(response) {
-        var body;
-        if (response.body.length > 0) {
-          ({ body } = response);
-        } else {
-          body = this.emptyMessage;
-        }
-
-        preview.removeClass('md-preview-loading').html(body);
-        preview.renderGFM();
-        this.renderReferencedUsers(response.references.users, $form);
-
-        if (response.references.commands) {
-          this.renderReferencedCommands(response.references.commands, $form);
-        }
-      }.bind(this),
-    );
+    this.fetchMarkdownPreview(mdText, url, response => {
+      var body;
+      if (response.body.length > 0) {
+        ({ body } = response);
+      } else {
+        body = this.emptyMessage;
+      }
+
+      preview.removeClass('md-preview-loading').html(body);
+      preview.renderGFM();
+      this.renderReferencedUsers(response.references.users, $form);
+
+      if (response.references.commands) {
+        this.renderReferencedCommands(response.references.commands, $form);
+      }
+    });
   }
 };
 
@@ -132,12 +128,12 @@ const markdownToolbar = $('.md-header-toolbar');
 
 $.fn.setupMarkdownPreview = function() {
   var $form = $(this);
-  $form.find('textarea.markdown-area').on('input', function() {
+  $form.find('textarea.markdown-area').on('input', () => {
     markdownPreview.hideReferencedUsers($form);
   });
 };
 
-$(document).on('markdown-preview:show', function(e, $form) {
+$(document).on('markdown-preview:show', (e, $form) => {
   if (!$form) {
     return;
   }
@@ -162,7 +158,7 @@ $(document).on('markdown-preview:show', function(e, $form) {
   markdownPreview.showPreview($form);
 });
 
-$(document).on('markdown-preview:hide', function(e, $form) {
+$(document).on('markdown-preview:hide', (e, $form) => {
   if (!$form) {
     return;
   }
@@ -191,7 +187,7 @@ $(document).on('markdown-preview:hide', function(e, $form) {
   markdownPreview.hideReferencedCommands($form);
 });
 
-$(document).on('markdown-preview:toggle', function(e, keyboardEvent) {
+$(document).on('markdown-preview:toggle', (e, keyboardEvent) => {
   var $target;
   $target = $(keyboardEvent.target);
   if ($target.is('textarea.markdown-area')) {
diff --git a/app/assets/javascripts/blob/blob_file_dropzone.js b/app/assets/javascripts/blob/blob_file_dropzone.js
index 9f0680cc6a7..8acf0827c44 100644
--- a/app/assets/javascripts/blob/blob_file_dropzone.js
+++ b/app/assets/javascripts/blob/blob_file_dropzone.js
@@ -1,4 +1,4 @@
-/* eslint-disable func-names, prefer-arrow-callback */
+/* eslint-disable func-names */
 
 import $ from 'jquery';
 import Dropzone from 'dropzone';
@@ -43,18 +43,18 @@ export default class BlobFileDropzone {
       previewsContainer: '.dropzone-previews',
       headers: csrf.headers,
       init() {
-        this.on('addedfile', function() {
+        this.on('addedfile', () => {
           toggleLoading(submitButton, submitButtonLoadingIcon, false);
           dropzoneMessage.addClass(HIDDEN_CLASS);
           $('.dropzone-alerts')
             .html('')
             .hide();
         });
-        this.on('removedfile', function() {
+        this.on('removedfile', () => {
           toggleLoading(submitButton, submitButtonLoadingIcon, false);
           dropzoneMessage.removeClass(HIDDEN_CLASS);
         });
-        this.on('success', function(header, response) {
+        this.on('success', (header, response) => {
           $('#modal-upload-blob').modal('hide');
           visitUrl(response.filePath);
         });
@@ -62,7 +62,7 @@ export default class BlobFileDropzone {
           dropzoneMessage.addClass(HIDDEN_CLASS);
           this.removeFile(file);
         });
-        this.on('sending', function(file, xhr, formData) {
+        this.on('sending', (file, xhr, formData) => {
           formData.append('branch_name', form.find('.js-branch-name').val());
           formData.append('create_merge_request', form.find('.js-create-merge-request').val());
           formData.append('commit_message', form.find('.js-commit-message').val());
diff --git a/app/assets/javascripts/build_artifacts.js b/app/assets/javascripts/build_artifacts.js
index b2c88e8c14e..2955f0f014b 100644
--- a/app/assets/javascripts/build_artifacts.js
+++ b/app/assets/javascripts/build_artifacts.js
@@ -1,4 +1,4 @@
-/* eslint-disable func-names, prefer-arrow-callback */
+/* eslint-disable func-names */
 
 import $ from 'jquery';
 import { visitUrl } from './lib/utils/url_utility';
@@ -12,11 +12,11 @@ export default class BuildArtifacts {
   }
   // eslint-disable-next-line class-methods-use-this
   disablePropagation() {
-    $('.top-block').on('click', '.download', function(e) {
-      return e.stopPropagation();
+    $('.top-block').on('click', '.download', e => {
+      e.stopPropagation();
     });
-    return $('.tree-holder').on('click', 'tr[data-link] a', function(e) {
-      return e.stopImmediatePropagation();
+    return $('.tree-holder').on('click', 'tr[data-link] a', e => {
+      e.stopImmediatePropagation();
     });
   }
   // eslint-disable-next-line class-methods-use-this
diff --git a/app/assets/javascripts/commit/image_file.js b/app/assets/javascripts/commit/image_file.js
index 9454f760df8..0e031de0dbc 100644
--- a/app/assets/javascripts/commit/image_file.js
+++ b/app/assets/javascripts/commit/image_file.js
@@ -1,4 +1,4 @@
-/* eslint-disable func-names, no-var, prefer-arrow-callback, no-else-return, consistent-return, prefer-template, one-var, no-return-assign, no-unused-expressions, no-sequences */
+/* eslint-disable func-names, no-var, no-else-return, consistent-return, prefer-template, one-var, no-return-assign, no-unused-expressions, no-sequences */
 
 import $ from 'jquery';
 
@@ -13,14 +13,14 @@ export default class ImageFile {
       $('.two-up.view .frame.deleted img', this.file),
       (function(_this) {
         return function() {
-          return _this.requestImageInfo($('.two-up.view .frame.added img', _this.file), function() {
+          return _this.requestImageInfo($('.two-up.view .frame.added img', _this.file), () => {
             _this.initViewModes();
 
             // Load two-up view after images are loaded
             // so that we can display the correct width and height information
             const $images = $('.two-up.view img', _this.file);
 
-            $images.waitForImages(function() {
+            $images.waitForImages(() => {
               _this.initView('two-up');
             });
           });
@@ -138,7 +138,7 @@ export default class ImageFile {
                 return $(this).width(availWidth / 2);
               }
             });
-            return _this.requestImageInfo($('img', wrap), function(width, height) {
+            return _this.requestImageInfo($('img', wrap), (width, height) => {
               $('.image-info .meta-width', wrap).text(width + 'px');
               $('.image-info .meta-height', wrap).text(height + 'px');
               return $('.image-info', wrap).removeClass('hide');
@@ -175,7 +175,7 @@ export default class ImageFile {
 
             wrapPadding = parseInt($swipeWrap.css('right').replace('px', ''), 10);
 
-            _this.initDraggable($swipeBar, wrapPadding, function(e, left) {
+            _this.initDraggable($swipeBar, wrapPadding, (e, left) => {
               if (left > 0 && left < $swipeFrame.width() - wrapPadding * 2) {
                 $swipeWrap.width(maxWidth + 1 - left);
                 $swipeBar.css('left', left);
@@ -215,7 +215,7 @@ export default class ImageFile {
             $frameAdded.css('opacity', 1);
             framePadding = parseInt($frameAdded.css('right').replace('px', ''), 10);
 
-            _this.initDraggable($dragger, framePadding, function(e, left) {
+            _this.initDraggable($dragger, framePadding, (e, left) => {
               var opacity = left / dragTrackWidth;
 
               if (opacity >= 0 && opacity <= 1) {
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/components/eks_cluster_configuration_form.vue b/app/assets/javascripts/create_cluster/eks_cluster/components/eks_cluster_configuration_form.vue
index 6e74963dcb0..a700069d2c8 100644
--- a/app/assets/javascripts/create_cluster/eks_cluster/components/eks_cluster_configuration_form.vue
+++ b/app/assets/javascripts/create_cluster/eks_cluster/components/eks_cluster_configuration_form.vue
@@ -1,4 +1,7 @@
 <script>
+import { mapActions, mapState } from 'vuex';
+
+import RegionDropdown from './region_dropdown.vue';
 import RoleNameDropdown from './role_name_dropdown.vue';
 import SecurityGroupDropdown from './security_group_dropdown.vue';
 import SubnetDropdown from './subnet_dropdown.vue';
@@ -6,11 +9,21 @@ import VPCDropdown from './vpc_dropdown.vue';
 
 export default {
   components: {
+    RegionDropdown,
     RoleNameDropdown,
     SecurityGroupDropdown,
     SubnetDropdown,
     VPCDropdown,
   },
+  computed: {
+    ...mapState(['isLoadingRegions', 'loadingRegionsError', 'regions', 'selectedRegion']),
+  },
+  mounted() {
+    this.fetchRegions();
+  },
+  methods: {
+    ...mapActions(['fetchRegions', 'setRegion']),
+  },
 };
 </script>
 <template>
@@ -21,5 +34,17 @@ export default {
       </label>
       <role-name-dropdown />
     </div>
+    <div class="form-group">
+      <label class="label-bold" name="role" for="eks-role">
+        {{ s__('ClusterIntegration|Region') }}
+      </label>
+      <region-dropdown
+        :value="selectedRegion"
+        :regions="regions"
+        :error="loadingRegionsError"
+        :loading="isLoadingRegions"
+        @input="setRegion({ region: $event })"
+      />
+    </div>
   </form>
 </template>
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/components/region_dropdown.vue b/app/assets/javascripts/create_cluster/eks_cluster/components/region_dropdown.vue
new file mode 100644
index 00000000000..765955305c8
--- /dev/null
+++ b/app/assets/javascripts/create_cluster/eks_cluster/components/region_dropdown.vue
@@ -0,0 +1,63 @@
+<script>
+import { sprintf, s__ } from '~/locale';
+
+import ClusterFormDropdown from './cluster_form_dropdown.vue';
+
+export default {
+  components: {
+    ClusterFormDropdown,
+  },
+  props: {
+    regions: {
+      type: Array,
+      required: false,
+      default: () => [],
+    },
+    loading: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
+    error: {
+      type: Object,
+      required: false,
+      default: null,
+    },
+  },
+  computed: {
+    hasErrors() {
+      return Boolean(this.error);
+    },
+    helpText() {
+      return sprintf(
+        s__('ClusterIntegration|Learn more about %{startLink}Regions%{endLink}.'),
+        {
+          startLink:
+            '<a href="https://aws.amazon.com/about-aws/global-infrastructure/regional-product-services/" target="_blank" rel="noopener noreferrer">',
+          endLink: '</a>',
+        },
+        false,
+      );
+    },
+  },
+};
+</script>
+<template>
+  <div>
+    <cluster-form-dropdown
+      field-id="eks-region"
+      field-name="eks-region"
+      :items="regions"
+      :loading="loading"
+      :loading-text="s__('ClusterIntegration|Loading Regions')"
+      :placeholder="s__('ClusterIntergation|Select a region')"
+      :search-field-placeholder="s__('ClusterIntegration|Search regions')"
+      :empty-text="s__('ClusterIntegration|No region found')"
+      :has-errors="hasErrors"
+      :error-message="s__('ClusterIntegration|Could not load regions from your AWS account')"
+      v-bind="$attrs"
+      v-on="$listeners"
+    />
+    <p class="form-text text-muted" v-html="helpText"></p>
+  </div>
+</template>
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/index.js b/app/assets/javascripts/create_cluster/eks_cluster/index.js
index c62e5ec101d..9365fc41f4c 100644
--- a/app/assets/javascripts/create_cluster/eks_cluster/index.js
+++ b/app/assets/javascripts/create_cluster/eks_cluster/index.js
@@ -12,7 +12,6 @@ export default () =>
     components: {
       CreateEksCluster,
     },
-    data() {},
     render(createElement) {
       return createElement('create-eks-cluster');
     },
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/services/aws_services_facade.js b/app/assets/javascripts/create_cluster/eks_cluster/services/aws_services_facade.js
index e69de29bb2d..5a13d32e0d2 100644
--- a/app/assets/javascripts/create_cluster/eks_cluster/services/aws_services_facade.js
+++ b/app/assets/javascripts/create_cluster/eks_cluster/services/aws_services_facade.js
@@ -0,0 +1,20 @@
+import EC2 from 'aws-sdk/clients/ec2';
+
+export const fetchRegions = () =>
+  new Promise((resolve, reject) => {
+    const ec2 = new EC2();
+
+    ec2
+      .describeRegions()
+      .on('success', ({ data: { Regions: regions } }) => {
+        const transformedRegions = regions.map(({ RegionName: name }) => ({ name }));
+
+        resolve(transformedRegions);
+      })
+      .on('error', error => {
+        reject(error);
+      })
+      .send();
+  });
+
+export default () => {};
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/store/actions.js b/app/assets/javascripts/create_cluster/eks_cluster/store/actions.js
index 861bcddfcc7..cad9e5eb183 100644
--- a/app/assets/javascripts/create_cluster/eks_cluster/store/actions.js
+++ b/app/assets/javascripts/create_cluster/eks_cluster/store/actions.js
@@ -1,3 +1,27 @@
-// import awsServices from '../services/aws_services_facade';
+import * as awsServices from '../services/aws_services_facade';
+import * as types from './mutation_types';
+
+export const requestRegions = ({ commit }) => commit(types.REQUEST_REGIONS);
+
+export const receiveRegionsSuccess = ({ commit }, payload) => {
+  commit(types.RECEIVE_REGIONS_SUCCESS, payload);
+};
+
+export const receiveRegionsError = ({ commit }, payload) => {
+  commit(types.RECEIVE_REGIONS_ERROR, payload);
+};
+
+export const fetchRegions = ({ dispatch }) => {
+  dispatch('requestRegions');
+
+  return awsServices
+    .fetchRegions()
+    .then(regions => dispatch('receiveRegionsSuccess', { regions }))
+    .catch(error => dispatch('receiveRegionsError', { error }));
+};
+
+export const setRegion = ({ commit }, payload) => {
+  commit(types.SET_REGION, payload);
+};
 
 export default () => {};
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/store/index.js b/app/assets/javascripts/create_cluster/eks_cluster/store/index.js
index 99e9e35fd1a..8f5ad109c2f 100644
--- a/app/assets/javascripts/create_cluster/eks_cluster/store/index.js
+++ b/app/assets/javascripts/create_cluster/eks_cluster/store/index.js
@@ -9,7 +9,7 @@ const createStore = () =>
     actions,
     getters,
     mutations,
-    state,
+    state: state(),
   });
 
 export default createStore;
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/store/mutation_types.js b/app/assets/javascripts/create_cluster/eks_cluster/store/mutation_types.js
index e69de29bb2d..d66d0e70dc0 100644
--- a/app/assets/javascripts/create_cluster/eks_cluster/store/mutation_types.js
+++ b/app/assets/javascripts/create_cluster/eks_cluster/store/mutation_types.js
@@ -0,0 +1,4 @@
+export const REQUEST_REGIONS = 'REQUEST_REGIONS';
+export const RECEIVE_REGIONS_SUCCESS = 'REQUEST_REGIONS_SUCCESS';
+export const RECEIVE_REGIONS_ERROR = 'RECEIVE_REGIONS_ERROR';
+export const SET_REGION = 'SET_REGION';
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/store/mutations.js b/app/assets/javascripts/create_cluster/eks_cluster/store/mutations.js
index e69de29bb2d..a203dd3bf42 100644
--- a/app/assets/javascripts/create_cluster/eks_cluster/store/mutations.js
+++ b/app/assets/javascripts/create_cluster/eks_cluster/store/mutations.js
@@ -0,0 +1,19 @@
+import * as types from './mutation_types';
+
+export default {
+  [types.REQUEST_REGIONS](state) {
+    state.isLoadingRegions = true;
+    state.loadingRegionsError = null;
+  },
+  [types.RECEIVE_REGIONS_SUCCESS](state, { regions }) {
+    state.isLoadingRegions = false;
+    state.regions = regions;
+  },
+  [types.RECEIVE_REGIONS_ERROR](state, { error }) {
+    state.isLoadingRegions = false;
+    state.loadingRegionsError = error;
+  },
+  [types.SET_REGION](state, { region }) {
+    state.selectedRegion = region;
+  },
+};
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/store/state.js b/app/assets/javascripts/create_cluster/eks_cluster/store/state.js
index 9754ccfeeaf..ffeb1963060 100644
--- a/app/assets/javascripts/create_cluster/eks_cluster/store/state.js
+++ b/app/assets/javascripts/create_cluster/eks_cluster/store/state.js
@@ -2,16 +2,25 @@ export default () => ({
   isValidatingCredentials: false,
   validCredentials: false,
 
+  isLoadingRegions: false,
   isLoadingRoles: false,
   isLoadingVPCs: false,
   isLoadingSubnets: false,
   isLoadingSecurityGroups: false,
 
+  regions: [],
   roles: [],
   vpcs: [],
   subnets: [],
   securityGroups: [],
 
+  loadingRegionsError: null,
+  loadingRolesError: null,
+  loadingVPCsError: null,
+  loadingSubnetsError: null,
+  loadingSecurityGroupsError: null,
+
+  selectedRegion: '',
   selectedRole: '',
   selectedVPC: '',
   selectedSubnet: '',
diff --git a/app/assets/javascripts/create_label.js b/app/assets/javascripts/create_label.js
index eac0e37bcaa..9c0ed7f79d4 100644
--- a/app/assets/javascripts/create_label.js
+++ b/app/assets/javascripts/create_label.js
@@ -1,4 +1,4 @@
-/* eslint-disable func-names, prefer-arrow-callback */
+/* eslint-disable func-names */
 
 import $ from 'jquery';
 import Api from './api';
@@ -50,7 +50,7 @@ export default class CreateLabelDropdown {
 
     this.$dropdownBack.on('click', this.resetForm.bind(this));
 
-    this.$cancelButton.on('click', function(e) {
+    this.$cancelButton.on('click', e => {
       e.preventDefault();
       e.stopPropagation();
 
diff --git a/app/assets/javascripts/gl_dropdown.js b/app/assets/javascripts/gl_dropdown.js
index f49246cf07b..b0b061f41fd 100644
--- a/app/assets/javascripts/gl_dropdown.js
+++ b/app/assets/javascripts/gl_dropdown.js
@@ -1,4 +1,4 @@
-/* eslint-disable func-names, no-underscore-dangle, no-var, one-var, vars-on-top, no-shadow, no-cond-assign, prefer-arrow-callback, no-return-assign, no-else-return, camelcase, no-lonely-if, guard-for-in, no-restricted-syntax, consistent-return, prefer-template, no-param-reassign, no-loop-func */
+/* eslint-disable func-names, no-underscore-dangle, no-var, one-var, vars-on-top, no-shadow, no-cond-assign, no-return-assign, no-else-return, camelcase, no-lonely-if, guard-for-in, no-restricted-syntax, consistent-return, prefer-template, no-param-reassign, no-loop-func */
 
 import $ from 'jquery';
 import _ from 'underscore';
@@ -35,13 +35,13 @@ GitLabDropdownInput = (function() {
     );
 
     this.input
-      .on('keydown', function(e) {
+      .on('keydown', e => {
         var keyCode = e.which;
         if (keyCode === 13 && !options.elIsInput) {
           e.preventDefault();
         }
       })
-      .on('input', function(e) {
+      .on('input', e => {
         var val = e.currentTarget.value || _this.options.inputFieldName;
         val = val
           .split(' ')
@@ -95,42 +95,33 @@ GitLabDropdownFilter = (function() {
     // Key events
     timeout = '';
     this.input
-      .on('keydown', function(e) {
+      .on('keydown', e => {
         var keyCode = e.which;
         if (keyCode === 13 && !options.elIsInput) {
           e.preventDefault();
         }
       })
-      .on(
-        'input',
-        function() {
-          if (this.input.val() !== '' && !$inputContainer.hasClass(HAS_VALUE_CLASS)) {
-            $inputContainer.addClass(HAS_VALUE_CLASS);
-          } else if (this.input.val() === '' && $inputContainer.hasClass(HAS_VALUE_CLASS)) {
-            $inputContainer.removeClass(HAS_VALUE_CLASS);
-          }
-          // Only filter asynchronously only if option remote is set
-          if (this.options.remote) {
-            clearTimeout(timeout);
-            return (timeout = setTimeout(
-              function() {
-                $inputContainer.parent().addClass('is-loading');
-
-                return this.options.query(
-                  this.input.val(),
-                  function(data) {
-                    $inputContainer.parent().removeClass('is-loading');
-                    return this.options.callback(data);
-                  }.bind(this),
-                );
-              }.bind(this),
-              250,
-            ));
-          } else {
-            return this.filter(this.input.val());
-          }
-        }.bind(this),
-      );
+      .on('input', () => {
+        if (this.input.val() !== '' && !$inputContainer.hasClass(HAS_VALUE_CLASS)) {
+          $inputContainer.addClass(HAS_VALUE_CLASS);
+        } else if (this.input.val() === '' && $inputContainer.hasClass(HAS_VALUE_CLASS)) {
+          $inputContainer.removeClass(HAS_VALUE_CLASS);
+        }
+        // Only filter asynchronously only if option remote is set
+        if (this.options.remote) {
+          clearTimeout(timeout);
+          return (timeout = setTimeout(() => {
+            $inputContainer.parent().addClass('is-loading');
+
+            return this.options.query(this.input.val(), data => {
+              $inputContainer.parent().removeClass('is-loading');
+              return this.options.callback(data);
+            });
+          }, 250));
+        } else {
+          return this.filter(this.input.val());
+        }
+      });
   }
 
   GitLabDropdownFilter.prototype.shouldBlur = function(keyCode) {
@@ -175,9 +166,7 @@ GitLabDropdownFilter = (function() {
                 key: this.options.keys,
               });
               if (tmp.length) {
-                results[key] = tmp.map(function(item) {
-                  return item;
-                });
+                results[key] = tmp.map(item => item);
               }
             }
           }
@@ -453,32 +442,28 @@ GitLabDropdown = (function() {
       if (this.dropdown.find('.dropdown-toggle-page').length) {
         selector = '.dropdown-page-one .dropdown-content a';
       }
-      this.dropdown.on(
-        'click',
-        selector,
-        function(e) {
-          var $el, selected, selectedObj, isMarking;
-          $el = $(e.currentTarget);
-          selected = self.rowClicked($el);
-          selectedObj = selected ? selected[0] : null;
-          isMarking = selected ? selected[1] : null;
-          if (this.options.clicked) {
-            this.options.clicked.call(this, {
-              selectedObj,
-              $el,
-              e,
-              isMarking,
-            });
-          }
+      this.dropdown.on('click', selector, e => {
+        var $el, selected, selectedObj, isMarking;
+        $el = $(e.currentTarget);
+        selected = self.rowClicked($el);
+        selectedObj = selected ? selected[0] : null;
+        isMarking = selected ? selected[1] : null;
+        if (this.options.clicked) {
+          this.options.clicked.call(this, {
+            selectedObj,
+            $el,
+            e,
+            isMarking,
+          });
+        }
 
-          // Update label right after all modifications in dropdown has been done
-          if (this.options.toggleLabel) {
-            this.updateLabel(selectedObj, $el, this);
-          }
+        // Update label right after all modifications in dropdown has been done
+        if (this.options.toggleLabel) {
+          this.updateLabel(selectedObj, $el, this);
+        }
 
-          $el.trigger('blur');
-        }.bind(this),
-      );
+        $el.trigger('blur');
+      });
     }
   }
 
@@ -525,9 +510,7 @@ GitLabDropdown = (function() {
               name,
             ),
           );
-          this.renderData(groupData, name).map(function(item) {
-            return html.push(item);
-          });
+          this.renderData(groupData, name).map(item => html.push(item));
         }
       } else {
         // Render each row
@@ -708,7 +691,7 @@ GitLabDropdown = (function() {
 
     return text
       .split('')
-      .map(function(character, i) {
+      .map((character, i) => {
         if (indexOf.call(occurrences, i) !== -1) {
           return '<b>' + character + '</b>';
         } else {
diff --git a/app/assets/javascripts/issuable_bulk_update_actions.js b/app/assets/javascripts/issuable_bulk_update_actions.js
index c855f3973b0..45de287d44d 100644
--- a/app/assets/javascripts/issuable_bulk_update_actions.js
+++ b/app/assets/javascripts/issuable_bulk_update_actions.js
@@ -1,4 +1,4 @@
-/* eslint-disable consistent-return, func-names, array-callback-return, prefer-arrow-callback */
+/* eslint-disable consistent-return, func-names, array-callback-return */
 
 import $ from 'jquery';
 import _ from 'underscore';
@@ -45,7 +45,7 @@ export default {
     this.getSelectedIssues().map(function() {
       const labelsData = $(this).data('labels');
       if (labelsData) {
-        return labelsData.map(function(labelId) {
+        return labelsData.map(labelId => {
           if (labels.indexOf(labelId) === -1) {
             return labels.push(labelId);
           }
diff --git a/app/assets/javascripts/jobs/components/log/collapsible_section.vue b/app/assets/javascripts/jobs/components/log/collapsible_section.vue
index 7c0deb08488..0c7b78a3da7 100644
--- a/app/assets/javascripts/jobs/components/log/collapsible_section.vue
+++ b/app/assets/javascripts/jobs/components/log/collapsible_section.vue
@@ -40,16 +40,12 @@ export default {
       @toggleLine="handleOnClickCollapsibleLine(section)"
     />
     <template v-if="!section.isClosed">
-      <template v-for="line in section.lines">
-        <collpasible-log-section
-          v-if="line.isHeader"
-          :key="`collapsible-nested-${line.offset}`"
-          :section="line"
-          :trace-endpoint="traceEndpoint"
-          @toggleLine="handleOnClickCollapsibleLine"
-        />
-        <log-line v-else :key="line.offset" :line="line" :path="traceEndpoint" />
-      </template>
+      <log-line
+        v-for="line in section.lines"
+        :key="line.offset"
+        :line="line"
+        :path="traceEndpoint"
+      />
     </template>
   </div>
 </template>
diff --git a/app/assets/javascripts/jobs/components/log/line.vue b/app/assets/javascripts/jobs/components/log/line.vue
index 4e09c85b25a..9fae541125e 100644
--- a/app/assets/javascripts/jobs/components/log/line.vue
+++ b/app/assets/javascripts/jobs/components/log/line.vue
@@ -19,7 +19,7 @@ export default {
 </script>
 
 <template>
-  <div class="log-line">
+  <div class="js-line log-line">
     <line-number :line-number="line.lineNumber" :path="path" />
     <span v-for="(content, i) in line.content" :key="i" :class="content.style">{{
       content.text
diff --git a/app/assets/javascripts/jobs/store/utils.js b/app/assets/javascripts/jobs/store/utils.js
index 261ec90cd12..3838c759354 100644
--- a/app/assets/javascripts/jobs/store/utils.js
+++ b/app/assets/javascripts/jobs/store/utils.js
@@ -9,6 +9,21 @@ export const parseLine = (line = {}, lineNumber) => ({
 });
 
 /**
+ * When a line has `section_header` set to true, we create a new
+ * structure to allow to nest the lines that belong to the
+ * collpasible section
+ *
+ * @param Object line
+ * @param Number lineNumber
+ */
+export const parseHeaderLine = (line = {}, lineNumber) => ({
+  isClosed: true,
+  isHeader: true,
+  line: parseLine(line, lineNumber),
+  lines: [],
+});
+
+/**
  * Parses the job log content into a structure usable by the template
  *
  * For collaspible lines (section_header = true):
@@ -28,12 +43,7 @@ export const logLinesParser = (lines = [], lineNumberStart) =>
     const last = acc[acc.length - 1];
 
     if (line.section_header) {
-      acc.push({
-        isClosed: true,
-        isHeader: true,
-        line: parseLine(line, lineNumber),
-        lines: [],
-      });
+      acc.push(parseHeaderLine(line, lineNumber));
     } else if (acc.length && last.isHeader && !line.section_duration && line.content.length) {
       last.lines.push(parseLine(line, lineNumber));
     } else if (acc.length && last.isHeader && line.section_duration) {
diff --git a/app/assets/javascripts/labels_select.js b/app/assets/javascripts/labels_select.js
index b028e9564c9..ca7f6736714 100644
--- a/app/assets/javascripts/labels_select.js
+++ b/app/assets/javascripts/labels_select.js
@@ -1,4 +1,4 @@
-/* eslint-disable no-useless-return, func-names, no-var, no-underscore-dangle, prefer-arrow-callback, one-var, prefer-template, no-new, consistent-return, no-shadow, no-param-reassign, vars-on-top, no-lonely-if, no-else-return, dot-notation, no-empty */
+/* eslint-disable no-useless-return, func-names, no-var, no-underscore-dangle, one-var, prefer-template, no-new, consistent-return, no-shadow, no-param-reassign, vars-on-top, no-lonely-if, no-else-return, dot-notation, no-empty */
 /* global Issuable */
 /* global ListLabel */
 
@@ -24,7 +24,7 @@ export default class LabelsSelect {
       $els = $('.js-label-select');
     }
 
-    $els.each(function(i, dropdown) {
+    $els.each((i, dropdown) => {
       var $block,
         $dropdown,
         $form,
@@ -172,9 +172,7 @@ export default class LabelsSelect {
             $sidebarCollapsedValue.text(labelCount);
 
             if (data.labels.length) {
-              labelTitles = data.labels.map(function(label) {
-                return label.title;
-              });
+              labelTitles = data.labels.map(label => label.title);
 
               if (labelTitles.length > 5) {
                 labelTitles = labelTitles.slice(0, 5);
@@ -456,9 +454,7 @@ export default class LabelsSelect {
               );
             } else {
               var { labels } = boardsStore.detail.issue;
-              labels = labels.filter(function(selectedLabel) {
-                return selectedLabel.id !== label.id;
-              });
+              labels = labels.filter(selectedLabel => selectedLabel.id !== label.id);
               boardsStore.detail.issue.labels = labels;
             }
 
diff --git a/app/assets/javascripts/lib/utils/notify.js b/app/assets/javascripts/lib/utils/notify.js
index 3439db1e326..cd509a13193 100644
--- a/app/assets/javascripts/lib/utils/notify.js
+++ b/app/assets/javascripts/lib/utils/notify.js
@@ -1,12 +1,14 @@
-/* eslint-disable func-names, no-var, consistent-return, prefer-arrow-callback, no-return-assign */
+/* eslint-disable no-var, consistent-return, no-return-assign */
 
 function notificationGranted(message, opts, onclick) {
   var notification;
   notification = new Notification(message, opts);
-  setTimeout(function() {
-    // Hide the notification after X amount of seconds
-    return notification.close();
-  }, 8000);
+  setTimeout(
+    () =>
+      // Hide the notification after X amount of seconds
+      notification.close(),
+    8000,
+  );
 
   return (notification.onclick = onclick || notification.close);
 }
@@ -32,7 +34,7 @@ function notifyMe(message, body, icon, onclick) {
     // If it's okay let's create a notification
     return notificationGranted(message, opts, onclick);
   } else if (Notification.permission !== 'denied') {
-    return Notification.requestPermission(function(permission) {
+    return Notification.requestPermission(permission => {
       // If the user accepts, let's create a notification
       if (permission === 'granted') {
         return notificationGranted(message, opts, onclick);
diff --git a/app/assets/javascripts/lib/utils/text_markdown.js b/app/assets/javascripts/lib/utils/text_markdown.js
index 7873eaf059f..fec90956a86 100644
--- a/app/assets/javascripts/lib/utils/text_markdown.js
+++ b/app/assets/javascripts/lib/utils/text_markdown.js
@@ -1,4 +1,4 @@
-/* eslint-disable func-names, no-var, no-param-reassign, one-var, operator-assignment, no-else-return, prefer-template, prefer-arrow-callback, consistent-return */
+/* eslint-disable func-names, no-var, no-param-reassign, one-var, operator-assignment, no-else-return, prefer-template, consistent-return */
 import $ from 'jquery';
 import { insertText } from '~/lib/utils/common_utils';
 
@@ -218,7 +218,7 @@ export function insertMarkdownText({
         : blockTagText(text, textArea, blockTag, selected);
     } else {
       textToInsert = selectedSplit
-        .map(function(val) {
+        .map(val => {
           if (tag.indexOf(textPlaceholder) > -1) {
             return tag.replace(textPlaceholder, val);
           }
@@ -301,7 +301,7 @@ export function addMarkdownListeners(form) {
 export function addEditorMarkdownListeners(editor) {
   $('.js-md')
     .off('click')
-    .on('click', function(e) {
+    .on('click', e => {
       const { mdTag, mdBlock, mdPrepend, mdSelect } = $(e.currentTarget).data();
 
       insertMarkdownText({
diff --git a/app/assets/javascripts/merge_request.js b/app/assets/javascripts/merge_request.js
index 3b42a154af8..7223b5c0d43 100644
--- a/app/assets/javascripts/merge_request.js
+++ b/app/assets/javascripts/merge_request.js
@@ -1,4 +1,4 @@
-/* eslint-disable func-names, no-var, no-underscore-dangle, one-var, consistent-return, prefer-arrow-callback */
+/* eslint-disable func-names, no-var, no-underscore-dangle, one-var, consistent-return */
 
 import $ from 'jquery';
 import { __ } from '~/locale';
@@ -105,7 +105,7 @@ MergeRequest.prototype.submitNoteForm = function(form, $button) {
 };
 
 MergeRequest.prototype.initCommitMessageListeners = function() {
-  $(document).on('click', 'a.js-with-description-link', function(e) {
+  $(document).on('click', 'a.js-with-description-link', e => {
     var textarea = $('textarea.js-commit-message');
     e.preventDefault();
 
@@ -114,7 +114,7 @@ MergeRequest.prototype.initCommitMessageListeners = function() {
     $('.js-without-description-hint').show();
   });
 
-  $(document).on('click', 'a.js-without-description-link', function(e) {
+  $(document).on('click', 'a.js-without-description-link', e => {
     var textarea = $('textarea.js-commit-message');
     e.preventDefault();
 
diff --git a/app/assets/javascripts/namespace_select.js b/app/assets/javascripts/namespace_select.js
index 4660e4397a2..af55106d48c 100644
--- a/app/assets/javascripts/namespace_select.js
+++ b/app/assets/javascripts/namespace_select.js
@@ -1,4 +1,4 @@
-/* eslint-disable func-names, no-else-return, prefer-template, prefer-arrow-callback */
+/* eslint-disable no-else-return, prefer-template */
 
 import $ from 'jquery';
 import '~/gl_dropdown';
@@ -28,7 +28,7 @@ export default class NamespaceSelect {
         }
       },
       data(term, dataCallback) {
-        return Api.namespaces(term, function(namespaces) {
+        return Api.namespaces(term, namespaces => {
           if (isFilter) {
             const anyNamespace = {
               text: __('Any namespace'),
diff --git a/app/assets/javascripts/network/branch_graph.js b/app/assets/javascripts/network/branch_graph.js
index fcfc2570b3d..230d8f04b5e 100644
--- a/app/assets/javascripts/network/branch_graph.js
+++ b/app/assets/javascripts/network/branch_graph.js
@@ -1,4 +1,4 @@
-/* eslint-disable func-names, no-var, one-var, no-loop-func, consistent-return, prefer-template, prefer-arrow-callback, camelcase */
+/* eslint-disable func-names, no-var, one-var, no-loop-func, consistent-return, prefer-template, camelcase */
 
 import $ from 'jquery';
 import { __ } from '../locale';
@@ -259,9 +259,7 @@ export default (function() {
         opacity: 0,
         cursor: 'pointer',
       })
-      .click(function() {
-        return window.open(options.commit_url.replace('%s', commit.id), '_blank');
-      })
+      .click(() => window.open(options.commit_url.replace('%s', commit.id), '_blank'))
       .hover(
         function() {
           this.tooltip = r.commitTooltip(x + 5, y, commit);
diff --git a/app/assets/javascripts/new_branch_form.js b/app/assets/javascripts/new_branch_form.js
index 98522c67696..945472a9be6 100644
--- a/app/assets/javascripts/new_branch_form.js
+++ b/app/assets/javascripts/new_branch_form.js
@@ -1,4 +1,4 @@
-/* eslint-disable func-names, no-var, one-var, consistent-return, no-return-assign, prefer-arrow-callback, prefer-template, no-shadow, no-else-return, @gitlab/i18n/no-non-i18n-strings */
+/* eslint-disable func-names, no-var, one-var, consistent-return, no-return-assign, prefer-template, no-shadow, no-else-return, @gitlab/i18n/no-non-i18n-strings */
 
 import $ from 'jquery';
 import RefSelectDropdown from './ref_select_dropdown';
@@ -63,7 +63,7 @@ export default class NewBranchForm {
     };
     formatter = function(values, restriction) {
       var formatted;
-      formatted = values.map(function(value) {
+      formatted = values.map(value => {
         switch (false) {
           case !/\s/.test(value):
             return 'spaces';
diff --git a/app/assets/javascripts/notes.js b/app/assets/javascripts/notes.js
index ed52eec8b18..82a95969a01 100644
--- a/app/assets/javascripts/notes.js
+++ b/app/assets/javascripts/notes.js
@@ -1,7 +1,7 @@
 /* eslint-disable no-restricted-properties, func-names, no-var, camelcase,
 no-unused-expressions, one-var, default-case,
 prefer-template, consistent-return, no-alert, no-return-assign,
-no-param-reassign, prefer-arrow-callback, no-else-return, vars-on-top,
+no-param-reassign, no-else-return, vars-on-top,
 no-shadow, no-useless-escape, class-methods-use-this */
 
 /* global ResolveService */
@@ -1370,7 +1370,7 @@ export default class Notes {
       .find('li.system-note')
       .has('ul');
 
-    $.each(systemNotes, function(index, systemNote) {
+    $.each(systemNotes, (index, systemNote) => {
       const $systemNote = $(systemNote);
       const headerMessage = $systemNote
         .find('.note-text')
diff --git a/app/assets/javascripts/pages/projects/graphs/show/stat_graph_contributors_graph.js b/app/assets/javascripts/pages/projects/graphs/show/stat_graph_contributors_graph.js
index 506e6075d16..e37cd83280d 100644
--- a/app/assets/javascripts/pages/projects/graphs/show/stat_graph_contributors_graph.js
+++ b/app/assets/javascripts/pages/projects/graphs/show/stat_graph_contributors_graph.js
@@ -1,4 +1,4 @@
-/* eslint-disable func-names, no-restricted-syntax, no-use-before-define, no-param-reassign, new-cap, no-underscore-dangle, no-return-assign, prefer-arrow-callback, prefer-template, no-else-return, no-shadow */
+/* eslint-disable func-names, no-restricted-syntax, no-use-before-define, no-param-reassign, new-cap, no-underscore-dangle, no-return-assign, prefer-template, no-else-return, no-shadow */
 
 import $ from 'jquery';
 import _ from 'underscore';
@@ -69,24 +69,18 @@ export const ContributorsGraph = (function() {
   ContributorsGraph.set_y_domain = function(data) {
     return (ContributorsGraph.prototype.y_domain = [
       0,
-      d3.max(data, function(d) {
-        return (d.commits = d.commits || d.additions || d.deletions);
-      }),
+      d3.max(data, d => (d.commits = d.commits || d.additions || d.deletions)),
     ]);
   };
 
   ContributorsGraph.init_x_domain = function(data) {
-    return (ContributorsGraph.prototype.x_domain = d3.extent(data, function(d) {
-      return d.date;
-    }));
+    return (ContributorsGraph.prototype.x_domain = d3.extent(data, d => d.date));
   };
 
   ContributorsGraph.init_y_domain = function(data) {
     return (ContributorsGraph.prototype.y_domain = [
       0,
-      d3.max(data, function(d) {
-        return (d.commits = d.commits || d.additions || d.deletions);
-      }),
+      d3.max(data, d => (d.commits = d.commits || d.additions || d.deletions)),
     ]);
   };
 
@@ -180,9 +174,7 @@ export const ContributorsMasterGraph = (function(superClass) {
 
   ContributorsMasterGraph.prototype.parse_dates = function(data) {
     const parseDate = d3.timeParse('%Y-%m-%d');
-    return data.forEach(function(d) {
-      return (d.date = parseDate(d.date));
-    });
+    return data.forEach(d => (d.date = parseDate(d.date)));
   };
 
   ContributorsMasterGraph.prototype.create_scale = function() {
@@ -216,11 +208,9 @@ export const ContributorsMasterGraph = (function(superClass) {
   ContributorsMasterGraph.prototype.create_area = function(x, y) {
     return (this.area = d3
       .area()
-      .x(function(d) {
-        return x(d.date);
-      })
+      .x(d => x(d.date))
       .y0(this.height)
-      .y1(function(d) {
+      .y1(d => {
         d.commits = d.commits || d.additions || d.deletions;
         return y(d.commits);
       }));
@@ -330,7 +320,7 @@ export const ContributorsAuthorGraph = (function(superClass) {
   ContributorsAuthorGraph.prototype.create_area = function(x, y) {
     return (this.area = d3
       .area()
-      .x(function(d) {
+      .x(d => {
         const parseDate = d3.timeParse('%Y-%m-%d');
         return x(parseDate(d));
       })
diff --git a/app/assets/javascripts/pages/projects/graphs/show/stat_graph_contributors_util.js b/app/assets/javascripts/pages/projects/graphs/show/stat_graph_contributors_util.js
index 505ca938f40..a89a13fe37a 100644
--- a/app/assets/javascripts/pages/projects/graphs/show/stat_graph_contributors_util.js
+++ b/app/assets/javascripts/pages/projects/graphs/show/stat_graph_contributors_util.js
@@ -1,4 +1,4 @@
-/* eslint-disable func-names, no-var, one-var, camelcase, no-param-reassign, no-return-assign, prefer-arrow-callback, consistent-return, no-cond-assign, no-else-return */
+/* eslint-disable func-names, no-var, one-var, camelcase, no-param-reassign, no-return-assign, consistent-return, no-cond-assign, no-else-return */
 import _ from 'underscore';
 
 export default {
@@ -76,16 +76,12 @@ export default {
     var log, total_data;
     log = parsed_log.total;
     total_data = this.pick_field(log, field);
-    return _.sortBy(total_data, function(d) {
-      return d.date;
-    });
+    return _.sortBy(total_data, d => d.date);
   },
   pick_field(log, field) {
     var total_data;
     total_data = [];
-    _.each(log, function(d) {
-      return total_data.push(_.pick(d, [field, 'date']));
-    });
+    _.each(log, d => total_data.push(_.pick(d, [field, 'date'])));
     return total_data;
   },
   get_author_data(parsed_log, field, date_range) {
@@ -107,9 +103,7 @@ export default {
         };
       })(this),
     );
-    return _.sortBy(author_data, function(d) {
-      return d[field];
-    }).reverse();
+    return _.sortBy(author_data, d => d[field]).reverse();
   },
   parse_log_entry(log_entry, field, date_range) {
     var parsed_entry;
diff --git a/app/assets/javascripts/single_file_diff.js b/app/assets/javascripts/single_file_diff.js
index b70e384fae5..de4a7f89449 100644
--- a/app/assets/javascripts/single_file_diff.js
+++ b/app/assets/javascripts/single_file_diff.js
@@ -1,4 +1,4 @@
-/* eslint-disable func-names, prefer-arrow-callback, consistent-return, */
+/* eslint-disable consistent-return */
 
 import $ from 'jquery';
 import { __ } from './locale';
@@ -40,12 +40,9 @@ export default class SingleFileDiff {
       this.$toggleIcon.addClass('fa-caret-down');
     }
 
-    $('.js-file-title, .click-to-expand', this.file).on(
-      'click',
-      function(e) {
-        this.toggleDiff($(e.target));
-      }.bind(this),
-    );
+    $('.js-file-title, .click-to-expand', this.file).on('click', e => {
+      this.toggleDiff($(e.target));
+    });
   }
 
   toggleDiff($target, cb) {
diff --git a/app/assets/javascripts/tree.js b/app/assets/javascripts/tree.js
index 3e659c9e7ea..69b3d20914a 100644
--- a/app/assets/javascripts/tree.js
+++ b/app/assets/javascripts/tree.js
@@ -1,4 +1,4 @@
-/* eslint-disable func-names, consistent-return, no-var, one-var, no-else-return, prefer-arrow-callback, class-methods-use-this */
+/* eslint-disable func-names, consistent-return, no-var, one-var, no-else-return, class-methods-use-this */
 
 import $ from 'jquery';
 import { visitUrl } from './lib/utils/url_utility';
@@ -29,7 +29,7 @@ export default class TreeView {
     var li, liSelected;
     li = $('tr.tree-item');
     liSelected = null;
-    return $('body').keydown(function(e) {
+    return $('body').keydown(e => {
       var next, path;
       if ($('input:focus').length > 0 && (e.which === 38 || e.which === 40)) {
         return false;
diff --git a/app/assets/javascripts/users_select.js b/app/assets/javascripts/users_select.js
index e78ca56be0e..ce587615bbb 100644
--- a/app/assets/javascripts/users_select.js
+++ b/app/assets/javascripts/users_select.js
@@ -1,4 +1,4 @@
-/* eslint-disable func-names, one-var, no-var, prefer-rest-params, vars-on-top, prefer-arrow-callback, consistent-return, no-shadow, no-else-return, no-self-compare, prefer-template, no-unused-expressions, yoda, prefer-spread, camelcase, no-param-reassign */
+/* eslint-disable func-names, one-var, no-var, prefer-rest-params, vars-on-top, consistent-return, no-shadow, no-else-return, no-self-compare, prefer-template, no-unused-expressions, yoda, prefer-spread, camelcase, no-param-reassign */
 /* global Issuable */
 /* global emitSidebarEvent */
 
@@ -250,16 +250,12 @@ function UsersSelect(currentUser, els, options = {}) {
         return $dropdown.glDropdown({
           showMenuAbove,
           data(term, callback) {
-            return _this.users(
-              term,
-              options,
-              function(users) {
-                // GitLabDropdownFilter returns this.instance
-                // GitLabDropdownRemote returns this.options.instance
-                const glDropdown = this.instance || this.options.instance;
-                glDropdown.options.processData(term, users, callback);
-              }.bind(this),
-            );
+            return _this.users(term, options, users => {
+              // GitLabDropdownFilter returns this.instance
+              // GitLabDropdownRemote returns this.options.instance
+              const glDropdown = this.instance || this.options.instance;
+              glDropdown.options.processData(term, users, callback);
+            });
           },
           processData(term, data, callback) {
             let users = data;
@@ -606,7 +602,7 @@ function UsersSelect(currentUser, els, options = {}) {
               multiple: $(select).hasClass('multiselect'),
               minimumInputLength: 0,
               query(query) {
-                return _this.users(query.term, options, function(users) {
+                return _this.users(query.term, options, users => {
                   var anyUser, data, emailUser, index, len, name, nullUser, obj, ref;
                   data = {
                     results: users,
diff --git a/app/assets/javascripts/zen_mode.js b/app/assets/javascripts/zen_mode.js
index 5438572eadf..7a60ab1380f 100644
--- a/app/assets/javascripts/zen_mode.js
+++ b/app/assets/javascripts/zen_mode.js
@@ -1,4 +1,4 @@
-/* eslint-disable func-names, prefer-arrow-callback, consistent-return, camelcase, class-methods-use-this */
+/* eslint-disable func-names, consistent-return, camelcase, class-methods-use-this */
 
 // Zen Mode (full screen) textarea
 //
@@ -39,11 +39,11 @@ export default class ZenMode {
   constructor() {
     this.active_backdrop = null;
     this.active_textarea = null;
-    $(document).on('click', '.js-zen-enter', function(e) {
+    $(document).on('click', '.js-zen-enter', e => {
       e.preventDefault();
       return $(e.currentTarget).trigger('zen_mode:enter');
     });
-    $(document).on('click', '.js-zen-leave', function(e) {
+    $(document).on('click', '.js-zen-leave', e => {
       e.preventDefault();
       return $(e.currentTarget).trigger('zen_mode:leave');
     });
@@ -67,7 +67,7 @@ export default class ZenMode {
         };
       })(this),
     );
-    $(document).on('keydown', function(e) {
+    $(document).on('keydown', e => {
       // Esc
       if (e.keyCode === 27) {
         e.preventDefault();
diff --git a/app/assets/stylesheets/framework/job_log.scss b/app/assets/stylesheets/framework/job_log.scss
index 074b2405217..b93b224ae13 100644
--- a/app/assets/stylesheets/framework/job_log.scss
+++ b/app/assets/stylesheets/framework/job_log.scss
@@ -13,6 +13,7 @@
 
 .log-line {
   padding: 1px $gl-padding 1px $job-log-line-padding;
+  min-height: $gl-line-height-20;
 }
 
 .line-number {