Remove IIFEs29219-remove-iifes-d

14 files changed, 1610 insertions, 1644 deletions

diff --git a/app/assets/javascripts/diff_notes/components/diff_note_avatars.js b/app/assets/javascripts/diff_notes/components/diff_note_avatars.js
index 0297add94d5..f3a688fbf2f 100644
--- a/app/assets/javascripts/diff_notes/components/diff_note_avatars.js
+++ b/app/assets/javascripts/diff_notes/components/diff_note_avatars.js
@@ -4,155 +4,153 @@
 import Vue from 'vue';
 import collapseIcon from '../icons/collapse_icon.svg';
 
-(() => {
-  const DiffNoteAvatars = Vue.extend({
-    props: ['discussionId'],
-    data() {
-      return {
-        isVisible: false,
-        lineType: '',
-        storeState: CommentsStore.state,
-        shownAvatars: 3,
-        collapseIcon,
-      };
-    },
-    template: `
-      <div class="diff-comment-avatar-holders"
-        v-show="notesCount !== 0">
-        <div v-if="!isVisible">
-          <img v-for="note in notesSubset"
-            class="avatar diff-comment-avatar has-tooltip js-diff-comment-avatar"
-            width="19"
-            height="19"
-            role="button"
-            data-container="body"
-            data-placement="top"
-            data-html="true"
-            :data-line-type="lineType"
-            :title="note.authorName + ': ' + note.noteTruncated"
-            :src="note.authorAvatar"
-            @click="clickedAvatar($event)" />
-          <span v-if="notesCount > shownAvatars"
-            class="diff-comments-more-count has-tooltip js-diff-comment-avatar"
-            data-container="body"
-            data-placement="top"
-            ref="extraComments"
-            role="button"
-            :data-line-type="lineType"
-            :title="extraNotesTitle"
-            @click="clickedAvatar($event)">{{ moreText }}</span>
-        </div>
-        <button class="diff-notes-collapse js-diff-comment-avatar"
-          type="button"
-          aria-label="Show comments"
+const DiffNoteAvatars = Vue.extend({
+  props: ['discussionId'],
+  data() {
+    return {
+      isVisible: false,
+      lineType: '',
+      storeState: CommentsStore.state,
+      shownAvatars: 3,
+      collapseIcon,
+    };
+  },
+  template: `
+    <div class="diff-comment-avatar-holders"
+      v-show="notesCount !== 0">
+      <div v-if="!isVisible">
+        <img v-for="note in notesSubset"
+          class="avatar diff-comment-avatar has-tooltip js-diff-comment-avatar"
+          width="19"
+          height="19"
+          role="button"
+          data-container="body"
+          data-placement="top"
+          data-html="true"
+          :data-line-type="lineType"
+          :title="note.authorName + ': ' + note.noteTruncated"
+          :src="note.authorAvatar"
+          @click="clickedAvatar($event)" />
+        <span v-if="notesCount > shownAvatars"
+          class="diff-comments-more-count has-tooltip js-diff-comment-avatar"
+          data-container="body"
+          data-placement="top"
+          ref="extraComments"
+          role="button"
           :data-line-type="lineType"
-          @click="clickedAvatar($event)"
-          v-if="isVisible"
-          v-html="collapseIcon">
-        </button>
+          :title="extraNotesTitle"
+          @click="clickedAvatar($event)">{{ moreText }}</span>
       </div>
-    `,
-    mounted() {
+      <button class="diff-notes-collapse js-diff-comment-avatar"
+        type="button"
+        aria-label="Show comments"
+        :data-line-type="lineType"
+        @click="clickedAvatar($event)"
+        v-if="isVisible"
+        v-html="collapseIcon">
+      </button>
+    </div>
+  `,
+  mounted() {
+    this.$nextTick(() => {
+      this.addNoCommentClass();
+      this.setDiscussionVisible();
+
+      this.lineType = $(this.$el).closest('.diff-line-num').hasClass('old_line') ? 'old' : 'new';
+    });
+
+    $(document).on('toggle.comments', () => {
       this.$nextTick(() => {
-        this.addNoCommentClass();
         this.setDiscussionVisible();
-
-        this.lineType = $(this.$el).closest('.diff-line-num').hasClass('old_line') ? 'old' : 'new';
       });
-
-      $(document).on('toggle.comments', () => {
+    });
+  },
+  destroyed() {
+    $(document).off('toggle.comments');
+  },
+  watch: {
+    storeState: {
+      handler() {
         this.$nextTick(() => {
-          this.setDiscussionVisible();
+          $('.has-tooltip', this.$el).tooltip('fixTitle');
+
+          // We need to add/remove a class to an element that is outside the Vue instance
+          this.addNoCommentClass();
         });
-      });
-    },
-    destroyed() {
-      $(document).off('toggle.comments');
-    },
-    watch: {
-      storeState: {
-        handler() {
-          this.$nextTick(() => {
-            $('.has-tooltip', this.$el).tooltip('fixTitle');
-
-            // We need to add/remove a class to an element that is outside the Vue instance
-            this.addNoCommentClass();
-          });
-        },
-        deep: true,
       },
+      deep: true,
     },
-    computed: {
-      notesSubset() {
-        let notes = [];
-
-        if (this.discussion) {
-          notes = Object.keys(this.discussion.notes)
-            .slice(0, this.shownAvatars)
-            .map(noteId => this.discussion.notes[noteId]);
-        }
-
-        return notes;
-      },
-      extraNotesTitle() {
-        if (this.discussion) {
-          const extra = this.discussion.notesCount() - this.shownAvatars;
+  },
+  computed: {
+    notesSubset() {
+      let notes = [];
+
+      if (this.discussion) {
+        notes = Object.keys(this.discussion.notes)
+          .slice(0, this.shownAvatars)
+          .map(noteId => this.discussion.notes[noteId]);
+      }
+
+      return notes;
+    },
+    extraNotesTitle() {
+      if (this.discussion) {
+        const extra = this.discussion.notesCount() - this.shownAvatars;
 
-          return `${extra} more comment${extra > 1 ? 's' : ''}`;
-        }
+        return `${extra} more comment${extra > 1 ? 's' : ''}`;
+      }
 
-        return '';
-      },
-      discussion() {
-        return this.storeState[this.discussionId];
-      },
-      notesCount() {
-        if (this.discussion) {
-          return this.discussion.notesCount();
-        }
+      return '';
+    },
+    discussion() {
+      return this.storeState[this.discussionId];
+    },
+    notesCount() {
+      if (this.discussion) {
+        return this.discussion.notesCount();
+      }
 
-        return 0;
-      },
-      moreText() {
-        const plusSign = this.notesCount < 100 ? '+' : '';
+      return 0;
+    },
+    moreText() {
+      const plusSign = this.notesCount < 100 ? '+' : '';
 
-        return `${plusSign}${this.notesCount - this.shownAvatars}`;
-      },
+      return `${plusSign}${this.notesCount - this.shownAvatars}`;
     },
-    methods: {
-      clickedAvatar(e) {
-        notes.addDiffNote(e);
+  },
+  methods: {
+    clickedAvatar(e) {
+      notes.addDiffNote(e);
 
-        // Toggle the active state of the toggle all button
-        this.toggleDiscussionsToggleState();
+      // Toggle the active state of the toggle all button
+      this.toggleDiscussionsToggleState();
 
-        this.$nextTick(() => {
-          this.setDiscussionVisible();
+      this.$nextTick(() => {
+        this.setDiscussionVisible();
 
-          $('.has-tooltip', this.$el).tooltip('fixTitle');
-          $('.has-tooltip', this.$el).tooltip('hide');
-        });
-      },
-      addNoCommentClass() {
-        const notesCount = this.notesCount;
+        $('.has-tooltip', this.$el).tooltip('fixTitle');
+        $('.has-tooltip', this.$el).tooltip('hide');
+      });
+    },
+    addNoCommentClass() {
+      const notesCount = this.notesCount;
 
-        $(this.$el).closest('.js-avatar-container')
-          .toggleClass('js-no-comment-btn', notesCount > 0)
-          .nextUntil('.js-avatar-container')
-          .toggleClass('js-no-comment-btn', notesCount > 0);
-      },
-      toggleDiscussionsToggleState() {
-        const $notesHolders = $(this.$el).closest('.code').find('.notes_holder');
-        const $visibleNotesHolders = $notesHolders.filter(':visible');
-        const $toggleDiffCommentsBtn = $(this.$el).closest('.diff-file').find('.js-toggle-diff-comments');
+      $(this.$el).closest('.js-avatar-container')
+        .toggleClass('js-no-comment-btn', notesCount > 0)
+        .nextUntil('.js-avatar-container')
+        .toggleClass('js-no-comment-btn', notesCount > 0);
+    },
+    toggleDiscussionsToggleState() {
+      const $notesHolders = $(this.$el).closest('.code').find('.notes_holder');
+      const $visibleNotesHolders = $notesHolders.filter(':visible');
+      const $toggleDiffCommentsBtn = $(this.$el).closest('.diff-file').find('.js-toggle-diff-comments');
 
-        $toggleDiffCommentsBtn.toggleClass('active', $notesHolders.length === $visibleNotesHolders.length);
-      },
-      setDiscussionVisible() {
-        this.isVisible = $(`.diffs .notes[data-discussion-id="${this.discussion.id}"]`).is(':visible');
-      },
+      $toggleDiffCommentsBtn.toggleClass('active', $notesHolders.length === $visibleNotesHolders.length);
+    },
+    setDiscussionVisible() {
+      this.isVisible = $(`.diffs .notes[data-discussion-id="${this.discussion.id}"]`).is(':visible');
     },
-  });
+  },
+});
 
-  Vue.component('diff-note-avatars', DiffNoteAvatars);
-})();
+Vue.component('diff-note-avatars', DiffNoteAvatars);
diff --git a/app/assets/javascripts/diff_notes/mixins/discussion.js b/app/assets/javascripts/diff_notes/mixins/discussion.js
index 3c08c222f46..36c4abf02cf 100644
--- a/app/assets/javascripts/diff_notes/mixins/discussion.js
+++ b/app/assets/javascripts/diff_notes/mixins/discussion.js
@@ -1,37 +1,35 @@
 /* eslint-disable object-shorthand, func-names, guard-for-in, no-restricted-syntax, comma-dangle, no-param-reassign, max-len */
 
-((w) => {
-  w.DiscussionMixins = {
-    computed: {
-      discussionCount: function () {
-        return Object.keys(this.discussions).length;
-      },
-      resolvedDiscussionCount: function () {
-        let resolvedCount = 0;
+window.DiscussionMixins = {
+  computed: {
+    discussionCount: function () {
+      return Object.keys(this.discussions).length;
+    },
+    resolvedDiscussionCount: function () {
+      let resolvedCount = 0;
 
-        for (const discussionId in this.discussions) {
-          const discussion = this.discussions[discussionId];
+      for (const discussionId in this.discussions) {
+        const discussion = this.discussions[discussionId];
 
-          if (discussion.isResolved()) {
-            resolvedCount += 1;
-          }
+        if (discussion.isResolved()) {
+          resolvedCount += 1;
         }
+      }
 
-        return resolvedCount;
-      },
-      unresolvedDiscussionCount: function () {
-        let unresolvedCount = 0;
+      return resolvedCount;
+    },
+    unresolvedDiscussionCount: function () {
+      let unresolvedCount = 0;
 
-        for (const discussionId in this.discussions) {
-          const discussion = this.discussions[discussionId];
+      for (const discussionId in this.discussions) {
+        const discussion = this.discussions[discussionId];
 
-          if (!discussion.isResolved()) {
-            unresolvedCount += 1;
-          }
+        if (!discussion.isResolved()) {
+          unresolvedCount += 1;
         }
-
-        return unresolvedCount;
       }
+
+      return unresolvedCount;
     }
-  };
-})(window);
+  }
+};
diff --git a/app/assets/javascripts/dispatcher.js b/app/assets/javascripts/dispatcher.js
index 80490052389..518d64c92f0 100644
--- a/app/assets/javascripts/dispatcher.js
+++ b/app/assets/javascripts/dispatcher.js
@@ -47,405 +47,398 @@ import UserCallout from './user_callout';
 
 const ShortcutsBlob = require('./shortcuts_blob');
 
-(function() {
-  var Dispatcher;
+function Dispatcher() {
+  this.initSearch();
+  this.initFieldErrors();
+  this.initPageScripts();
+}
 
-  $(function() {
-    return new Dispatcher();
-  });
-
-  Dispatcher = (function() {
-    function Dispatcher() {
-      this.initSearch();
-      this.initFieldErrors();
-      this.initPageScripts();
-    }
+Dispatcher.prototype.initPageScripts = function() {
+  var page, path, shortcut_handler, fileBlobPermalinkUrlElement, fileBlobPermalinkUrl;
+  page = $('body').attr('data-page');
+  if (!page) {
+    return false;
+  }
+  path = page.split(':');
+  shortcut_handler = null;
 
-    Dispatcher.prototype.initPageScripts = function() {
-      var page, path, shortcut_handler, fileBlobPermalinkUrlElement, fileBlobPermalinkUrl;
-      page = $('body').attr('data-page');
-      if (!page) {
-        return false;
-      }
-      path = page.split(':');
-      shortcut_handler = null;
+  function initBlob() {
+    new LineHighlighter();
 
-      function initBlob() {
-        new LineHighlighter();
+    new BlobLinePermalinkUpdater(
+      document.querySelector('#blob-content-holder'),
+      '.diff-line-num[data-line-number]',
+      document.querySelectorAll('.js-data-file-blob-permalink-url, .js-blob-blame-link'),
+    );
 
-        new BlobLinePermalinkUpdater(
-          document.querySelector('#blob-content-holder'),
-          '.diff-line-num[data-line-number]',
-          document.querySelectorAll('.js-data-file-blob-permalink-url, .js-blob-blame-link'),
-        );
+    shortcut_handler = new ShortcutsNavigation();
+    fileBlobPermalinkUrlElement = document.querySelector('.js-data-file-blob-permalink-url');
+    fileBlobPermalinkUrl = fileBlobPermalinkUrlElement && fileBlobPermalinkUrlElement.getAttribute('href');
+    new ShortcutsBlob({
+      skipResetBindings: true,
+      fileBlobPermalinkUrl,
+    });
+  }
 
-        shortcut_handler = new ShortcutsNavigation();
-        fileBlobPermalinkUrlElement = document.querySelector('.js-data-file-blob-permalink-url');
-        fileBlobPermalinkUrl = fileBlobPermalinkUrlElement && fileBlobPermalinkUrlElement.getAttribute('href');
-        new ShortcutsBlob({
-          skipResetBindings: true,
-          fileBlobPermalinkUrl,
-        });
+  switch (page) {
+    case 'sessions:new':
+      new UsernameValidator();
+      new ActiveTabMemoizer();
+      break;
+    case 'projects:boards:show':
+    case 'projects:boards:index':
+      shortcut_handler = new ShortcutsNavigation();
+      break;
+    case 'projects:builds:show':
+      new Build();
+      break;
+    case 'projects:merge_requests:index':
+    case 'projects:issues:index':
+      if (gl.FilteredSearchManager) {
+        new gl.FilteredSearchManager(page === 'projects:issues:index' ? 'issues' : 'merge_requests');
       }
+      Issuable.init();
+      new gl.IssuableBulkActions({
+        prefixId: page === 'projects:merge_requests:index' ? 'merge_request_' : 'issue_',
+      });
+      shortcut_handler = new ShortcutsNavigation();
+      break;
+    case 'projects:issues:show':
+      new Issue();
+      shortcut_handler = new ShortcutsIssuable();
+      new ZenMode();
+      break;
+    case 'projects:milestones:show':
+    case 'groups:milestones:show':
+    case 'dashboard:milestones:show':
+      new Milestone();
+      new Sidebar();
+      break;
+    case 'dashboard:todos:index':
+      new gl.Todos();
+      break;
+    case 'dashboard:projects:index':
+    case 'dashboard:projects:starred':
+    case 'explore:projects:index':
+    case 'explore:projects:trending':
+    case 'explore:projects:starred':
+    case 'admin:projects:index':
+      new ProjectsList();
+      break;
+    case 'dashboard:groups:index':
+    case 'explore:groups:index':
+      new GroupsList();
+      break;
+    case 'projects:milestones:new':
+    case 'projects:milestones:edit':
+    case 'projects:milestones:update':
+      new ZenMode();
+      new gl.DueDateSelectors();
+      new gl.GLForm($('.milestone-form'));
+      break;
+    case 'groups:milestones:new':
+      new ZenMode();
+      break;
+    case 'projects:compare:show':
+      new gl.Diff();
+      break;
+    case 'projects:branches:index':
+      gl.AjaxLoadingSpinner.init();
+      break;
+    case 'projects:issues:new':
+    case 'projects:issues:edit':
+      shortcut_handler = new ShortcutsNavigation();
+      new gl.GLForm($('.issue-form'));
+      new IssuableForm($('.issue-form'));
+      new LabelsSelect();
+      new MilestoneSelect();
+      new gl.IssuableTemplateSelectors();
+      break;
+    case 'projects:merge_requests:new':
+    case 'projects:merge_requests:new_diffs':
+    case 'projects:merge_requests:edit':
+      new gl.Diff();
+      shortcut_handler = new ShortcutsNavigation();
+      new gl.GLForm($('.merge-request-form'));
+      new IssuableForm($('.merge-request-form'));
+      new LabelsSelect();
+      new MilestoneSelect();
+      new gl.IssuableTemplateSelectors();
+      break;
+    case 'projects:tags:new':
+      new ZenMode();
+      new gl.GLForm($('.tag-form'));
+      break;
+    case 'projects:releases:edit':
+      new ZenMode();
+      new gl.GLForm($('.release-form'));
+      break;
+    case 'projects:merge_requests:show':
+      new gl.Diff();
+      shortcut_handler = new ShortcutsIssuable(true);
+      new ZenMode();
+      new MergedButtons();
+      break;
+    case 'projects:merge_requests:commits':
+      new MergedButtons();
+      break;
+    case "projects:merge_requests:diffs":
+      new gl.Diff();
+      new ZenMode();
+      new MergedButtons();
+      break;
+    case 'dashboard:activity':
+      new gl.Activities();
+      break;
+    case 'projects:commit:show':
+      new Commit();
+      new gl.Diff();
+      new ZenMode();
+      shortcut_handler = new ShortcutsNavigation();
+      new MiniPipelineGraph({
+        container: '.js-commit-pipeline-graph',
+      }).bindEvents();
+      break;
+    case 'projects:commit:pipelines':
+      new MiniPipelineGraph({
+        container: '.js-commit-pipeline-graph',
+      }).bindEvents();
+      break;
+    case 'projects:commits:show':
+    case 'projects:activity':
+      shortcut_handler = new ShortcutsNavigation();
+      break;
+    case 'projects:show':
+      shortcut_handler = new ShortcutsNavigation();
+      new NotificationsForm();
+      if ($('#tree-slider').length) {
+        new TreeView();
+      }
+      break;
+    case 'projects:pipelines:builds':
+    case 'projects:pipelines:show':
+      const { controllerAction } = document.querySelector('.js-pipeline-container').dataset;
 
-      switch (page) {
-        case 'sessions:new':
-          new UsernameValidator();
-          new ActiveTabMemoizer();
-          break;
-        case 'projects:boards:show':
-        case 'projects:boards:index':
-          shortcut_handler = new ShortcutsNavigation();
+      new gl.Pipelines({
+        initTabs: true,
+        tabsOptions: {
+          action: controllerAction,
+          defaultAction: 'pipelines',
+          parentEl: '.pipelines-tabs',
+        },
+      });
+      break;
+    case 'groups:activity':
+      new gl.Activities();
+      break;
+    case 'groups:show':
+      shortcut_handler = new ShortcutsNavigation();
+      new NotificationsForm();
+      new NotificationsDropdown();
+      new ProjectsList();
+      break;
+    case 'groups:group_members:index':
+      new gl.MemberExpirationDate();
+      new gl.Members();
+      new UsersSelect();
+      break;
+    case 'projects:members:show':
+      new gl.MemberExpirationDate('.js-access-expiration-date-groups');
+      new GroupsSelect();
+      new gl.MemberExpirationDate();
+      new gl.Members();
+      new UsersSelect();
+      break;
+    case 'groups:new':
+    case 'admin:groups:new':
+    case 'groups:create':
+    case 'admin:groups:create':
+      BindInOut.initAll();
+    case 'groups:new':
+    case 'admin:groups:new':
+    case 'groups:edit':
+    case 'admin:groups:edit':
+      new GroupAvatar();
+      break;
+    case 'projects:tree:show':
+      shortcut_handler = new ShortcutsNavigation();
+      new TreeView();
+      gl.TargetBranchDropDown.bootstrap();
+      break;
+    case 'projects:find_file:show':
+      shortcut_handler = true;
+      break;
+    case 'projects:blob:new':
+      gl.TargetBranchDropDown.bootstrap();
+      break;
+    case 'projects:blob:create':
+      gl.TargetBranchDropDown.bootstrap();
+      break;
+    case 'projects:blob:show':
+      gl.TargetBranchDropDown.bootstrap();
+      initBlob();
+      break;
+    case 'projects:blob:edit':
+      gl.TargetBranchDropDown.bootstrap();
+      break;
+    case 'projects:blame:show':
+      initBlob();
+      break;
+    case 'groups:labels:new':
+    case 'groups:labels:edit':
+    case 'projects:labels:new':
+    case 'projects:labels:edit':
+      new Labels();
+      break;
+    case 'projects:labels:index':
+      if ($('.prioritized-labels').length) {
+        new gl.LabelManager();
+      }
+      break;
+    case 'projects:network:show':
+      // Ensure we don't create a particular shortcut handler here. This is
+      // already created, where the network graph is created.
+      shortcut_handler = true;
+      break;
+    case 'projects:forks:new':
+      new ProjectFork();
+      break;
+    case 'projects:artifacts:browse':
+      new BuildArtifacts();
+      break;
+    case 'help:index':
+      gl.VersionCheckImage.bindErrorEvent($('img.js-version-status-badge'));
+      break;
+    case 'search:show':
+      new Search();
+      break;
+    case 'projects:repository:show':
+      new gl.ProtectedBranchCreate();
+      new gl.ProtectedBranchEditList();
+      break;
+    case 'projects:ci_cd:show':
+      new gl.ProjectVariables();
+      break;
+    case 'ci:lints:create':
+    case 'ci:lints:show':
+      new gl.CILintEditor();
+      break;
+    case 'users:show':
+      new UserCallout();
+      break;
+  }
+  switch (path.first()) {
+    case 'sessions':
+    case 'omniauth_callbacks':
+      if (!gon.u2f) break;
+      gl.u2fAuthenticate = new gl.U2FAuthenticate(
+        $('#js-authenticate-u2f'),
+        '#js-login-u2f-form',
+        gon.u2f,
+        document.querySelector('#js-login-2fa-device'),
+        document.querySelector('.js-2fa-form'),
+      );
+      gl.u2fAuthenticate.start();
+    case 'admin':
+      new Admin();
+      switch (path[1]) {
+        case 'groups':
+          new UsersSelect();
           break;
-        case 'projects:builds:show':
-          new Build();
+        case 'projects':
+          new NamespaceSelects();
           break;
-        case 'projects:merge_requests:index':
-        case 'projects:issues:index':
-          if (gl.FilteredSearchManager) {
-            new gl.FilteredSearchManager(page === 'projects:issues:index' ? 'issues' : 'merge_requests');
+        case 'labels':
+          switch (path[2]) {
+            case 'new':
+            case 'edit':
+              new Labels();
           }
-          Issuable.init();
-          new gl.IssuableBulkActions({
-            prefixId: page === 'projects:merge_requests:index' ? 'merge_request_' : 'issue_',
-          });
-          shortcut_handler = new ShortcutsNavigation();
-          break;
-        case 'projects:issues:show':
-          new Issue();
-          shortcut_handler = new ShortcutsIssuable();
-          new ZenMode();
-          break;
-        case 'projects:milestones:show':
-        case 'groups:milestones:show':
-        case 'dashboard:milestones:show':
-          new Milestone();
-          new Sidebar();
-          break;
-        case 'dashboard:todos:index':
-          new gl.Todos();
-          break;
-        case 'dashboard:projects:index':
-        case 'dashboard:projects:starred':
-        case 'explore:projects:index':
-        case 'explore:projects:trending':
-        case 'explore:projects:starred':
-        case 'admin:projects:index':
-          new ProjectsList();
-          break;
-        case 'dashboard:groups:index':
-        case 'explore:groups:index':
-          new GroupsList();
-          break;
-        case 'projects:milestones:new':
-        case 'projects:milestones:edit':
-        case 'projects:milestones:update':
-          new ZenMode();
-          new gl.DueDateSelectors();
-          new gl.GLForm($('.milestone-form'));
+        case 'abuse_reports':
+          new gl.AbuseReports();
           break;
-        case 'groups:milestones:new':
-          new ZenMode();
-          break;
-        case 'projects:compare:show':
-          new gl.Diff();
-          break;
-        case 'projects:branches:index':
-          gl.AjaxLoadingSpinner.init();
-          break;
-        case 'projects:issues:new':
-        case 'projects:issues:edit':
-          shortcut_handler = new ShortcutsNavigation();
-          new gl.GLForm($('.issue-form'));
-          new IssuableForm($('.issue-form'));
-          new LabelsSelect();
-          new MilestoneSelect();
-          new gl.IssuableTemplateSelectors();
-          break;
-        case 'projects:merge_requests:new':
-        case 'projects:merge_requests:new_diffs':
-        case 'projects:merge_requests:edit':
-          new gl.Diff();
+      }
+      break;
+    case 'dashboard':
+    case 'root':
+      shortcut_handler = new ShortcutsDashboardNavigation();
+      new UserCallout();
+      break;
+    case 'groups':
+      new GroupName();
+      break;
+    case 'profiles':
+      new NotificationsForm();
+      new NotificationsDropdown();
+      break;
+    case 'projects':
+      new Project();
+      new ProjectAvatar();
+      new GroupName();
+      switch (path[1]) {
+        case 'compare':
+          new CompareAutocomplete();
+          break;
+        case 'edit':
           shortcut_handler = new ShortcutsNavigation();
-          new gl.GLForm($('.merge-request-form'));
-          new IssuableForm($('.merge-request-form'));
-          new LabelsSelect();
-          new MilestoneSelect();
-          new gl.IssuableTemplateSelectors();
-          break;
-        case 'projects:tags:new':
-          new ZenMode();
-          new gl.GLForm($('.tag-form'));
+          new ProjectNew();
           break;
-        case 'projects:releases:edit':
-          new ZenMode();
-          new gl.GLForm($('.release-form'));
-          break;
-        case 'projects:merge_requests:show':
-          new gl.Diff();
-          shortcut_handler = new ShortcutsIssuable(true);
-          new ZenMode();
-          new MergedButtons();
+        case 'new':
+          new ProjectNew();
           break;
-        case 'projects:merge_requests:commits':
-          new MergedButtons();
-          break;
-        case "projects:merge_requests:diffs":
-          new gl.Diff();
-          new ZenMode();
-          new MergedButtons();
-          break;
-        case 'dashboard:activity':
-          new gl.Activities();
-          break;
-        case 'projects:commit:show':
-          new Commit();
-          new gl.Diff();
-          new ZenMode();
-          shortcut_handler = new ShortcutsNavigation();
-          new MiniPipelineGraph({
-            container: '.js-commit-pipeline-graph',
-          }).bindEvents();
-          break;
-        case 'projects:commit:pipelines':
-          new MiniPipelineGraph({
-            container: '.js-commit-pipeline-graph',
-          }).bindEvents();
+        case 'show':
+          new Star();
+          new ProjectNew();
+          new ProjectShow();
+          new NotificationsDropdown();
           break;
-        case 'projects:commits:show':
-        case 'projects:activity':
+        case 'wikis':
+          new gl.Wikis();
           shortcut_handler = new ShortcutsNavigation();
+          new ZenMode();
+          new gl.GLForm($('.wiki-form'));
           break;
-        case 'projects:show':
+        case 'snippets':
           shortcut_handler = new ShortcutsNavigation();
-          new NotificationsForm();
-          if ($('#tree-slider').length) {
-            new TreeView();
+          if (path[2] === 'show') {
+            new ZenMode();
           }
           break;
-        case 'projects:pipelines:builds':
-        case 'projects:pipelines:show':
-          const { controllerAction } = document.querySelector('.js-pipeline-container').dataset;
-
-          new gl.Pipelines({
-            initTabs: true,
-            tabsOptions: {
-              action: controllerAction,
-              defaultAction: 'pipelines',
-              parentEl: '.pipelines-tabs',
-            },
-          });
-          break;
-        case 'groups:activity':
-          new gl.Activities();
-          break;
-        case 'groups:show':
-          shortcut_handler = new ShortcutsNavigation();
-          new NotificationsForm();
-          new NotificationsDropdown();
-          new ProjectsList();
-          break;
-        case 'groups:group_members:index':
-          new gl.MemberExpirationDate();
-          new gl.Members();
-          new UsersSelect();
-          break;
-        case 'projects:members:show':
-          new gl.MemberExpirationDate('.js-access-expiration-date-groups');
-          new GroupsSelect();
-          new gl.MemberExpirationDate();
-          new gl.Members();
-          new UsersSelect();
-          break;
-        case 'groups:new':
-        case 'admin:groups:new':
-        case 'groups:create':
-        case 'admin:groups:create':
-          BindInOut.initAll();
-        case 'groups:new':
-        case 'admin:groups:new':
-        case 'groups:edit':
-        case 'admin:groups:edit':
-          new GroupAvatar();
-          break;
-        case 'projects:tree:show':
+        case 'labels':
+        case 'graphs':
+        case 'compare':
+        case 'pipelines':
+        case 'forks':
+        case 'milestones':
+        case 'project_members':
+        case 'deploy_keys':
+        case 'builds':
+        case 'hooks':
+        case 'services':
+        case 'protected_branches':
           shortcut_handler = new ShortcutsNavigation();
-          new TreeView();
-          gl.TargetBranchDropDown.bootstrap();
-          break;
-        case 'projects:find_file:show':
-          shortcut_handler = true;
-          break;
-        case 'projects:blob:new':
-          gl.TargetBranchDropDown.bootstrap();
-          break;
-        case 'projects:blob:create':
-          gl.TargetBranchDropDown.bootstrap();
-          break;
-        case 'projects:blob:show':
-          gl.TargetBranchDropDown.bootstrap();
-          initBlob();
-          break;
-        case 'projects:blob:edit':
-          gl.TargetBranchDropDown.bootstrap();
-          break;
-        case 'projects:blame:show':
-          initBlob();
-          break;
-        case 'groups:labels:new':
-        case 'groups:labels:edit':
-        case 'projects:labels:new':
-        case 'projects:labels:edit':
-          new Labels();
-          break;
-        case 'projects:labels:index':
-          if ($('.prioritized-labels').length) {
-            new gl.LabelManager();
-          }
-          break;
-        case 'projects:network:show':
-          // Ensure we don't create a particular shortcut handler here. This is
-          // already created, where the network graph is created.
-          shortcut_handler = true;
-          break;
-        case 'projects:forks:new':
-          new ProjectFork();
-          break;
-        case 'projects:artifacts:browse':
-          new BuildArtifacts();
-          break;
-        case 'help:index':
-          gl.VersionCheckImage.bindErrorEvent($('img.js-version-status-badge'));
-          break;
-        case 'search:show':
-          new Search();
-          break;
-        case 'projects:repository:show':
-          new gl.ProtectedBranchCreate();
-          new gl.ProtectedBranchEditList();
-          break;
-        case 'projects:ci_cd:show':
-          new gl.ProjectVariables();
-          break;
-        case 'ci:lints:create':
-        case 'ci:lints:show':
-          new gl.CILintEditor();
-          break;
-        case 'users:show':
-          new UserCallout();
-          break;
-      }
-      switch (path.first()) {
-        case 'sessions':
-        case 'omniauth_callbacks':
-          if (!gon.u2f) break;
-          gl.u2fAuthenticate = new gl.U2FAuthenticate(
-            $('#js-authenticate-u2f'),
-            '#js-login-u2f-form',
-            gon.u2f,
-            document.querySelector('#js-login-2fa-device'),
-            document.querySelector('.js-2fa-form'),
-          );
-          gl.u2fAuthenticate.start();
-        case 'admin':
-          new Admin();
-          switch (path[1]) {
-            case 'groups':
-              new UsersSelect();
-              break;
-            case 'projects':
-              new NamespaceSelects();
-              break;
-            case 'labels':
-              switch (path[2]) {
-                case 'new':
-                case 'edit':
-                  new Labels();
-              }
-            case 'abuse_reports':
-              new gl.AbuseReports();
-              break;
-          }
-          break;
-        case 'dashboard':
-        case 'root':
-          shortcut_handler = new ShortcutsDashboardNavigation();
-          new UserCallout();
-          break;
-        case 'groups':
-          new GroupName();
-          break;
-        case 'profiles':
-          new NotificationsForm();
-          new NotificationsDropdown();
-          break;
-        case 'projects':
-          new Project();
-          new ProjectAvatar();
-          new GroupName();
-          switch (path[1]) {
-            case 'compare':
-              new CompareAutocomplete();
-              break;
-            case 'edit':
-              shortcut_handler = new ShortcutsNavigation();
-              new ProjectNew();
-              break;
-            case 'new':
-              new ProjectNew();
-              break;
-            case 'show':
-              new Star();
-              new ProjectNew();
-              new ProjectShow();
-              new NotificationsDropdown();
-              break;
-            case 'wikis':
-              new gl.Wikis();
-              shortcut_handler = new ShortcutsNavigation();
-              new ZenMode();
-              new gl.GLForm($('.wiki-form'));
-              break;
-            case 'snippets':
-              shortcut_handler = new ShortcutsNavigation();
-              if (path[2] === 'show') {
-                new ZenMode();
-              }
-              break;
-            case 'labels':
-            case 'graphs':
-            case 'compare':
-            case 'pipelines':
-            case 'forks':
-            case 'milestones':
-            case 'project_members':
-            case 'deploy_keys':
-            case 'builds':
-            case 'hooks':
-            case 'services':
-            case 'protected_branches':
-              shortcut_handler = new ShortcutsNavigation();
-          }
       }
-      // If we haven't installed a custom shortcut handler, install the default one
-      if (!shortcut_handler) {
-        new Shortcuts();
-      }
-    };
+  }
+  // If we haven't installed a custom shortcut handler, install the default one
+  if (!shortcut_handler) {
+    new Shortcuts();
+  }
+};
 
-    Dispatcher.prototype.initSearch = function() {
-      // Only when search form is present
-      if ($('.search').length) {
-        return new gl.SearchAutocomplete();
-      }
-    };
+Dispatcher.prototype.initSearch = function() {
+  // Only when search form is present
+  if ($('.search').length) {
+    return new gl.SearchAutocomplete();
+  }
+};
 
-    Dispatcher.prototype.initFieldErrors = function() {
-      $('.gl-show-field-errors').each((i, form) => {
-        new gl.GlFieldErrors(form);
-      });
-    };
+Dispatcher.prototype.initFieldErrors = function() {
+  $('.gl-show-field-errors').each((i, form) => {
+    new gl.GlFieldErrors(form);
+  });
+};
+
+$(function() {
+  return new Dispatcher();
+});
 
-    return Dispatcher;
-  })();
-}).call(window);
diff --git a/app/assets/javascripts/dropzone_input.js b/app/assets/javascripts/dropzone_input.js
index f2963a5eb19..0d58235a648 100644
--- a/app/assets/javascripts/dropzone_input.js
+++ b/app/assets/javascripts/dropzone_input.js
@@ -3,216 +3,212 @@
 
 require('./preview_markdown');
 
-window.DropzoneInput = (function() {
-  function DropzoneInput(form) {
-    var $mdArea, alertAttr, alertClass, appendToTextArea, btnAlert, child, closeAlertMessage, closeSpinner, divAlert, divHover, divSpinner, dropzone, form_dropzone, form_textarea, getFilename, handlePaste, iconPaperclip, iconSpinner, insertToTextArea, isImage, max_file_size, pasteText, project_uploads_path, showError, showSpinner, uploadFile, uploadProgress;
-    Dropzone.autoDiscover = false;
-    alertClass = "alert alert-danger alert-dismissable div-dropzone-alert";
-    alertAttr = "class=\"close\" data-dismiss=\"alert\"" + "aria-hidden=\"true\"";
-    divHover = "<div class=\"div-dropzone-hover\"></div>";
-    divSpinner = "<div class=\"div-dropzone-spinner\"></div>";
-    divAlert = "<div class=\"" + alertClass + "\"></div>";
-    iconPaperclip = "<i class=\"fa fa-paperclip div-dropzone-icon\"></i>";
-    iconSpinner = "<i class=\"fa fa-spinner fa-spin div-dropzone-icon\"></i>";
-    uploadProgress = $("<div class=\"div-dropzone-progress\"></div>");
-    btnAlert = "<button type=\"button\"" + alertAttr + ">&times;</button>";
-    project_uploads_path = window.project_uploads_path || null;
-    max_file_size = gon.max_file_size || 10;
-    form_textarea = $(form).find(".js-gfm-input");
-    form_textarea.wrap("<div class=\"div-dropzone\"></div>");
-    form_textarea.on('paste', (function(_this) {
-      return function(event) {
-        return handlePaste(event);
-      };
-    })(this));
-    $mdArea = $(form_textarea).closest('.md-area');
-    $(form).setupMarkdownPreview();
-    form_dropzone = $(form).find('.div-dropzone');
-    form_dropzone.parent().addClass("div-dropzone-wrapper");
-    form_dropzone.append(divHover);
-    form_dropzone.find(".div-dropzone-hover").append(iconPaperclip);
-    form_dropzone.append(divSpinner);
-    form_dropzone.find(".div-dropzone-spinner").append(iconSpinner);
-    form_dropzone.find(".div-dropzone-spinner").append(uploadProgress);
-    form_dropzone.find(".div-dropzone-spinner").css({
-      "opacity": 0,
-      "display": "none"
-    });
-    dropzone = form_dropzone.dropzone({
+function DropzoneInput(form) {
+  var $mdArea, alertAttr, alertClass, appendToTextArea, btnAlert, child, closeAlertMessage, closeSpinner, divAlert, divHover, divSpinner, dropzone, form_dropzone, form_textarea, getFilename, handlePaste, iconPaperclip, iconSpinner, insertToTextArea, isImage, max_file_size, pasteText, project_uploads_path, showError, showSpinner, uploadFile, uploadProgress;
+  Dropzone.autoDiscover = false;
+  alertClass = "alert alert-danger alert-dismissable div-dropzone-alert";
+  alertAttr = "class=\"close\" data-dismiss=\"alert\"" + "aria-hidden=\"true\"";
+  divHover = "<div class=\"div-dropzone-hover\"></div>";
+  divSpinner = "<div class=\"div-dropzone-spinner\"></div>";
+  divAlert = "<div class=\"" + alertClass + "\"></div>";
+  iconPaperclip = "<i class=\"fa fa-paperclip div-dropzone-icon\"></i>";
+  iconSpinner = "<i class=\"fa fa-spinner fa-spin div-dropzone-icon\"></i>";
+  uploadProgress = $("<div class=\"div-dropzone-progress\"></div>");
+  btnAlert = "<button type=\"button\"" + alertAttr + ">&times;</button>";
+  project_uploads_path = window.project_uploads_path || null;
+  max_file_size = gon.max_file_size || 10;
+  form_textarea = $(form).find(".js-gfm-input");
+  form_textarea.wrap("<div class=\"div-dropzone\"></div>");
+  form_textarea.on('paste', function(event) {
+    return handlePaste(event);
+  });
+  $mdArea = $(form_textarea).closest('.md-area');
+  $(form).setupMarkdownPreview();
+  form_dropzone = $(form).find('.div-dropzone');
+  form_dropzone.parent().addClass("div-dropzone-wrapper");
+  form_dropzone.append(divHover);
+  form_dropzone.find(".div-dropzone-hover").append(iconPaperclip);
+  form_dropzone.append(divSpinner);
+  form_dropzone.find(".div-dropzone-spinner").append(iconSpinner);
+  form_dropzone.find(".div-dropzone-spinner").append(uploadProgress);
+  form_dropzone.find(".div-dropzone-spinner").css({
+    "opacity": 0,
+    "display": "none"
+  });
+  dropzone = form_dropzone.dropzone({
+    url: project_uploads_path,
+    dictDefaultMessage: "",
+    clickable: true,
+    paramName: "file",
+    maxFilesize: max_file_size,
+    uploadMultiple: false,
+    headers: {
+      "X-CSRF-Token": $("meta[name=\"csrf-token\"]").attr("content")
+    },
+    previewContainer: false,
+    processing: function() {
+      return $(".div-dropzone-alert").alert("close");
+    },
+    dragover: function() {
+      $mdArea.addClass('is-dropzone-hover');
+      form.find(".div-dropzone-hover").css("opacity", 0.7);
+    },
+    dragleave: function() {
+      $mdArea.removeClass('is-dropzone-hover');
+      form.find(".div-dropzone-hover").css("opacity", 0);
+    },
+    drop: function() {
+      $mdArea.removeClass('is-dropzone-hover');
+      form.find(".div-dropzone-hover").css("opacity", 0);
+      form_textarea.focus();
+    },
+    success: function(header, response) {
+      pasteText(response.link.markdown);
+    },
+    error: function(temp) {
+      var checkIfMsgExists, errorAlert;
+      errorAlert = $(form).find('.error-alert');
+      checkIfMsgExists = errorAlert.children().length;
+      if (checkIfMsgExists === 0) {
+        errorAlert.append(divAlert);
+        $(".div-dropzone-alert").append(btnAlert + "Attaching the file failed.");
+      }
+    },
+    totaluploadprogress: function(totalUploadProgress) {
+      uploadProgress.text(Math.round(totalUploadProgress) + "%");
+    },
+    sending: function() {
+      form_dropzone.find(".div-dropzone-spinner").css({
+        "opacity": 0.7,
+        "display": "inherit"
+      });
+    },
+    queuecomplete: function() {
+      uploadProgress.text("");
+      $(".dz-preview").remove();
+      $(".markdown-area").trigger("input");
+      $(".div-dropzone-spinner").css({
+        "opacity": 0,
+        "display": "none"
+      });
+    }
+  });
+  child = $(dropzone[0]).children("textarea");
+  handlePaste = function(event) {
+    var filename, image, pasteEvent, text;
+    pasteEvent = event.originalEvent;
+    if (pasteEvent.clipboardData && pasteEvent.clipboardData.items) {
+      image = isImage(pasteEvent);
+      if (image) {
+        event.preventDefault();
+        filename = getFilename(pasteEvent) || "image.png";
+        text = "{{" + filename + "}}";
+        pasteText(text);
+        return uploadFile(image.getAsFile(), filename);
+      }
+    }
+  };
+  isImage = function(data) {
+    var i, item;
+    i = 0;
+    while (i < data.clipboardData.items.length) {
+      item = data.clipboardData.items[i];
+      if (item.type.indexOf("image") !== -1) {
+        return item;
+      }
+      i += 1;
+    }
+    return false;
+  };
+  pasteText = function(text) {
+    var afterSelection, beforeSelection, caretEnd, caretStart, textEnd;
+    var formattedText = text + "\n\n";
+    caretStart = $(child)[0].selectionStart;
+    caretEnd = $(child)[0].selectionEnd;
+    textEnd = $(child).val().length;
+    beforeSelection = $(child).val().substring(0, caretStart);
+    afterSelection = $(child).val().substring(caretEnd, textEnd);
+    $(child).val(beforeSelection + formattedText + afterSelection);
+    child.get(0).setSelectionRange(caretStart + formattedText.length, caretEnd + formattedText.length);
+    return form_textarea.trigger("input");
+  };
+  getFilename = function(e) {
+    var value;
+    if (window.clipboardData && window.clipboardData.getData) {
+      value = window.clipboardData.getData("Text");
+    } else if (e.clipboardData && e.clipboardData.getData) {
+      value = e.clipboardData.getData("text/plain");
+    }
+    value = value.split("\r");
+    return value.first();
+  };
+  uploadFile = function(item, filename) {
+    var formData;
+    formData = new FormData();
+    formData.append("file", item, filename);
+    return $.ajax({
       url: project_uploads_path,
-      dictDefaultMessage: "",
-      clickable: true,
-      paramName: "file",
-      maxFilesize: max_file_size,
-      uploadMultiple: false,
+      type: "POST",
+      data: formData,
+      dataType: "json",
+      processData: false,
+      contentType: false,
       headers: {
         "X-CSRF-Token": $("meta[name=\"csrf-token\"]").attr("content")
       },
-      previewContainer: false,
-      processing: function() {
-        return $(".div-dropzone-alert").alert("close");
-      },
-      dragover: function() {
-        $mdArea.addClass('is-dropzone-hover');
-        form.find(".div-dropzone-hover").css("opacity", 0.7);
+      beforeSend: function() {
+        showSpinner();
+        return closeAlertMessage();
       },
-      dragleave: function() {
-        $mdArea.removeClass('is-dropzone-hover');
-        form.find(".div-dropzone-hover").css("opacity", 0);
+      success: function(e, textStatus, response) {
+        return insertToTextArea(filename, response.responseJSON.link.markdown);
       },
-      drop: function() {
-        $mdArea.removeClass('is-dropzone-hover');
-        form.find(".div-dropzone-hover").css("opacity", 0);
-        form_textarea.focus();
+      error: function(response) {
+        return showError(response.responseJSON.message);
       },
-      success: function(header, response) {
-        pasteText(response.link.markdown);
-      },
-      error: function(temp) {
-        var checkIfMsgExists, errorAlert;
-        errorAlert = $(form).find('.error-alert');
-        checkIfMsgExists = errorAlert.children().length;
-        if (checkIfMsgExists === 0) {
-          errorAlert.append(divAlert);
-          $(".div-dropzone-alert").append(btnAlert + "Attaching the file failed.");
-        }
-      },
-      totaluploadprogress: function(totalUploadProgress) {
-        uploadProgress.text(Math.round(totalUploadProgress) + "%");
-      },
-      sending: function() {
-        form_dropzone.find(".div-dropzone-spinner").css({
-          "opacity": 0.7,
-          "display": "inherit"
-        });
-      },
-      queuecomplete: function() {
-        uploadProgress.text("");
-        $(".dz-preview").remove();
-        $(".markdown-area").trigger("input");
-        $(".div-dropzone-spinner").css({
-          "opacity": 0,
-          "display": "none"
-        });
+      complete: function() {
+        return closeSpinner();
       }
     });
-    child = $(dropzone[0]).children("textarea");
-    handlePaste = function(event) {
-      var filename, image, pasteEvent, text;
-      pasteEvent = event.originalEvent;
-      if (pasteEvent.clipboardData && pasteEvent.clipboardData.items) {
-        image = isImage(pasteEvent);
-        if (image) {
-          event.preventDefault();
-          filename = getFilename(pasteEvent) || "image.png";
-          text = "{{" + filename + "}}";
-          pasteText(text);
-          return uploadFile(image.getAsFile(), filename);
-        }
-      }
-    };
-    isImage = function(data) {
-      var i, item;
-      i = 0;
-      while (i < data.clipboardData.items.length) {
-        item = data.clipboardData.items[i];
-        if (item.type.indexOf("image") !== -1) {
-          return item;
-        }
-        i += 1;
-      }
-      return false;
-    };
-    pasteText = function(text) {
-      var afterSelection, beforeSelection, caretEnd, caretStart, textEnd;
-      var formattedText = text + "\n\n";
-      caretStart = $(child)[0].selectionStart;
-      caretEnd = $(child)[0].selectionEnd;
-      textEnd = $(child).val().length;
-      beforeSelection = $(child).val().substring(0, caretStart);
-      afterSelection = $(child).val().substring(caretEnd, textEnd);
-      $(child).val(beforeSelection + formattedText + afterSelection);
-      child.get(0).setSelectionRange(caretStart + formattedText.length, caretEnd + formattedText.length);
-      return form_textarea.trigger("input");
-    };
-    getFilename = function(e) {
-      var value;
-      if (window.clipboardData && window.clipboardData.getData) {
-        value = window.clipboardData.getData("Text");
-      } else if (e.clipboardData && e.clipboardData.getData) {
-        value = e.clipboardData.getData("text/plain");
-      }
-      value = value.split("\r");
-      return value.first();
-    };
-    uploadFile = function(item, filename) {
-      var formData;
-      formData = new FormData();
-      formData.append("file", item, filename);
-      return $.ajax({
-        url: project_uploads_path,
-        type: "POST",
-        data: formData,
-        dataType: "json",
-        processData: false,
-        contentType: false,
-        headers: {
-          "X-CSRF-Token": $("meta[name=\"csrf-token\"]").attr("content")
-        },
-        beforeSend: function() {
-          showSpinner();
-          return closeAlertMessage();
-        },
-        success: function(e, textStatus, response) {
-          return insertToTextArea(filename, response.responseJSON.link.markdown);
-        },
-        error: function(response) {
-          return showError(response.responseJSON.message);
-        },
-        complete: function() {
-          return closeSpinner();
-        }
-      });
-    };
-    insertToTextArea = function(filename, url) {
-      return $(child).val(function(index, val) {
-        return val.replace("{{" + filename + "}}", url + "\n");
-      });
-    };
-    appendToTextArea = function(url) {
-      return $(child).val(function(index, val) {
-        return val + url + "\n";
-      });
-    };
-    showSpinner = function(e) {
-      return form.find(".div-dropzone-spinner").css({
-        "opacity": 0.7,
-        "display": "inherit"
-      });
-    };
-    closeSpinner = function() {
-      return form.find(".div-dropzone-spinner").css({
-        "opacity": 0,
-        "display": "none"
-      });
-    };
-    showError = function(message) {
-      var checkIfMsgExists, errorAlert;
-      errorAlert = $(form).find('.error-alert');
-      checkIfMsgExists = errorAlert.children().length;
-      if (checkIfMsgExists === 0) {
-        errorAlert.append(divAlert);
-        return $(".div-dropzone-alert").append(btnAlert + message);
-      }
-    };
-    closeAlertMessage = function() {
-      return form.find(".div-dropzone-alert").alert("close");
-    };
-    form.find(".markdown-selector").click(function(e) {
-      e.preventDefault();
-      $(this).closest('.gfm-form').find('.div-dropzone').click();
+  };
+  insertToTextArea = function(filename, url) {
+    return $(child).val(function(index, val) {
+      return val.replace("{{" + filename + "}}", url + "\n");
+    });
+  };
+  appendToTextArea = function(url) {
+    return $(child).val(function(index, val) {
+      return val + url + "\n";
+    });
+  };
+  showSpinner = function(e) {
+    return form.find(".div-dropzone-spinner").css({
+      "opacity": 0.7,
+      "display": "inherit"
+    });
+  };
+  closeSpinner = function() {
+    return form.find(".div-dropzone-spinner").css({
+      "opacity": 0,
+      "display": "none"
     });
-  }
+  };
+  showError = function(message) {
+    var checkIfMsgExists, errorAlert;
+    errorAlert = $(form).find('.error-alert');
+    checkIfMsgExists = errorAlert.children().length;
+    if (checkIfMsgExists === 0) {
+      errorAlert.append(divAlert);
+      return $(".div-dropzone-alert").append(btnAlert + message);
+    }
+  };
+  closeAlertMessage = function() {
+    return form.find(".div-dropzone-alert").alert("close");
+  };
+  form.find(".markdown-selector").click(function(e) {
+    e.preventDefault();
+    $(this).closest('.gfm-form').find('.div-dropzone').click();
+  });
+}
 
-  return DropzoneInput;
-})();
+window.DropzoneInput = DropzoneInput;
diff --git a/app/assets/javascripts/filtered_search/dropdown_hint.js b/app/assets/javascripts/filtered_search/dropdown_hint.js
index 98dcb697af9..dc185c3217f 100644
--- a/app/assets/javascripts/filtered_search/dropdown_hint.js
+++ b/app/assets/javascripts/filtered_search/dropdown_hint.js
@@ -2,82 +2,80 @@ require('./filtered_search_dropdown');
 
 /* global droplabFilter */
 
-(() => {
-  class DropdownHint extends gl.FilteredSearchDropdown {
-    constructor(droplab, dropdown, input, filter) {
-      super(droplab, dropdown, input, filter);
-      this.config = {
-        droplabFilter: {
-          template: 'hint',
-          filterFunction: gl.DropdownUtils.filterHint.bind(null, input),
-        },
-      };
-    }
-
-    itemClicked(e) {
-      const { selected } = e.detail;
+class DropdownHint extends gl.FilteredSearchDropdown {
+  constructor(droplab, dropdown, input, filter) {
+    super(droplab, dropdown, input, filter);
+    this.config = {
+      droplabFilter: {
+        template: 'hint',
+        filterFunction: gl.DropdownUtils.filterHint.bind(null, input),
+      },
+    };
+  }
 
-      if (selected.tagName === 'LI') {
-        if (selected.hasAttribute('data-value')) {
-          this.dismissDropdown();
-        } else if (selected.getAttribute('data-action') === 'submit') {
-          this.dismissDropdown();
-          this.dispatchFormSubmitEvent();
-        } else {
-          const token = selected.querySelector('.js-filter-hint').innerText.trim();
-          const tag = selected.querySelector('.js-filter-tag').innerText.trim();
+  itemClicked(e) {
+    const { selected } = e.detail;
 
-          if (tag.length) {
-            // Get previous input values in the input field and convert them into visual tokens
-            const previousInputValues = this.input.value.split(' ');
-            const searchTerms = [];
+    if (selected.tagName === 'LI') {
+      if (selected.hasAttribute('data-value')) {
+        this.dismissDropdown();
+      } else if (selected.getAttribute('data-action') === 'submit') {
+        this.dismissDropdown();
+        this.dispatchFormSubmitEvent();
+      } else {
+        const token = selected.querySelector('.js-filter-hint').innerText.trim();
+        const tag = selected.querySelector('.js-filter-tag').innerText.trim();
 
-            previousInputValues.forEach((value, index) => {
-              searchTerms.push(value);
+        if (tag.length) {
+          // Get previous input values in the input field and convert them into visual tokens
+          const previousInputValues = this.input.value.split(' ');
+          const searchTerms = [];
 
-              if (index === previousInputValues.length - 1
-                && token.indexOf(value.toLowerCase()) !== -1) {
-                searchTerms.pop();
-              }
-            });
+          previousInputValues.forEach((value, index) => {
+            searchTerms.push(value);
 
-            if (searchTerms.length > 0) {
-              gl.FilteredSearchVisualTokens.addSearchVisualToken(searchTerms.join(' '));
+            if (index === previousInputValues.length - 1
+              && token.indexOf(value.toLowerCase()) !== -1) {
+              searchTerms.pop();
             }
+          });
 
-            gl.FilteredSearchDropdownManager.addWordToInput(token.replace(':', ''), '', false, this.container);
+          if (searchTerms.length > 0) {
+            gl.FilteredSearchVisualTokens.addSearchVisualToken(searchTerms.join(' '));
           }
-          this.dismissDropdown();
-          this.dispatchInputEvent();
+
+          gl.FilteredSearchDropdownManager.addWordToInput(token.replace(':', ''), '', false, this.container);
         }
+        this.dismissDropdown();
+        this.dispatchInputEvent();
       }
     }
+  }
 
-    renderContent() {
-      const dropdownData = [];
+  renderContent() {
+    const dropdownData = [];
 
-      [].forEach.call(this.input.closest('.filtered-search-input-container').querySelectorAll('.dropdown-menu'), (dropdownMenu) => {
-        const { icon, hint, tag, type } = dropdownMenu.dataset;
-        if (icon && hint && tag) {
-          dropdownData.push(
-            Object.assign({
-              icon: `fa-${icon}`,
-              hint,
-              tag: `&lt;${tag}&gt;`,
-            }, type && { type }),
-          );
-        }
-      });
+    [].forEach.call(this.input.closest('.filtered-search-input-container').querySelectorAll('.dropdown-menu'), (dropdownMenu) => {
+      const { icon, hint, tag, type } = dropdownMenu.dataset;
+      if (icon && hint && tag) {
+        dropdownData.push(
+          Object.assign({
+            icon: `fa-${icon}`,
+            hint,
+            tag: `&lt;${tag}&gt;`,
+          }, type && { type }),
+        );
+      }
+    });
 
-      this.droplab.changeHookList(this.hookId, this.dropdown, [droplabFilter], this.config);
-      this.droplab.setData(this.hookId, dropdownData);
-    }
+    this.droplab.changeHookList(this.hookId, this.dropdown, [droplabFilter], this.config);
+    this.droplab.setData(this.hookId, dropdownData);
+  }
 
-    init() {
-      this.droplab.addHook(this.input, this.dropdown, [droplabFilter], this.config).init();
-    }
+  init() {
+    this.droplab.addHook(this.input, this.dropdown, [droplabFilter], this.config).init();
   }
+}
 
-  window.gl = window.gl || {};
-  gl.DropdownHint = DropdownHint;
-})();
+window.gl = window.gl || {};
+gl.DropdownHint = DropdownHint;
diff --git a/app/assets/javascripts/filtered_search/dropdown_non_user.js b/app/assets/javascripts/filtered_search/dropdown_non_user.js
index b3dc3e502c5..fa60d182e8a 100644
--- a/app/assets/javascripts/filtered_search/dropdown_non_user.js
+++ b/app/assets/javascripts/filtered_search/dropdown_non_user.js
@@ -3,42 +3,40 @@ require('./filtered_search_dropdown');
 /* global droplabAjax */
 /* global droplabFilter */
 
-(() => {
-  class DropdownNonUser extends gl.FilteredSearchDropdown {
-    constructor(droplab, dropdown, input, filter, endpoint, symbol) {
-      super(droplab, dropdown, input, filter);
-      this.symbol = symbol;
-      this.config = {
-        droplabAjax: {
-          endpoint,
-          method: 'setData',
-          loadingTemplate: this.loadingTemplate,
-        },
-        droplabFilter: {
-          filterFunction: gl.DropdownUtils.filterWithSymbol.bind(null, this.symbol, input),
-        },
-      };
-    }
+class DropdownNonUser extends gl.FilteredSearchDropdown {
+  constructor(droplab, dropdown, input, filter, endpoint, symbol) {
+    super(droplab, dropdown, input, filter);
+    this.symbol = symbol;
+    this.config = {
+      droplabAjax: {
+        endpoint,
+        method: 'setData',
+        loadingTemplate: this.loadingTemplate,
+      },
+      droplabFilter: {
+        filterFunction: gl.DropdownUtils.filterWithSymbol.bind(null, this.symbol, input),
+      },
+    };
+  }
 
-    itemClicked(e) {
-      super.itemClicked(e, (selected) => {
-        const title = selected.querySelector('.js-data-value').innerText.trim();
-        return `${this.symbol}${gl.DropdownUtils.getEscapedText(title)}`;
-      });
-    }
+  itemClicked(e) {
+    super.itemClicked(e, (selected) => {
+      const title = selected.querySelector('.js-data-value').innerText.trim();
+      return `${this.symbol}${gl.DropdownUtils.getEscapedText(title)}`;
+    });
+  }
 
-    renderContent(forceShowList = false) {
-      this.droplab
-        .changeHookList(this.hookId, this.dropdown, [droplabAjax, droplabFilter], this.config);
-      super.renderContent(forceShowList);
-    }
+  renderContent(forceShowList = false) {
+    this.droplab
+      .changeHookList(this.hookId, this.dropdown, [droplabAjax, droplabFilter], this.config);
+    super.renderContent(forceShowList);
+  }
 
-    init() {
-      this.droplab
-        .addHook(this.input, this.dropdown, [droplabAjax, droplabFilter], this.config).init();
-    }
+  init() {
+    this.droplab
+      .addHook(this.input, this.dropdown, [droplabAjax, droplabFilter], this.config).init();
   }
+}
 
-  window.gl = window.gl || {};
-  gl.DropdownNonUser = DropdownNonUser;
-})();
+window.gl = window.gl || {};
+gl.DropdownNonUser = DropdownNonUser;
diff --git a/app/assets/javascripts/filtered_search/dropdown_user.js b/app/assets/javascripts/filtered_search/dropdown_user.js
index 04e2afad02f..6d2fe2b1928 100644
--- a/app/assets/javascripts/filtered_search/dropdown_user.js
+++ b/app/assets/javascripts/filtered_search/dropdown_user.js
@@ -2,64 +2,62 @@ require('./filtered_search_dropdown');
 
 /* global droplabAjaxFilter */
 
-(() => {
-  class DropdownUser extends gl.FilteredSearchDropdown {
-    constructor(droplab, dropdown, input, filter) {
-      super(droplab, dropdown, input, filter);
-      this.config = {
-        droplabAjaxFilter: {
-          endpoint: `${gon.relative_url_root || ''}/autocomplete/users.json`,
-          searchKey: 'search',
-          params: {
-            per_page: 20,
-            active: true,
-            project_id: this.getProjectId(),
-            current_user: true,
-          },
-          searchValueFunction: this.getSearchInput.bind(this),
-          loadingTemplate: this.loadingTemplate,
+class DropdownUser extends gl.FilteredSearchDropdown {
+  constructor(droplab, dropdown, input, filter) {
+    super(droplab, dropdown, input, filter);
+    this.config = {
+      droplabAjaxFilter: {
+        endpoint: `${gon.relative_url_root || ''}/autocomplete/users.json`,
+        searchKey: 'search',
+        params: {
+          per_page: 20,
+          active: true,
+          project_id: this.getProjectId(),
+          current_user: true,
         },
-      };
-    }
-
-    itemClicked(e) {
-      super.itemClicked(e,
-        selected => selected.querySelector('.dropdown-light-content').innerText.trim());
-    }
-
-    renderContent(forceShowList = false) {
-      this.droplab.changeHookList(this.hookId, this.dropdown, [droplabAjaxFilter], this.config);
-      super.renderContent(forceShowList);
-    }
+        searchValueFunction: this.getSearchInput.bind(this),
+        loadingTemplate: this.loadingTemplate,
+      },
+    };
+  }
 
-    getProjectId() {
-      return this.input.getAttribute('data-project-id');
-    }
+  itemClicked(e) {
+    super.itemClicked(e,
+      selected => selected.querySelector('.dropdown-light-content').innerText.trim());
+  }
 
-    getSearchInput() {
-      const query = gl.DropdownUtils.getSearchInput(this.input);
-      const { lastToken } = gl.FilteredSearchTokenizer.processTokens(query);
+  renderContent(forceShowList = false) {
+    this.droplab.changeHookList(this.hookId, this.dropdown, [droplabAjaxFilter], this.config);
+    super.renderContent(forceShowList);
+  }
 
-      let value = lastToken || '';
+  getProjectId() {
+    return this.input.getAttribute('data-project-id');
+  }
 
-      if (value[0] === '@') {
-        value = value.slice(1);
-      }
+  getSearchInput() {
+    const query = gl.DropdownUtils.getSearchInput(this.input);
+    const { lastToken } = gl.FilteredSearchTokenizer.processTokens(query);
 
-      // Removes the first character if it is a quotation so that we can search
-      // with multiple words
-      if (value[0] === '"' || value[0] === '\'') {
-        value = value.slice(1);
-      }
+    let value = lastToken || '';
 
-      return value;
+    if (value[0] === '@') {
+      value = value.slice(1);
     }
 
-    init() {
-      this.droplab.addHook(this.input, this.dropdown, [droplabAjaxFilter], this.config).init();
+    // Removes the first character if it is a quotation so that we can search
+    // with multiple words
+    if (value[0] === '"' || value[0] === '\'') {
+      value = value.slice(1);
     }
+
+    return value;
+  }
+
+  init() {
+    this.droplab.addHook(this.input, this.dropdown, [droplabAjaxFilter], this.config).init();
   }
+}
 
-  window.gl = window.gl || {};
-  gl.DropdownUser = DropdownUser;
-})();
+window.gl = window.gl || {};
+gl.DropdownUser = DropdownUser;
diff --git a/app/assets/javascripts/filtered_search/dropdown_utils.js b/app/assets/javascripts/filtered_search/dropdown_utils.js
index 432b0c0dfd2..fd53b292d9c 100644
--- a/app/assets/javascripts/filtered_search/dropdown_utils.js
+++ b/app/assets/javascripts/filtered_search/dropdown_utils.js
@@ -1,181 +1,179 @@
 import FilteredSearchContainer from './container';
 
-(() => {
-  class DropdownUtils {
-    static getEscapedText(text) {
-      let escapedText = text;
-      const hasSpace = text.indexOf(' ') !== -1;
-      const hasDoubleQuote = text.indexOf('"') !== -1;
-
-      // Encapsulate value with quotes if it has spaces
-      // Known side effect: values's with both single and double quotes
-      // won't escape properly
-      if (hasSpace) {
-        if (hasDoubleQuote) {
-          escapedText = `'${text}'`;
-        } else {
-          // Encapsulate singleQuotes or if it hasSpace
-          escapedText = `"${text}"`;
-        }
+class DropdownUtils {
+  static getEscapedText(text) {
+    let escapedText = text;
+    const hasSpace = text.indexOf(' ') !== -1;
+    const hasDoubleQuote = text.indexOf('"') !== -1;
+
+    // Encapsulate value with quotes if it has spaces
+    // Known side effect: values's with both single and double quotes
+    // won't escape properly
+    if (hasSpace) {
+      if (hasDoubleQuote) {
+        escapedText = `'${text}'`;
+      } else {
+        // Encapsulate singleQuotes or if it hasSpace
+        escapedText = `"${text}"`;
       }
-
-      return escapedText;
     }
 
-    static filterWithSymbol(filterSymbol, input, item) {
-      const updatedItem = item;
-      const searchInput = gl.DropdownUtils.getSearchInput(input);
+    return escapedText;
+  }
+
+  static filterWithSymbol(filterSymbol, input, item) {
+    const updatedItem = item;
+    const searchInput = gl.DropdownUtils.getSearchInput(input);
 
-      const title = updatedItem.title.toLowerCase();
-      let value = searchInput.toLowerCase();
-      let symbol = '';
+    const title = updatedItem.title.toLowerCase();
+    let value = searchInput.toLowerCase();
+    let symbol = '';
 
-      // Remove the symbol for filter
-      if (value[0] === filterSymbol) {
-        symbol = value[0];
-        value = value.slice(1);
-      }
+    // Remove the symbol for filter
+    if (value[0] === filterSymbol) {
+      symbol = value[0];
+      value = value.slice(1);
+    }
 
-      // Removes the first character if it is a quotation so that we can search
-      // with multiple words
-      if ((value[0] === '"' || value[0] === '\'') && title.indexOf(' ') !== -1) {
-        value = value.slice(1);
-      }
+    // Removes the first character if it is a quotation so that we can search
+    // with multiple words
+    if ((value[0] === '"' || value[0] === '\'') && title.indexOf(' ') !== -1) {
+      value = value.slice(1);
+    }
+
+    // Eg. filterSymbol = ~ for labels
+    const matchWithoutSymbol = symbol === filterSymbol && title.indexOf(value) !== -1;
+    const match = title.indexOf(`${symbol}${value}`) !== -1;
 
-      // Eg. filterSymbol = ~ for labels
-      const matchWithoutSymbol = symbol === filterSymbol && title.indexOf(value) !== -1;
-      const match = title.indexOf(`${symbol}${value}`) !== -1;
+    updatedItem.droplab_hidden = !match && !matchWithoutSymbol;
 
-      updatedItem.droplab_hidden = !match && !matchWithoutSymbol;
+    return updatedItem;
+  }
 
-      return updatedItem;
+  static filterHint(input, item) {
+    const updatedItem = item;
+    const searchInput = gl.DropdownUtils.getSearchQuery(input);
+    const { lastToken, tokens } = gl.FilteredSearchTokenizer.processTokens(searchInput);
+    const lastKey = lastToken.key || lastToken || '';
+    const allowMultiple = item.type === 'array';
+    const itemInExistingTokens = tokens.some(t => t.key === item.hint);
+
+    if (!allowMultiple && itemInExistingTokens) {
+      updatedItem.droplab_hidden = true;
+    } else if (!lastKey || searchInput.split('').last() === ' ') {
+      updatedItem.droplab_hidden = false;
+    } else if (lastKey) {
+      const split = lastKey.split(':');
+      const tokenName = split[0].split(' ').last();
+
+      const match = updatedItem.hint.indexOf(tokenName.toLowerCase()) === -1;
+      updatedItem.droplab_hidden = tokenName ? match : false;
     }
 
-    static filterHint(input, item) {
-      const updatedItem = item;
-      const searchInput = gl.DropdownUtils.getSearchQuery(input);
-      const { lastToken, tokens } = gl.FilteredSearchTokenizer.processTokens(searchInput);
-      const lastKey = lastToken.key || lastToken || '';
-      const allowMultiple = item.type === 'array';
-      const itemInExistingTokens = tokens.some(t => t.key === item.hint);
-
-      if (!allowMultiple && itemInExistingTokens) {
-        updatedItem.droplab_hidden = true;
-      } else if (!lastKey || searchInput.split('').last() === ' ') {
-        updatedItem.droplab_hidden = false;
-      } else if (lastKey) {
-        const split = lastKey.split(':');
-        const tokenName = split[0].split(' ').last();
-
-        const match = updatedItem.hint.indexOf(tokenName.toLowerCase()) === -1;
-        updatedItem.droplab_hidden = tokenName ? match : false;
-      }
+    return updatedItem;
+  }
+
+  static setDataValueIfSelected(filter, selected) {
+    const dataValue = selected.getAttribute('data-value');
 
-      return updatedItem;
+    if (dataValue) {
+      gl.FilteredSearchDropdownManager.addWordToInput(filter, dataValue, true);
     }
 
-    static setDataValueIfSelected(filter, selected) {
-      const dataValue = selected.getAttribute('data-value');
+    // Return boolean based on whether it was set
+    return dataValue !== null;
+  }
 
-      if (dataValue) {
-        gl.FilteredSearchDropdownManager.addWordToInput(filter, dataValue, true);
-      }
+  // Determines the full search query (visual tokens + input)
+  static getSearchQuery(untilInput = false) {
+    const container = FilteredSearchContainer.container;
+    const tokens = [].slice.call(container.querySelectorAll('.tokens-container li'));
+    const values = [];
 
-      // Return boolean based on whether it was set
-      return dataValue !== null;
+    if (untilInput) {
+      const inputIndex = _.findIndex(tokens, t => t.classList.contains('input-token'));
+      // Add one to include input-token to the tokens array
+      tokens.splice(inputIndex + 1);
     }
 
-    // Determines the full search query (visual tokens + input)
-    static getSearchQuery(untilInput = false) {
-      const container = FilteredSearchContainer.container;
-      const tokens = [].slice.call(container.querySelectorAll('.tokens-container li'));
-      const values = [];
+    tokens.forEach((token) => {
+      if (token.classList.contains('js-visual-token')) {
+        const name = token.querySelector('.name');
+        const value = token.querySelector('.value');
+        const symbol = value && value.dataset.symbol ? value.dataset.symbol : '';
+        let valueText = '';
 
-      if (untilInput) {
-        const inputIndex = _.findIndex(tokens, t => t.classList.contains('input-token'));
-        // Add one to include input-token to the tokens array
-        tokens.splice(inputIndex + 1);
-      }
+        if (value && value.innerText) {
+          valueText = value.innerText;
+        }
 
-      tokens.forEach((token) => {
-        if (token.classList.contains('js-visual-token')) {
-          const name = token.querySelector('.name');
-          const value = token.querySelector('.value');
-          const symbol = value && value.dataset.symbol ? value.dataset.symbol : '';
-          let valueText = '';
-
-          if (value && value.innerText) {
-            valueText = value.innerText;
-          }
-
-          if (token.className.indexOf('filtered-search-token') !== -1) {
-            values.push(`${name.innerText.toLowerCase()}:${symbol}${valueText}`);
-          } else {
-            values.push(name.innerText);
-          }
-        } else if (token.classList.contains('input-token')) {
-          const { isLastVisualTokenValid } =
-            gl.FilteredSearchVisualTokens.getLastVisualTokenBeforeInput();
-
-          const input = FilteredSearchContainer.container.querySelector('.filtered-search');
-          const inputValue = input && input.value;
-
-          if (isLastVisualTokenValid) {
-            values.push(inputValue);
-          } else {
-            const previous = values.pop();
-            values.push(`${previous}${inputValue}`);
-          }
+        if (token.className.indexOf('filtered-search-token') !== -1) {
+          values.push(`${name.innerText.toLowerCase()}:${symbol}${valueText}`);
+        } else {
+          values.push(name.innerText);
         }
-      });
+      } else if (token.classList.contains('input-token')) {
+        const { isLastVisualTokenValid } =
+          gl.FilteredSearchVisualTokens.getLastVisualTokenBeforeInput();
 
-      return values.join(' ');
-    }
+        const input = FilteredSearchContainer.container.querySelector('.filtered-search');
+        const inputValue = input && input.value;
 
-    static getSearchInput(filteredSearchInput) {
-      const inputValue = filteredSearchInput.value;
-      const { right } = gl.DropdownUtils.getInputSelectionPosition(filteredSearchInput);
+        if (isLastVisualTokenValid) {
+          values.push(inputValue);
+        } else {
+          const previous = values.pop();
+          values.push(`${previous}${inputValue}`);
+        }
+      }
+    });
 
-      return inputValue.slice(0, right);
-    }
+    return values.join(' ');
+  }
 
-    static getInputSelectionPosition(input) {
-      const selectionStart = input.selectionStart;
-      let inputValue = input.value;
-      // Replace all spaces inside quote marks with underscores
-      // (will continue to match entire string until an end quote is found if any)
-      // This helps with matching the beginning & end of a token:key
-      inputValue = inputValue.replace(/(('[^']*'{0,1})|("[^"]*"{0,1})|:\s+)/g, str => str.replace(/\s/g, '_'));
-
-      // Get the right position for the word selected
-      // Regex matches first space
-      let right = inputValue.slice(selectionStart).search(/\s/);
-
-      if (right >= 0) {
-        right += selectionStart;
-      } else if (right < 0) {
-        right = inputValue.length;
-      }
+  static getSearchInput(filteredSearchInput) {
+    const inputValue = filteredSearchInput.value;
+    const { right } = gl.DropdownUtils.getInputSelectionPosition(filteredSearchInput);
 
-      // Get the left position for the word selected
-      // Regex matches last non-whitespace character
-      let left = inputValue.slice(0, right).search(/\S+$/);
+    return inputValue.slice(0, right);
+  }
 
-      if (selectionStart === 0) {
-        left = 0;
-      } else if (selectionStart === inputValue.length && left < 0) {
-        left = inputValue.length;
-      } else if (left < 0) {
-        left = selectionStart;
-      }
+  static getInputSelectionPosition(input) {
+    const selectionStart = input.selectionStart;
+    let inputValue = input.value;
+    // Replace all spaces inside quote marks with underscores
+    // (will continue to match entire string until an end quote is found if any)
+    // This helps with matching the beginning & end of a token:key
+    inputValue = inputValue.replace(/(('[^']*'{0,1})|("[^"]*"{0,1})|:\s+)/g, str => str.replace(/\s/g, '_'));
+
+    // Get the right position for the word selected
+    // Regex matches first space
+    let right = inputValue.slice(selectionStart).search(/\s/);
+
+    if (right >= 0) {
+      right += selectionStart;
+    } else if (right < 0) {
+      right = inputValue.length;
+    }
+
+    // Get the left position for the word selected
+    // Regex matches last non-whitespace character
+    let left = inputValue.slice(0, right).search(/\S+$/);
 
-      return {
-        left,
-        right,
-      };
+    if (selectionStart === 0) {
+      left = 0;
+    } else if (selectionStart === inputValue.length && left < 0) {
+      left = inputValue.length;
+    } else if (left < 0) {
+      left = selectionStart;
     }
+
+    return {
+      left,
+      right,
+    };
   }
+}
 
-  window.gl = window.gl || {};
-  gl.DropdownUtils = DropdownUtils;
-})();
+window.gl = window.gl || {};
+gl.DropdownUtils = DropdownUtils;
diff --git a/app/assets/javascripts/lib/utils/datetime_utility.js b/app/assets/javascripts/lib/utils/datetime_utility.js
index 82dcbdc26c8..195b66a28fc 100644
--- a/app/assets/javascripts/lib/utils/datetime_utility.js
+++ b/app/assets/javascripts/lib/utils/datetime_utility.js
@@ -1,126 +1,123 @@
-/* eslint-disable func-names, space-before-function-paren, wrap-iife, no-var, no-param-reassign, no-cond-assign, comma-dangle, no-unused-expressions, prefer-template, max-len */
+/* eslint-disable func-names, space-before-function-paren, wrap-iife, no-var, no-param-reassign, no-cond-assign, comma-dangle, no-unused-expressions, prefer-template, max-len, vars-on-top */
 /* global timeago */
 /* global dateFormat */
 
 window.timeago = require('timeago.js');
 window.dateFormat = require('vendor/date.format');
 
-(function() {
-  (function(w) {
-    var base;
-    var timeagoInstance;
-
-    if (w.gl == null) {
-      w.gl = {};
-    }
-    if ((base = w.gl).utils == null) {
-      base.utils = {};
-    }
-    w.gl.utils.days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
-
-    w.gl.utils.formatDate = function(datetime) {
-      return dateFormat(datetime, 'mmm d, yyyy h:MMtt Z');
-    };
-
-    w.gl.utils.getDayName = function(date) {
-      return this.days[date.getDay()];
-    };
-
-    w.gl.utils.localTimeAgo = function($timeagoEls, setTimeago = true) {
-      $timeagoEls.each((i, el) => {
-        el.setAttribute('title', gl.utils.formatDate(el.getAttribute('datetime')));
-
-        if (setTimeago) {
-          // Recreate with custom template
-          $(el).tooltip({
-            template: '<div class="tooltip local-timeago" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>'
-          });
-        }
-
-        el.classList.add('js-timeago-render');
+var w = window;
+var base;
+var timeagoInstance;
+
+if (w.gl == null) {
+  w.gl = {};
+}
+if ((base = w.gl).utils == null) {
+  base.utils = {};
+}
+w.gl.utils.days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
+
+w.gl.utils.formatDate = function(datetime) {
+  return dateFormat(datetime, 'mmm d, yyyy h:MMtt Z');
+};
+
+w.gl.utils.getDayName = function(date) {
+  return this.days[date.getDay()];
+};
+
+w.gl.utils.localTimeAgo = function($timeagoEls, setTimeago = true) {
+  $timeagoEls.each((i, el) => {
+    el.setAttribute('title', gl.utils.formatDate(el.getAttribute('datetime')));
+
+    if (setTimeago) {
+      // Recreate with custom template
+      $(el).tooltip({
+        template: '<div class="tooltip local-timeago" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>'
       });
+    }
 
-      gl.utils.renderTimeago($timeagoEls);
-    };
-
-    w.gl.utils.getTimeago = function() {
-      var locale;
-
-      if (!timeagoInstance) {
-        locale = function(number, index) {
-          return [
-            ['less than a minute ago', 'a while'],
-            ['less than a minute ago', 'in %s seconds'],
-            ['about a minute ago', 'in 1 minute'],
-            ['%s minutes ago', 'in %s minutes'],
-            ['about an hour ago', 'in 1 hour'],
-            ['about %s hours ago', 'in %s hours'],
-            ['a day ago', 'in 1 day'],
-            ['%s days ago', 'in %s days'],
-            ['a week ago', 'in 1 week'],
-            ['%s weeks ago', 'in %s weeks'],
-            ['a month ago', 'in 1 month'],
-            ['%s months ago', 'in %s months'],
-            ['a year ago', 'in 1 year'],
-            ['%s years ago', 'in %s years']
-          ][index];
-        };
-
-        timeago.register('gl_en', locale);
-        timeagoInstance = timeago();
-      }
-
-      return timeagoInstance;
-    };
-
-    w.gl.utils.timeFor = function(time, suffix, expiredLabel) {
-      var timefor;
-      if (!time) {
-        return '';
-      }
-      suffix || (suffix = 'remaining');
-      expiredLabel || (expiredLabel = 'Past due');
-      timefor = gl.utils.getTimeago().format(time).replace('in', '');
-      if (timefor.indexOf('ago') > -1) {
-        timefor = expiredLabel;
-      } else {
-        timefor = timefor.trim() + ' ' + suffix;
-      }
-      return timefor;
-    };
-
-    w.gl.utils.cachedTimeagoElements = [];
-    w.gl.utils.renderTimeago = function($els) {
-      if (!$els && !w.gl.utils.cachedTimeagoElements.length) {
-        w.gl.utils.cachedTimeagoElements = [].slice.call(document.querySelectorAll('.js-timeago-render'));
-      } else if ($els) {
-        w.gl.utils.cachedTimeagoElements = w.gl.utils.cachedTimeagoElements.concat($els.toArray());
-      }
-
-      w.gl.utils.cachedTimeagoElements.forEach(gl.utils.updateTimeagoText);
-    };
-
-    w.gl.utils.updateTimeagoText = function(el) {
-      const timeago = gl.utils.getTimeago();
-      const formattedDate = timeago.format(el.getAttribute('datetime'), 'gl_en');
-
-      if (el.textContent !== formattedDate) {
-        el.textContent = formattedDate;
-      }
-    };
-
-    w.gl.utils.initTimeagoTimeout = function() {
-      gl.utils.renderTimeago();
-
-      gl.utils.timeagoTimeout = setTimeout(gl.utils.initTimeagoTimeout, 1000);
+    el.classList.add('js-timeago-render');
+  });
+
+  gl.utils.renderTimeago($timeagoEls);
+};
+
+w.gl.utils.getTimeago = function() {
+  var locale;
+
+  if (!timeagoInstance) {
+    locale = function(number, index) {
+      return [
+        ['less than a minute ago', 'a while'],
+        ['less than a minute ago', 'in %s seconds'],
+        ['about a minute ago', 'in 1 minute'],
+        ['%s minutes ago', 'in %s minutes'],
+        ['about an hour ago', 'in 1 hour'],
+        ['about %s hours ago', 'in %s hours'],
+        ['a day ago', 'in 1 day'],
+        ['%s days ago', 'in %s days'],
+        ['a week ago', 'in 1 week'],
+        ['%s weeks ago', 'in %s weeks'],
+        ['a month ago', 'in 1 month'],
+        ['%s months ago', 'in %s months'],
+        ['a year ago', 'in 1 year'],
+        ['%s years ago', 'in %s years']
+      ][index];
     };
 
-    w.gl.utils.getDayDifference = function(a, b) {
-      var millisecondsPerDay = 1000 * 60 * 60 * 24;
-      var date1 = Date.UTC(a.getFullYear(), a.getMonth(), a.getDate());
-      var date2 = Date.UTC(b.getFullYear(), b.getMonth(), b.getDate());
-
-      return Math.floor((date2 - date1) / millisecondsPerDay);
-    };
-  })(window);
-}).call(window);
+    timeago.register('gl_en', locale);
+    timeagoInstance = timeago();
+  }
+
+  return timeagoInstance;
+};
+
+w.gl.utils.timeFor = function(time, suffix, expiredLabel) {
+  var timefor;
+  if (!time) {
+    return '';
+  }
+  suffix || (suffix = 'remaining');
+  expiredLabel || (expiredLabel = 'Past due');
+  timefor = gl.utils.getTimeago().format(time).replace('in', '');
+  if (timefor.indexOf('ago') > -1) {
+    timefor = expiredLabel;
+  } else {
+    timefor = timefor.trim() + ' ' + suffix;
+  }
+  return timefor;
+};
+
+w.gl.utils.cachedTimeagoElements = [];
+w.gl.utils.renderTimeago = function($els) {
+  if (!$els && !w.gl.utils.cachedTimeagoElements.length) {
+    w.gl.utils.cachedTimeagoElements = [].slice.call(document.querySelectorAll('.js-timeago-render'));
+  } else if ($els) {
+    w.gl.utils.cachedTimeagoElements = w.gl.utils.cachedTimeagoElements.concat($els.toArray());
+  }
+
+  w.gl.utils.cachedTimeagoElements.forEach(gl.utils.updateTimeagoText);
+};
+
+w.gl.utils.updateTimeagoText = function(el) {
+  const timeago = gl.utils.getTimeago();
+  const formattedDate = timeago.format(el.getAttribute('datetime'), 'gl_en');
+
+  if (el.textContent !== formattedDate) {
+    el.textContent = formattedDate;
+  }
+};
+
+w.gl.utils.initTimeagoTimeout = function() {
+  gl.utils.renderTimeago();
+
+  gl.utils.timeagoTimeout = setTimeout(gl.utils.initTimeagoTimeout, 1000);
+};
+
+w.gl.utils.getDayDifference = function(a, b) {
+  var millisecondsPerDay = 1000 * 60 * 60 * 24;
+  var date1 = Date.UTC(a.getFullYear(), a.getMonth(), a.getDate());
+  var date2 = Date.UTC(b.getFullYear(), b.getMonth(), b.getDate());
+
+  return Math.floor((date2 - date1) / millisecondsPerDay);
+};
diff --git a/app/assets/javascripts/merge_conflicts/components/diff_file_editor.js b/app/assets/javascripts/merge_conflicts/components/diff_file_editor.js
index 645045fea88..f30b99d0dbf 100644
--- a/app/assets/javascripts/merge_conflicts/components/diff_file_editor.js
+++ b/app/assets/javascripts/merge_conflicts/components/diff_file_editor.js
@@ -4,94 +4,94 @@
 
 import Vue from 'vue';
 
-((global) => {
-  global.mergeConflicts = global.mergeConflicts || {};
+const global = window.gl || (window.gl = {});
 
-  global.mergeConflicts.diffFileEditor = Vue.extend({
-    props: {
-      file: Object,
-      onCancelDiscardConfirmation: Function,
-      onAcceptDiscardConfirmation: Function
-    },
-    data() {
+global.mergeConflicts = global.mergeConflicts || {};
+
+global.mergeConflicts.diffFileEditor = Vue.extend({
+  props: {
+    file: Object,
+    onCancelDiscardConfirmation: Function,
+    onAcceptDiscardConfirmation: Function
+  },
+  data() {
+    return {
+      saved: false,
+      loading: false,
+      fileLoaded: false,
+      originalContent: '',
+    };
+  },
+  computed: {
+    classObject() {
       return {
-        saved: false,
-        loading: false,
-        fileLoaded: false,
-        originalContent: '',
+        'saved': this.saved,
+        'is-loading': this.loading
       };
-    },
-    computed: {
-      classObject() {
-        return {
-          'saved': this.saved,
-          'is-loading': this.loading
-        };
-      }
-    },
-    watch: {
-      ['file.showEditor'](val) {
-        this.resetEditorContent();
-
-        if (!val || this.fileLoaded || this.loading) {
-          return;
-        }
+    }
+  },
+  watch: {
+    ['file.showEditor'](val) {
+      this.resetEditorContent();
 
-        this.loadEditor();
-      }
-    },
-    mounted() {
-      if (this.file.loadEditor) {
-        this.loadEditor();
+      if (!val || this.fileLoaded || this.loading) {
+        return;
       }
-    },
-    methods: {
-      loadEditor() {
-        this.loading = true;
 
-        $.get(this.file.content_path)
-          .done((file) => {
-            const content = this.$el.querySelector('pre');
-            const fileContent = document.createTextNode(file.content);
+      this.loadEditor();
+    }
+  },
+  mounted() {
+    if (this.file.loadEditor) {
+      this.loadEditor();
+    }
+  },
+  methods: {
+    loadEditor() {
+      this.loading = true;
+
+      $.get(this.file.content_path)
+        .done((file) => {
+          const content = this.$el.querySelector('pre');
+          const fileContent = document.createTextNode(file.content);
 
-            content.textContent = fileContent.textContent;
+          content.textContent = fileContent.textContent;
 
-            this.originalContent = file.content;
-            this.fileLoaded = true;
-            this.editor = ace.edit(content);
-            this.editor.$blockScrolling = Infinity; // Turn off annoying warning
-            this.editor.getSession().setMode(`ace/mode/${file.blob_ace_mode}`);
-            this.editor.on('change', () => {
-              this.saveDiffResolution();
-            });
+          this.originalContent = file.content;
+          this.fileLoaded = true;
+          this.editor = ace.edit(content);
+          this.editor.$blockScrolling = Infinity; // Turn off annoying warning
+          this.editor.getSession().setMode(`ace/mode/${file.blob_ace_mode}`);
+          this.editor.on('change', () => {
             this.saveDiffResolution();
-          })
-          .fail(() => {
-            new Flash('Failed to load the file, please try again.');
-          })
-          .always(() => {
-            this.loading = false;
           });
-      },
-      saveDiffResolution() {
-        this.saved = true;
+          this.saveDiffResolution();
+        })
+        .fail(() => {
+          new Flash('Failed to load the file, please try again.');
+        })
+        .always(() => {
+          this.loading = false;
+        });
+    },
+    saveDiffResolution() {
+      this.saved = true;
 
-        // This probably be better placed in the data provider
-        this.file.content = this.editor.getValue();
-        this.file.resolveEditChanged = this.file.content !== this.originalContent;
-        this.file.promptDiscardConfirmation = false;
-      },
-      resetEditorContent() {
-        if (this.fileLoaded) {
-          this.editor.setValue(this.originalContent, -1);
-        }
-      },
-      cancelDiscardConfirmation(file) {
-        this.onCancelDiscardConfirmation(file);
-      },
-      acceptDiscardConfirmation(file) {
-        this.onAcceptDiscardConfirmation(file);
+      // This probably be better placed in the data provider
+      this.file.content = this.editor.getValue();
+      this.file.resolveEditChanged = this.file.content !== this.originalContent;
+      this.file.promptDiscardConfirmation = false;
+    },
+    resetEditorContent() {
+      if (this.fileLoaded) {
+        this.editor.setValue(this.originalContent, -1);
       }
+    },
+    cancelDiscardConfirmation(file) {
+      this.onCancelDiscardConfirmation(file);
+    },
+    acceptDiscardConfirmation(file) {
+      this.onAcceptDiscardConfirmation(file);
     }
-  });
-})(window.gl || (window.gl = {}));
+  }
+});
diff --git a/spec/javascripts/datetime_utility_spec.js b/spec/javascripts/datetime_utility_spec.js
index d5eec10be42..b359590c97e 100644
--- a/spec/javascripts/datetime_utility_spec.js
+++ b/spec/javascripts/datetime_utility_spec.js
@@ -1,65 +1,63 @@
 require('~/lib/utils/datetime_utility');
 
-(() => {
-  describe('Date time utils', () => {
-    describe('get day name', () => {
-      it('should return Sunday', () => {
-        const day = gl.utils.getDayName(new Date('07/17/2016'));
-        expect(day).toBe('Sunday');
-      });
+describe('Date time utils', () => {
+  describe('get day name', () => {
+    it('should return Sunday', () => {
+      const day = gl.utils.getDayName(new Date('07/17/2016'));
+      expect(day).toBe('Sunday');
+    });
 
-      it('should return Monday', () => {
-        const day = gl.utils.getDayName(new Date('07/18/2016'));
-        expect(day).toBe('Monday');
-      });
+    it('should return Monday', () => {
+      const day = gl.utils.getDayName(new Date('07/18/2016'));
+      expect(day).toBe('Monday');
+    });
 
-      it('should return Tuesday', () => {
-        const day = gl.utils.getDayName(new Date('07/19/2016'));
-        expect(day).toBe('Tuesday');
-      });
+    it('should return Tuesday', () => {
+      const day = gl.utils.getDayName(new Date('07/19/2016'));
+      expect(day).toBe('Tuesday');
+    });
 
-      it('should return Wednesday', () => {
-        const day = gl.utils.getDayName(new Date('07/20/2016'));
-        expect(day).toBe('Wednesday');
-      });
+    it('should return Wednesday', () => {
+      const day = gl.utils.getDayName(new Date('07/20/2016'));
+      expect(day).toBe('Wednesday');
+    });
 
-      it('should return Thursday', () => {
-        const day = gl.utils.getDayName(new Date('07/21/2016'));
-        expect(day).toBe('Thursday');
-      });
+    it('should return Thursday', () => {
+      const day = gl.utils.getDayName(new Date('07/21/2016'));
+      expect(day).toBe('Thursday');
+    });
 
-      it('should return Friday', () => {
-        const day = gl.utils.getDayName(new Date('07/22/2016'));
-        expect(day).toBe('Friday');
-      });
+    it('should return Friday', () => {
+      const day = gl.utils.getDayName(new Date('07/22/2016'));
+      expect(day).toBe('Friday');
+    });
 
-      it('should return Saturday', () => {
-        const day = gl.utils.getDayName(new Date('07/23/2016'));
-        expect(day).toBe('Saturday');
-      });
+    it('should return Saturday', () => {
+      const day = gl.utils.getDayName(new Date('07/23/2016'));
+      expect(day).toBe('Saturday');
     });
+  });
 
-    describe('get day difference', () => {
-      it('should return 7', () => {
-        const firstDay = new Date('07/01/2016');
-        const secondDay = new Date('07/08/2016');
-        const difference = gl.utils.getDayDifference(firstDay, secondDay);
-        expect(difference).toBe(7);
-      });
+  describe('get day difference', () => {
+    it('should return 7', () => {
+      const firstDay = new Date('07/01/2016');
+      const secondDay = new Date('07/08/2016');
+      const difference = gl.utils.getDayDifference(firstDay, secondDay);
+      expect(difference).toBe(7);
+    });
 
-      it('should return 31', () => {
-        const firstDay = new Date('07/01/2016');
-        const secondDay = new Date('08/01/2016');
-        const difference = gl.utils.getDayDifference(firstDay, secondDay);
-        expect(difference).toBe(31);
-      });
+    it('should return 31', () => {
+      const firstDay = new Date('07/01/2016');
+      const secondDay = new Date('08/01/2016');
+      const difference = gl.utils.getDayDifference(firstDay, secondDay);
+      expect(difference).toBe(31);
+    });
 
-      it('should return 365', () => {
-        const firstDay = new Date('07/02/2015');
-        const secondDay = new Date('07/01/2016');
-        const difference = gl.utils.getDayDifference(firstDay, secondDay);
-        expect(difference).toBe(365);
-      });
+    it('should return 365', () => {
+      const firstDay = new Date('07/02/2015');
+      const secondDay = new Date('07/01/2016');
+      const difference = gl.utils.getDayDifference(firstDay, secondDay);
+      expect(difference).toBe(365);
     });
   });
-})();
+});
diff --git a/spec/javascripts/diff_comments_store_spec.js b/spec/javascripts/diff_comments_store_spec.js
index 84cf98c930a..66ece7e4f41 100644
--- a/spec/javascripts/diff_comments_store_spec.js
+++ b/spec/javascripts/diff_comments_store_spec.js
@@ -5,129 +5,127 @@ require('~/diff_notes/models/discussion');
 require('~/diff_notes/models/note');
 require('~/diff_notes/stores/comments');
 
-(() => {
-  function createDiscussion(noteId = 1, resolved = true) {
-    CommentsStore.create({
-      discussionId: 'a',
-      noteId,
-      canResolve: true,
-      resolved,
-      resolvedBy: 'test',
-      authorName: 'test',
-      authorAvatar: 'test',
-      noteTruncated: 'test...',
-    });
-  }
-
-  beforeEach(() => {
-    CommentsStore.state = {};
+function createDiscussion(noteId = 1, resolved = true) {
+  CommentsStore.create({
+    discussionId: 'a',
+    noteId,
+    canResolve: true,
+    resolved,
+    resolvedBy: 'test',
+    authorName: 'test',
+    authorAvatar: 'test',
+    noteTruncated: 'test...',
   });
+}
 
-  describe('New discussion', () => {
-    it('creates new discussion', () => {
-      expect(Object.keys(CommentsStore.state).length).toBe(0);
-      createDiscussion();
-      expect(Object.keys(CommentsStore.state).length).toBe(1);
-    });
+beforeEach(() => {
+  CommentsStore.state = {};
+});
 
-    it('creates new note in discussion', () => {
-      createDiscussion();
-      createDiscussion(2);
+describe('New discussion', () => {
+  it('creates new discussion', () => {
+    expect(Object.keys(CommentsStore.state).length).toBe(0);
+    createDiscussion();
+    expect(Object.keys(CommentsStore.state).length).toBe(1);
+  });
 
-      const discussion = CommentsStore.state['a'];
-      expect(Object.keys(discussion.notes).length).toBe(2);
-    });
+  it('creates new note in discussion', () => {
+    createDiscussion();
+    createDiscussion(2);
+
+    const discussion = CommentsStore.state['a'];
+    expect(Object.keys(discussion.notes).length).toBe(2);
   });
+});
 
-  describe('Get note', () => {
-    beforeEach(() => {
-      expect(Object.keys(CommentsStore.state).length).toBe(0);
-      createDiscussion();
-    });
+describe('Get note', () => {
+  beforeEach(() => {
+    expect(Object.keys(CommentsStore.state).length).toBe(0);
+    createDiscussion();
+  });
 
-    it('gets note by ID', () => {
-      const note = CommentsStore.get('a', 1);
-      expect(note).toBeDefined();
-      expect(note.id).toBe(1);
-    });
+  it('gets note by ID', () => {
+    const note = CommentsStore.get('a', 1);
+    expect(note).toBeDefined();
+    expect(note.id).toBe(1);
   });
+});
 
-  describe('Delete discussion', () => {
-    beforeEach(() => {
-      expect(Object.keys(CommentsStore.state).length).toBe(0);
-      createDiscussion();
-    });
+describe('Delete discussion', () => {
+  beforeEach(() => {
+    expect(Object.keys(CommentsStore.state).length).toBe(0);
+    createDiscussion();
+  });
 
-    it('deletes discussion by ID', () => {
-      CommentsStore.delete('a', 1);
-      expect(Object.keys(CommentsStore.state).length).toBe(0);
-    });
+  it('deletes discussion by ID', () => {
+    CommentsStore.delete('a', 1);
+    expect(Object.keys(CommentsStore.state).length).toBe(0);
+  });
 
-    it('deletes discussion when no more notes', () => {
-      createDiscussion();
-      createDiscussion(2);
-      expect(Object.keys(CommentsStore.state).length).toBe(1);
-      expect(Object.keys(CommentsStore.state['a'].notes).length).toBe(2);
+  it('deletes discussion when no more notes', () => {
+    createDiscussion();
+    createDiscussion(2);
+    expect(Object.keys(CommentsStore.state).length).toBe(1);
+    expect(Object.keys(CommentsStore.state['a'].notes).length).toBe(2);
 
-      CommentsStore.delete('a', 1);
-      CommentsStore.delete('a', 2);
-      expect(Object.keys(CommentsStore.state).length).toBe(0);
-    });
+    CommentsStore.delete('a', 1);
+    CommentsStore.delete('a', 2);
+    expect(Object.keys(CommentsStore.state).length).toBe(0);
   });
+});
 
-  describe('Update note', () => {
-    beforeEach(() => {
-      expect(Object.keys(CommentsStore.state).length).toBe(0);
-      createDiscussion();
-    });
+describe('Update note', () => {
+  beforeEach(() => {
+    expect(Object.keys(CommentsStore.state).length).toBe(0);
+    createDiscussion();
+  });
 
-    it('updates note to be unresolved', () => {
-      CommentsStore.update('a', 1, false, 'test');
+  it('updates note to be unresolved', () => {
+    CommentsStore.update('a', 1, false, 'test');
 
-      const note = CommentsStore.get('a', 1);
-      expect(note.resolved).toBe(false);
-    });
+    const note = CommentsStore.get('a', 1);
+    expect(note.resolved).toBe(false);
   });
+});
 
-  describe('Discussion resolved', () => {
-    beforeEach(() => {
-      expect(Object.keys(CommentsStore.state).length).toBe(0);
-      createDiscussion();
-    });
+describe('Discussion resolved', () => {
+  beforeEach(() => {
+    expect(Object.keys(CommentsStore.state).length).toBe(0);
+    createDiscussion();
+  });
 
-    it('is resolved with single note', () => {
-      const discussion = CommentsStore.state['a'];
-      expect(discussion.isResolved()).toBe(true);
-    });
+  it('is resolved with single note', () => {
+    const discussion = CommentsStore.state['a'];
+    expect(discussion.isResolved()).toBe(true);
+  });
 
-    it('is unresolved with 2 notes', () => {
-      const discussion = CommentsStore.state['a'];
-      createDiscussion(2, false);
+  it('is unresolved with 2 notes', () => {
+    const discussion = CommentsStore.state['a'];
+    createDiscussion(2, false);
 
-      expect(discussion.isResolved()).toBe(false);
-    });
+    expect(discussion.isResolved()).toBe(false);
+  });
 
-    it('is resolved with 2 notes', () => {
-      const discussion = CommentsStore.state['a'];
-      createDiscussion(2);
+  it('is resolved with 2 notes', () => {
+    const discussion = CommentsStore.state['a'];
+    createDiscussion(2);
 
-      expect(discussion.isResolved()).toBe(true);
-    });
+    expect(discussion.isResolved()).toBe(true);
+  });
 
-    it('resolve all notes', () => {
-      const discussion = CommentsStore.state['a'];
-      createDiscussion(2, false);
+  it('resolve all notes', () => {
+    const discussion = CommentsStore.state['a'];
+    createDiscussion(2, false);
 
-      discussion.resolveAllNotes();
-      expect(discussion.isResolved()).toBe(true);
-    });
+    discussion.resolveAllNotes();
+    expect(discussion.isResolved()).toBe(true);
+  });
 
-    it('unresolve all notes', () => {
-      const discussion = CommentsStore.state['a'];
-      createDiscussion(2);
+  it('unresolve all notes', () => {
+    const discussion = CommentsStore.state['a'];
+    createDiscussion(2);
 
-      discussion.unResolveAllNotes();
-      expect(discussion.isResolved()).toBe(false);
-    });
+    discussion.unResolveAllNotes();
+    expect(discussion.isResolved()).toBe(false);
   });
-})();
+});
diff --git a/spec/javascripts/filtered_search/dropdown_user_spec.js b/spec/javascripts/filtered_search/dropdown_user_spec.js
index c16f77c53a2..1893ebc5c51 100644
--- a/spec/javascripts/filtered_search/dropdown_user_spec.js
+++ b/spec/javascripts/filtered_search/dropdown_user_spec.js
@@ -3,69 +3,67 @@ require('~/filtered_search/filtered_search_tokenizer');
 require('~/filtered_search/filtered_search_dropdown');
 require('~/filtered_search/dropdown_user');
 
-(() => {
-  describe('Dropdown User', () => {
-    describe('getSearchInput', () => {
-      let dropdownUser;
+describe('Dropdown User', () => {
+  describe('getSearchInput', () => {
+    let dropdownUser;
 
-      beforeEach(() => {
-        spyOn(gl.DropdownUser.prototype, 'bindEvents').and.callFake(() => {});
-        spyOn(gl.DropdownUser.prototype, 'getProjectId').and.callFake(() => {});
-        spyOn(gl.DropdownUtils, 'getSearchInput').and.callFake(() => {});
+    beforeEach(() => {
+      spyOn(gl.DropdownUser.prototype, 'bindEvents').and.callFake(() => {});
+      spyOn(gl.DropdownUser.prototype, 'getProjectId').and.callFake(() => {});
+      spyOn(gl.DropdownUtils, 'getSearchInput').and.callFake(() => {});
 
-        dropdownUser = new gl.DropdownUser();
-      });
-
-      it('should not return the double quote found in value', () => {
-        spyOn(gl.FilteredSearchTokenizer, 'processTokens').and.returnValue({
-          lastToken: '"johnny appleseed',
-        });
+      dropdownUser = new gl.DropdownUser();
+    });
 
-        expect(dropdownUser.getSearchInput()).toBe('johnny appleseed');
+    it('should not return the double quote found in value', () => {
+      spyOn(gl.FilteredSearchTokenizer, 'processTokens').and.returnValue({
+        lastToken: '"johnny appleseed',
       });
 
-      it('should not return the single quote found in value', () => {
-        spyOn(gl.FilteredSearchTokenizer, 'processTokens').and.returnValue({
-          lastToken: '\'larry boy',
-        });
+      expect(dropdownUser.getSearchInput()).toBe('johnny appleseed');
+    });
 
-        expect(dropdownUser.getSearchInput()).toBe('larry boy');
+    it('should not return the single quote found in value', () => {
+      spyOn(gl.FilteredSearchTokenizer, 'processTokens').and.returnValue({
+        lastToken: '\'larry boy',
       });
+
+      expect(dropdownUser.getSearchInput()).toBe('larry boy');
     });
+  });
 
-    describe('config droplabAjaxFilter\'s endpoint', () => {
-      beforeEach(() => {
-        spyOn(gl.DropdownUser.prototype, 'bindEvents').and.callFake(() => {});
-        spyOn(gl.DropdownUser.prototype, 'getProjectId').and.callFake(() => {});
-      });
+  describe('config droplabAjaxFilter\'s endpoint', () => {
+    beforeEach(() => {
+      spyOn(gl.DropdownUser.prototype, 'bindEvents').and.callFake(() => {});
+      spyOn(gl.DropdownUser.prototype, 'getProjectId').and.callFake(() => {});
+    });
 
-      it('should return endpoint', () => {
-        window.gon = {
-          relative_url_root: '',
-        };
-        const dropdown = new gl.DropdownUser();
+    it('should return endpoint', () => {
+      window.gon = {
+        relative_url_root: '',
+      };
+      const dropdown = new gl.DropdownUser();
 
-        expect(dropdown.config.droplabAjaxFilter.endpoint).toBe('/autocomplete/users.json');
-      });
+      expect(dropdown.config.droplabAjaxFilter.endpoint).toBe('/autocomplete/users.json');
+    });
 
-      it('should return endpoint when relative_url_root is undefined', () => {
-        const dropdown = new gl.DropdownUser();
+    it('should return endpoint when relative_url_root is undefined', () => {
+      const dropdown = new gl.DropdownUser();
 
-        expect(dropdown.config.droplabAjaxFilter.endpoint).toBe('/autocomplete/users.json');
-      });
+      expect(dropdown.config.droplabAjaxFilter.endpoint).toBe('/autocomplete/users.json');
+    });
 
-      it('should return endpoint with relative url when available', () => {
-        window.gon = {
-          relative_url_root: '/gitlab_directory',
-        };
-        const dropdown = new gl.DropdownUser();
+    it('should return endpoint with relative url when available', () => {
+      window.gon = {
+        relative_url_root: '/gitlab_directory',
+      };
+      const dropdown = new gl.DropdownUser();
 
-        expect(dropdown.config.droplabAjaxFilter.endpoint).toBe('/gitlab_directory/autocomplete/users.json');
-      });
+      expect(dropdown.config.droplabAjaxFilter.endpoint).toBe('/gitlab_directory/autocomplete/users.json');
+    });
 
-      afterEach(() => {
-        window.gon = {};
-      });
+    afterEach(() => {
+      window.gon = {};
     });
   });
-})();
+});
diff --git a/spec/javascripts/filtered_search/dropdown_utils_spec.js b/spec/javascripts/filtered_search/dropdown_utils_spec.js
index e6538020896..c820c955172 100644
--- a/spec/javascripts/filtered_search/dropdown_utils_spec.js
+++ b/spec/javascripts/filtered_search/dropdown_utils_spec.js
@@ -3,308 +3,306 @@ require('~/filtered_search/dropdown_utils');
 require('~/filtered_search/filtered_search_tokenizer');
 require('~/filtered_search/filtered_search_dropdown_manager');
 
-(() => {
-  describe('Dropdown Utils', () => {
-    describe('getEscapedText', () => {
-      it('should return same word when it has no space', () => {
-        const escaped = gl.DropdownUtils.getEscapedText('textWithoutSpace');
-        expect(escaped).toBe('textWithoutSpace');
-      });
+describe('Dropdown Utils', () => {
+  describe('getEscapedText', () => {
+    it('should return same word when it has no space', () => {
+      const escaped = gl.DropdownUtils.getEscapedText('textWithoutSpace');
+      expect(escaped).toBe('textWithoutSpace');
+    });
 
-      it('should escape with double quotes', () => {
-        let escaped = gl.DropdownUtils.getEscapedText('text with space');
-        expect(escaped).toBe('"text with space"');
+    it('should escape with double quotes', () => {
+      let escaped = gl.DropdownUtils.getEscapedText('text with space');
+      expect(escaped).toBe('"text with space"');
 
-        escaped = gl.DropdownUtils.getEscapedText('won\'t fix');
-        expect(escaped).toBe('"won\'t fix"');
-      });
+      escaped = gl.DropdownUtils.getEscapedText('won\'t fix');
+      expect(escaped).toBe('"won\'t fix"');
+    });
 
-      it('should escape with single quotes', () => {
-        const escaped = gl.DropdownUtils.getEscapedText('won"t fix');
-        expect(escaped).toBe('\'won"t fix\'');
-      });
+    it('should escape with single quotes', () => {
+      const escaped = gl.DropdownUtils.getEscapedText('won"t fix');
+      expect(escaped).toBe('\'won"t fix\'');
+    });
 
-      it('should escape with single quotes by default', () => {
-        const escaped = gl.DropdownUtils.getEscapedText('won"t\' fix');
-        expect(escaped).toBe('\'won"t\' fix\'');
-      });
+    it('should escape with single quotes by default', () => {
+      const escaped = gl.DropdownUtils.getEscapedText('won"t\' fix');
+      expect(escaped).toBe('\'won"t\' fix\'');
     });
+  });
 
-    describe('filterWithSymbol', () => {
-      let input;
-      const item = {
-        title: '@root',
-      };
+  describe('filterWithSymbol', () => {
+    let input;
+    const item = {
+      title: '@root',
+    };
 
-      beforeEach(() => {
-        setFixtures(`
-          <input type="text" id="test" />
-        `);
+    beforeEach(() => {
+      setFixtures(`
+        <input type="text" id="test" />
+      `);
 
-        input = document.getElementById('test');
-      });
+      input = document.getElementById('test');
+    });
 
-      it('should filter without symbol', () => {
-        input.value = 'roo';
+    it('should filter without symbol', () => {
+      input.value = 'roo';
 
-        const updatedItem = gl.DropdownUtils.filterWithSymbol('@', input, item);
-        expect(updatedItem.droplab_hidden).toBe(false);
-      });
+      const updatedItem = gl.DropdownUtils.filterWithSymbol('@', input, item);
+      expect(updatedItem.droplab_hidden).toBe(false);
+    });
 
-      it('should filter with symbol', () => {
-        input.value = '@roo';
+    it('should filter with symbol', () => {
+      input.value = '@roo';
 
-        const updatedItem = gl.DropdownUtils.filterWithSymbol('@', input, item);
-        expect(updatedItem.droplab_hidden).toBe(false);
-      });
+      const updatedItem = gl.DropdownUtils.filterWithSymbol('@', input, item);
+      expect(updatedItem.droplab_hidden).toBe(false);
+    });
 
-      describe('filters multiple word title', () => {
-        const multipleWordItem = {
-          title: 'Community Contributions',
-        };
+    describe('filters multiple word title', () => {
+      const multipleWordItem = {
+        title: 'Community Contributions',
+      };
 
-        it('should filter with double quote', () => {
-          input.value = '"';
+      it('should filter with double quote', () => {
+        input.value = '"';
 
-          const updatedItem = gl.DropdownUtils.filterWithSymbol('~', input, multipleWordItem);
-          expect(updatedItem.droplab_hidden).toBe(false);
-        });
+        const updatedItem = gl.DropdownUtils.filterWithSymbol('~', input, multipleWordItem);
+        expect(updatedItem.droplab_hidden).toBe(false);
+      });
 
-        it('should filter with double quote and symbol', () => {
-          input.value = '~"';
+      it('should filter with double quote and symbol', () => {
+        input.value = '~"';
 
-          const updatedItem = gl.DropdownUtils.filterWithSymbol('~', input, multipleWordItem);
-          expect(updatedItem.droplab_hidden).toBe(false);
-        });
+        const updatedItem = gl.DropdownUtils.filterWithSymbol('~', input, multipleWordItem);
+        expect(updatedItem.droplab_hidden).toBe(false);
+      });
 
-        it('should filter with double quote and multiple words', () => {
-          input.value = '"community con';
+      it('should filter with double quote and multiple words', () => {
+        input.value = '"community con';
 
-          const updatedItem = gl.DropdownUtils.filterWithSymbol('~', input, multipleWordItem);
-          expect(updatedItem.droplab_hidden).toBe(false);
-        });
+        const updatedItem = gl.DropdownUtils.filterWithSymbol('~', input, multipleWordItem);
+        expect(updatedItem.droplab_hidden).toBe(false);
+      });
 
-        it('should filter with double quote, symbol and multiple words', () => {
-          input.value = '~"community con';
+      it('should filter with double quote, symbol and multiple words', () => {
+        input.value = '~"community con';
 
-          const updatedItem = gl.DropdownUtils.filterWithSymbol('~', input, multipleWordItem);
-          expect(updatedItem.droplab_hidden).toBe(false);
-        });
+        const updatedItem = gl.DropdownUtils.filterWithSymbol('~', input, multipleWordItem);
+        expect(updatedItem.droplab_hidden).toBe(false);
+      });
 
-        it('should filter with single quote', () => {
-          input.value = '\'';
+      it('should filter with single quote', () => {
+        input.value = '\'';
 
-          const updatedItem = gl.DropdownUtils.filterWithSymbol('~', input, multipleWordItem);
-          expect(updatedItem.droplab_hidden).toBe(false);
-        });
+        const updatedItem = gl.DropdownUtils.filterWithSymbol('~', input, multipleWordItem);
+        expect(updatedItem.droplab_hidden).toBe(false);
+      });
 
-        it('should filter with single quote and symbol', () => {
-          input.value = '~\'';
+      it('should filter with single quote and symbol', () => {
+        input.value = '~\'';
 
-          const updatedItem = gl.DropdownUtils.filterWithSymbol('~', input, multipleWordItem);
-          expect(updatedItem.droplab_hidden).toBe(false);
-        });
+        const updatedItem = gl.DropdownUtils.filterWithSymbol('~', input, multipleWordItem);
+        expect(updatedItem.droplab_hidden).toBe(false);
+      });
 
-        it('should filter with single quote and multiple words', () => {
-          input.value = '\'community con';
+      it('should filter with single quote and multiple words', () => {
+        input.value = '\'community con';
 
-          const updatedItem = gl.DropdownUtils.filterWithSymbol('~', input, multipleWordItem);
-          expect(updatedItem.droplab_hidden).toBe(false);
-        });
+        const updatedItem = gl.DropdownUtils.filterWithSymbol('~', input, multipleWordItem);
+        expect(updatedItem.droplab_hidden).toBe(false);
+      });
 
-        it('should filter with single quote, symbol and multiple words', () => {
-          input.value = '~\'community con';
+      it('should filter with single quote, symbol and multiple words', () => {
+        input.value = '~\'community con';
 
-          const updatedItem = gl.DropdownUtils.filterWithSymbol('~', input, multipleWordItem);
-          expect(updatedItem.droplab_hidden).toBe(false);
-        });
+        const updatedItem = gl.DropdownUtils.filterWithSymbol('~', input, multipleWordItem);
+        expect(updatedItem.droplab_hidden).toBe(false);
       });
     });
+  });
 
-    describe('filterHint', () => {
-      let input;
-
-      beforeEach(() => {
-        setFixtures(`
-          <ul class="tokens-container">
-            <li class="input-token">
-              <input class="filtered-search" type="text" id="test" />
-            </li>
-          </ul>
-        `);
-
-        input = document.getElementById('test');
-      });
+  describe('filterHint', () => {
+    let input;
 
-      it('should filter', () => {
-        input.value = 'l';
-        let updatedItem = gl.DropdownUtils.filterHint(input, {
-          hint: 'label',
-        });
-        expect(updatedItem.droplab_hidden).toBe(false);
+    beforeEach(() => {
+      setFixtures(`
+        <ul class="tokens-container">
+          <li class="input-token">
+            <input class="filtered-search" type="text" id="test" />
+          </li>
+        </ul>
+      `);
 
-        input.value = 'o';
-        updatedItem = gl.DropdownUtils.filterHint(input, {
-          hint: 'label',
-        });
-        expect(updatedItem.droplab_hidden).toBe(true);
-      });
+      input = document.getElementById('test');
+    });
 
-      it('should return droplab_hidden false when item has no hint', () => {
-        const updatedItem = gl.DropdownUtils.filterHint(input, {}, '');
-        expect(updatedItem.droplab_hidden).toBe(false);
+    it('should filter', () => {
+      input.value = 'l';
+      let updatedItem = gl.DropdownUtils.filterHint(input, {
+        hint: 'label',
       });
+      expect(updatedItem.droplab_hidden).toBe(false);
 
-      it('should allow multiple if item.type is array', () => {
-        input.value = 'label:~first la';
-        const updatedItem = gl.DropdownUtils.filterHint(input, {
-          hint: 'label',
-          type: 'array',
-        });
-        expect(updatedItem.droplab_hidden).toBe(false);
+      input.value = 'o';
+      updatedItem = gl.DropdownUtils.filterHint(input, {
+        hint: 'label',
       });
+      expect(updatedItem.droplab_hidden).toBe(true);
+    });
 
-      it('should prevent multiple if item.type is not array', () => {
-        input.value = 'milestone:~first mile';
-        let updatedItem = gl.DropdownUtils.filterHint(input, {
-          hint: 'milestone',
-        });
-        expect(updatedItem.droplab_hidden).toBe(true);
+    it('should return droplab_hidden false when item has no hint', () => {
+      const updatedItem = gl.DropdownUtils.filterHint(input, {}, '');
+      expect(updatedItem.droplab_hidden).toBe(false);
+    });
 
-        updatedItem = gl.DropdownUtils.filterHint(input, {
-          hint: 'milestone',
-          type: 'string',
-        });
-        expect(updatedItem.droplab_hidden).toBe(true);
+    it('should allow multiple if item.type is array', () => {
+      input.value = 'label:~first la';
+      const updatedItem = gl.DropdownUtils.filterHint(input, {
+        hint: 'label',
+        type: 'array',
       });
+      expect(updatedItem.droplab_hidden).toBe(false);
     });
 
-    describe('setDataValueIfSelected', () => {
-      beforeEach(() => {
-        spyOn(gl.FilteredSearchDropdownManager, 'addWordToInput')
-          .and.callFake(() => {});
+    it('should prevent multiple if item.type is not array', () => {
+      input.value = 'milestone:~first mile';
+      let updatedItem = gl.DropdownUtils.filterHint(input, {
+        hint: 'milestone',
       });
+      expect(updatedItem.droplab_hidden).toBe(true);
 
-      it('calls addWordToInput when dataValue exists', () => {
-        const selected = {
-          getAttribute: () => 'value',
-        };
-
-        gl.DropdownUtils.setDataValueIfSelected(null, selected);
-        expect(gl.FilteredSearchDropdownManager.addWordToInput.calls.count()).toEqual(1);
+      updatedItem = gl.DropdownUtils.filterHint(input, {
+        hint: 'milestone',
+        type: 'string',
       });
+      expect(updatedItem.droplab_hidden).toBe(true);
+    });
+  });
 
-      it('returns true when dataValue exists', () => {
-        const selected = {
-          getAttribute: () => 'value',
-        };
+  describe('setDataValueIfSelected', () => {
+    beforeEach(() => {
+      spyOn(gl.FilteredSearchDropdownManager, 'addWordToInput')
+        .and.callFake(() => {});
+    });
 
-        const result = gl.DropdownUtils.setDataValueIfSelected(null, selected);
-        expect(result).toBe(true);
-      });
+    it('calls addWordToInput when dataValue exists', () => {
+      const selected = {
+        getAttribute: () => 'value',
+      };
 
-      it('returns false when dataValue does not exist', () => {
-        const selected = {
-          getAttribute: () => null,
-        };
+      gl.DropdownUtils.setDataValueIfSelected(null, selected);
+      expect(gl.FilteredSearchDropdownManager.addWordToInput.calls.count()).toEqual(1);
+    });
 
-        const result = gl.DropdownUtils.setDataValueIfSelected(null, selected);
-        expect(result).toBe(false);
-      });
+    it('returns true when dataValue exists', () => {
+      const selected = {
+        getAttribute: () => 'value',
+      };
+
+      const result = gl.DropdownUtils.setDataValueIfSelected(null, selected);
+      expect(result).toBe(true);
     });
 
-    describe('getInputSelectionPosition', () => {
-      describe('word with trailing spaces', () => {
-        const value = 'label:none ';
+    it('returns false when dataValue does not exist', () => {
+      const selected = {
+        getAttribute: () => null,
+      };
+
+      const result = gl.DropdownUtils.setDataValueIfSelected(null, selected);
+      expect(result).toBe(false);
+    });
+  });
 
-        it('should return selectionStart when cursor is at the trailing space', () => {
-          const { left, right } = gl.DropdownUtils.getInputSelectionPosition({
-            selectionStart: 11,
-            value,
-          });
+  describe('getInputSelectionPosition', () => {
+    describe('word with trailing spaces', () => {
+      const value = 'label:none ';
 
-          expect(left).toBe(11);
-          expect(right).toBe(11);
+      it('should return selectionStart when cursor is at the trailing space', () => {
+        const { left, right } = gl.DropdownUtils.getInputSelectionPosition({
+          selectionStart: 11,
+          value,
         });
 
-        it('should return input when cursor is at the start of input', () => {
-          const { left, right } = gl.DropdownUtils.getInputSelectionPosition({
-            selectionStart: 0,
-            value,
-          });
+        expect(left).toBe(11);
+        expect(right).toBe(11);
+      });
 
-          expect(left).toBe(0);
-          expect(right).toBe(10);
+      it('should return input when cursor is at the start of input', () => {
+        const { left, right } = gl.DropdownUtils.getInputSelectionPosition({
+          selectionStart: 0,
+          value,
         });
 
-        it('should return input when cursor is at the middle of input', () => {
-          const { left, right } = gl.DropdownUtils.getInputSelectionPosition({
-            selectionStart: 7,
-            value,
-          });
+        expect(left).toBe(0);
+        expect(right).toBe(10);
+      });
 
-          expect(left).toBe(0);
-          expect(right).toBe(10);
+      it('should return input when cursor is at the middle of input', () => {
+        const { left, right } = gl.DropdownUtils.getInputSelectionPosition({
+          selectionStart: 7,
+          value,
         });
 
-        it('should return input when cursor is at the end of input', () => {
-          const { left, right } = gl.DropdownUtils.getInputSelectionPosition({
-            selectionStart: 10,
-            value,
-          });
+        expect(left).toBe(0);
+        expect(right).toBe(10);
+      });
 
-          expect(left).toBe(0);
-          expect(right).toBe(10);
+      it('should return input when cursor is at the end of input', () => {
+        const { left, right } = gl.DropdownUtils.getInputSelectionPosition({
+          selectionStart: 10,
+          value,
         });
-      });
 
-      describe('multiple words', () => {
-        const value = 'label:~"Community Contribution"';
+        expect(left).toBe(0);
+        expect(right).toBe(10);
+      });
+    });
 
-        it('should return input when cursor is after the first word', () => {
-          const { left, right } = gl.DropdownUtils.getInputSelectionPosition({
-            selectionStart: 17,
-            value,
-          });
+    describe('multiple words', () => {
+      const value = 'label:~"Community Contribution"';
 
-          expect(left).toBe(0);
-          expect(right).toBe(31);
+      it('should return input when cursor is after the first word', () => {
+        const { left, right } = gl.DropdownUtils.getInputSelectionPosition({
+          selectionStart: 17,
+          value,
         });
 
-        it('should return input when cursor is before the second word', () => {
-          const { left, right } = gl.DropdownUtils.getInputSelectionPosition({
-            selectionStart: 18,
-            value,
-          });
+        expect(left).toBe(0);
+        expect(right).toBe(31);
+      });
 
-          expect(left).toBe(0);
-          expect(right).toBe(31);
+      it('should return input when cursor is before the second word', () => {
+        const { left, right } = gl.DropdownUtils.getInputSelectionPosition({
+          selectionStart: 18,
+          value,
         });
-      });
 
-      describe('incomplete multiple words', () => {
-        const value = 'label:~"Community Contribution';
+        expect(left).toBe(0);
+        expect(right).toBe(31);
+      });
+    });
 
-        it('should return entire input when cursor is at the start of input', () => {
-          const { left, right } = gl.DropdownUtils.getInputSelectionPosition({
-            selectionStart: 0,
-            value,
-          });
+    describe('incomplete multiple words', () => {
+      const value = 'label:~"Community Contribution';
 
-          expect(left).toBe(0);
-          expect(right).toBe(30);
+      it('should return entire input when cursor is at the start of input', () => {
+        const { left, right } = gl.DropdownUtils.getInputSelectionPosition({
+          selectionStart: 0,
+          value,
         });
 
-        it('should return entire input when cursor is at the end of input', () => {
-          const { left, right } = gl.DropdownUtils.getInputSelectionPosition({
-            selectionStart: 30,
-            value,
-          });
+        expect(left).toBe(0);
+        expect(right).toBe(30);
+      });
 
-          expect(left).toBe(0);
-          expect(right).toBe(30);
+      it('should return entire input when cursor is at the end of input', () => {
+        const { left, right } = gl.DropdownUtils.getInputSelectionPosition({
+          selectionStart: 30,
+          value,
         });
+
+        expect(left).toBe(0);
+        expect(right).toBe(30);
       });
     });
   });
-})();
+});