Exported JS classes as modules

app/assets/javascripts/boards/components/board_sidebar.js

 /* eslint-disable comma-dangle, space-before-function-paren, no-new */
 /* global MilestoneSelect */
-/* global Sidebar */
 
 import Vue from 'vue';
 import Flash from '../../flash';
+import Sidebar from '../../right_sidebar';
 import eventHub from '../../sidebar/event_hub';
 import assigneeTitle from '../../sidebar/components/assignees/assignee_title';
 import assignees from '../../sidebar/components/assignees/assignees';

app/assets/javascripts/dispatcher.js

@@ -11,7 +11,7 @@ import NotificationsForm from './notifications_form';
 import notificationsDropdown from './notifications_dropdown';
 import groupAvatar from './group_avatar';
 import GroupLabelSubscription from './group_label_subscription';
-/* global LineHighlighter */
+import LineHighlighter from './line_highlighter';
 import BuildArtifacts from './build_artifacts';
 import CILintEditor from './ci_lint_editor';
 import groupsSelect from './groups_select';
@@ -21,7 +21,7 @@ import NamespaceSelect from './namespace_select';
 import NewCommitForm from './new_commit_form';
 import Project from './project';
 import projectAvatar from './project_avatar';
-/* global MergeRequest */
+import MergeRequest from './merge_request';
 import Compare from './compare';
 import initCompareAutocomplete from './compare_autocomplete';
 import ProjectFindFile from './project_find_file';
@@ -29,7 +29,7 @@ import ProjectNew from './project_new';
 import projectImport from './project_import';
 import Labels from './labels';
 import LabelManager from './label_manager';
-/* global Sidebar */
+import Sidebar from './right_sidebar';
 import IssuableTemplateSelectors from './templates/issuable_template_selectors';
 import Flash from './flash';
 import CommitsList from './commits';

app/assets/javascripts/init_issuable_sidebar.js

@@ -2,7 +2,7 @@
 /* global MilestoneSelect */
 import LabelsSelect from './labels_select';
 import IssuableContext from './issuable_context';
-/* global Sidebar */
+import Sidebar from './right_sidebar';
 
 import DueDateSelectors from './due_date_select';
 
@@ -15,5 +15,5 @@ export default () => {
   new LabelsSelect();
   new IssuableContext(sidebarOptions.currentUser);
   new DueDateSelectors();
-  window.sidebar = new Sidebar();
+  Sidebar.initialize();
 };

app/assets/javascripts/line_highlighter.js

@@ -175,4 +175,4 @@ LineHighlighter.prototype.__setLocationHash__ = function(value) {
   }, document.title, value);
 };
 
-window.LineHighlighter = LineHighlighter;
+export default LineHighlighter;

app/assets/javascripts/main.js

@@ -45,14 +45,12 @@ import './layout_nav';
 import LazyLoader from './lazy_loader';
 import './line_highlighter';
 import initLogoAnimation from './logo';
-import './merge_request';
 import './merge_request_tabs';
 import './milestone_select';
 import './notes';
 import './preview_markdown';
 import './projects_dropdown';
 import './render_gfm';
-import './right_sidebar';
 import initBreadcrumbs from './breadcrumb';
 
 import './dispatcher';

app/assets/javascripts/merge_request.js

 /* eslint-disable func-names, space-before-function-paren, no-var, prefer-rest-params, wrap-iife, quotes, no-underscore-dangle, one-var, one-var-declaration-per-line, consistent-return, dot-notation, quote-props, comma-dangle, object-shorthand, max-len, prefer-arrow-callback */
-/* global MergeRequestTabs */
 
 import 'vendor/jquery.waitforimages';
 import TaskList from './task_list';
@@ -7,142 +6,138 @@ import MergeRequestTabs from './merge_request_tabs';
 import IssuablesHelper from './helpers/issuables_helper';
 import { addDelimiter } from './lib/utils/text_utility';
 
-(function() {
-  this.MergeRequest = (function() {
-    function MergeRequest(opts) {
-      // Initialize MergeRequest behavior
-      //
-      // Options:
-      //   action - String, current controller action
-      //
-      this.opts = opts != null ? opts : {};
-      this.submitNoteForm = this.submitNoteForm.bind(this);
-      this.$el = $('.merge-request');
-      this.$('.show-all-commits').on('click', (function(_this) {
-        return function() {
-          return _this.showAllCommits();
-        };
-      })(this));
-
-      this.initTabs();
-      this.initMRBtnListeners();
-      this.initCommitMessageListeners();
-      this.closeReopenReportToggle = IssuablesHelper.initCloseReopenReport();
-
-      if ($("a.btn-close").length) {
-        this.taskList = new TaskList({
-          dataType: 'merge_request',
-          fieldName: 'description',
-          selector: '.detail-page-description',
-          onSuccess: (result) => {
-            document.querySelector('#task_status').innerText = result.task_status;
-            document.querySelector('#task_status_short').innerText = result.task_status_short;
-          }
-        });
-      }
-    }
-
-    // Local jQuery finder
-    MergeRequest.prototype.$ = function(selector) {
-      return this.$el.find(selector);
+function MergeRequest(opts) {
+  // Initialize MergeRequest behavior
+  //
+  // Options:
+  //   action - String, current controller action
+  //
+  this.opts = opts != null ? opts : {};
+  this.submitNoteForm = this.submitNoteForm.bind(this);
+  this.$el = $('.merge-request');
+  this.$('.show-all-commits').on('click', (function(_this) {
+    return function() {
+      return _this.showAllCommits();
     };
-
-    MergeRequest.prototype.initTabs = function() {
-      if (window.mrTabs) {
-        window.mrTabs.unbindEvents();
+  })(this));
+
+  this.initTabs();
+  this.initMRBtnListeners();
+  this.initCommitMessageListeners();
+  this.closeReopenReportToggle = IssuablesHelper.initCloseReopenReport();
+
+  if ($("a.btn-close").length) {
+    this.taskList = new TaskList({
+      dataType: 'merge_request',
+      fieldName: 'description',
+      selector: '.detail-page-description',
+      onSuccess: (result) => {
+        document.querySelector('#task_status').innerText = result.task_status;
+        document.querySelector('#task_status_short').innerText = result.task_status_short;
       }
-      window.mrTabs = new MergeRequestTabs(this.opts);
-    };
-
-    MergeRequest.prototype.showAllCommits = function() {
-      this.$('.first-commits').remove();
-      return this.$('.all-commits').removeClass('hide');
-    };
-
-    MergeRequest.prototype.initMRBtnListeners = function() {
-      var _this;
-      _this = this;
-      return $('a.btn-close, a.btn-reopen').on('click', function(e) {
-        var $this, shouldSubmit;
-        $this = $(this);
-        shouldSubmit = $this.hasClass('btn-comment');
-        if (shouldSubmit && $this.data('submitted')) {
-          return;
-        }
-
-        if (this.closeReopenReportToggle) this.closeReopenReportToggle.setDisable();
-
-        if (shouldSubmit) {
-          if ($this.hasClass('btn-comment-and-close') || $this.hasClass('btn-comment-and-reopen')) {
-            e.preventDefault();
-            e.stopImmediatePropagation();
-
-            _this.submitNoteForm($this.closest('form'), $this);
-          }
-        }
-      });
-    };
-
-    MergeRequest.prototype.submitNoteForm = function(form, $button) {
-      var noteText;
-      noteText = form.find("textarea.js-note-text").val();
-      if (noteText.trim().length > 0) {
-        form.submit();
-        $button.data('submitted', true);
-        return $button.trigger('click');
-      }
-    };
-
-    MergeRequest.prototype.initCommitMessageListeners = function() {
-      $(document).on('click', 'a.js-with-description-link', function(e) {
-        var textarea = $('textarea.js-commit-message');
-        e.preventDefault();
+    });
+  }
+}
+
+// Local jQuery finder
+MergeRequest.prototype.$ = function(selector) {
+  return this.$el.find(selector);
+};
+
+MergeRequest.prototype.initTabs = function() {
+  if (window.mrTabs) {
+    window.mrTabs.unbindEvents();
+  }
+  window.mrTabs = new MergeRequestTabs(this.opts);
+};
+
+MergeRequest.prototype.showAllCommits = function() {
+  this.$('.first-commits').remove();
+  return this.$('.all-commits').removeClass('hide');
+};
+
+MergeRequest.prototype.initMRBtnListeners = function() {
+  var _this;
+  _this = this;
+  return $('a.btn-close, a.btn-reopen').on('click', function(e) {
+    var $this, shouldSubmit;
+    $this = $(this);
+    shouldSubmit = $this.hasClass('btn-comment');
+    if (shouldSubmit && $this.data('submitted')) {
+      return;
+    }
 
-        textarea.val(textarea.data('messageWithDescription'));
-        $('.js-with-description-hint').hide();
-        $('.js-without-description-hint').show();
-      });
+    if (this.closeReopenReportToggle) this.closeReopenReportToggle.setDisable();
 
-      $(document).on('click', 'a.js-without-description-link', function(e) {
-        var textarea = $('textarea.js-commit-message');
+    if (shouldSubmit) {
+      if ($this.hasClass('btn-comment-and-close') || $this.hasClass('btn-comment-and-reopen')) {
         e.preventDefault();
+        e.stopImmediatePropagation();
 
-        textarea.val(textarea.data('messageWithoutDescription'));
-        $('.js-with-description-hint').show();
-        $('.js-without-description-hint').hide();
-      });
-    };
-
-    MergeRequest.prototype.updateStatusText = function(classToRemove, classToAdd, newStatusText) {
-      $('.detail-page-header .status-box')
-        .removeClass(classToRemove)
-        .addClass(classToAdd)
-        .find('span')
-        .text(newStatusText);
-    };
-
-    MergeRequest.prototype.decreaseCounter = function(by = 1) {
-      const $el = $('.nav-links .js-merge-counter');
-      const count = Math.max((parseInt($el.text().replace(/[^\d]/, ''), 10) - by), 0);
-
-      $el.text(addDelimiter(count));
-    };
-
-    MergeRequest.prototype.hideCloseButton = function() {
-      const el = document.querySelector('.merge-request .js-issuable-actions');
-      const closeDropdownItem = el.querySelector('li.close-item');
-      if (closeDropdownItem) {
-        closeDropdownItem.classList.add('hidden');
-        // Selects the next dropdown item
-        el.querySelector('li.report-item').click();
-      } else {
-        // No dropdown just hide the Close button
-        el.querySelector('.btn-close').classList.add('hidden');
+        _this.submitNoteForm($this.closest('form'), $this);
       }
-      // Dropdown for mobile screen
-      el.querySelector('li.js-close-item').classList.add('hidden');
-    };
-
-    return MergeRequest;
-  })();
-}).call(window);
+    }
+  });
+};
+
+MergeRequest.prototype.submitNoteForm = function(form, $button) {
+  var noteText;
+  noteText = form.find("textarea.js-note-text").val();
+  if (noteText.trim().length > 0) {
+    form.submit();
+    $button.data('submitted', true);
+    return $button.trigger('click');
+  }
+};
+
+MergeRequest.prototype.initCommitMessageListeners = function() {
+  $(document).on('click', 'a.js-with-description-link', function(e) {
+    var textarea = $('textarea.js-commit-message');
+    e.preventDefault();
+
+    textarea.val(textarea.data('messageWithDescription'));
+    $('.js-with-description-hint').hide();
+    $('.js-without-description-hint').show();
+  });
+
+  $(document).on('click', 'a.js-without-description-link', function(e) {
+    var textarea = $('textarea.js-commit-message');
+    e.preventDefault();
+
+    textarea.val(textarea.data('messageWithoutDescription'));
+    $('.js-with-description-hint').show();
+    $('.js-without-description-hint').hide();
+  });
+};
+
+MergeRequest.prototype.updateStatusText = function(classToRemove, classToAdd, newStatusText) {
+  $('.detail-page-header .status-box')
+    .removeClass(classToRemove)
+    .addClass(classToAdd)
+    .find('span')
+    .text(newStatusText);
+};
+
+MergeRequest.prototype.decreaseCounter = function(by = 1) {
+  const $el = $('.nav-links .js-merge-counter');
+  const count = Math.max((parseInt($el.text().replace(/[^\d]/, ''), 10) - by), 0);
+
+  $el.text(addDelimiter(count));
+};
+
+MergeRequest.prototype.hideCloseButton = function() {
+  const el = document.querySelector('.merge-request .js-issuable-actions');
+  const closeDropdownItem = el.querySelector('li.close-item');
+  if (closeDropdownItem) {
+    closeDropdownItem.classList.add('hidden');
+    // Selects the next dropdown item
+    el.querySelector('li.report-item').click();
+  } else {
+    // No dropdown just hide the Close button
+    el.querySelector('.btn-close').classList.add('hidden');
+  }
+  // Dropdown for mobile screen
+  el.querySelector('li.js-close-item').classList.add('hidden');
+};
+
+export default MergeRequest;

app/assets/javascripts/repo/components/repo_preview.vue

 <script>
-/* global LineHighlighter */
 import { mapGetters } from 'vuex';
+import LineHighlighter from '../../line_highlighter';
 import syntaxHighlight from '../../syntax_highlight';
 
 export default {

app/assets/javascripts/shortcuts_issuable.js

 /* global Mousetrap */
-/* global sidebar */
 
 import _ from 'underscore';
 import 'mousetrap';
+import Sidebar from './right_sidebar';
 import ShortcutsNavigation from './shortcuts_navigation';
 import { CopyAsGFM } from './behaviors/copy_as_gfm';
 
@@ -69,7 +69,7 @@ export default class ShortcutsIssuable extends ShortcutsNavigation {
   }
 
   static openSidebarDropdown(name) {
-    sidebar.openDropdown(name);
+    Sidebar.instance.openDropdown(name);
     return false;
   }
 }

spec/javascripts/collapsed_sidebar_todo_spec.js

-/* global Sidebar */
 /* eslint-disable no-new */
 import _ from 'underscore';
-import '~/right_sidebar';
+import Sidebar from '~/right_sidebar';
 
 describe('Issuable right sidebar collapsed todo toggle', () => {
   const fixtureName = 'issues/open-issue.html.raw';

spec/javascripts/line_highlighter_spec.js

 /* eslint-disable space-before-function-paren, no-var, no-param-reassign, quotes, prefer-template, no-else-return, new-cap, dot-notation, no-return-assign, comma-dangle, no-new, one-var, one-var-declaration-per-line, jasmine/no-spec-dupes, no-underscore-dangle, max-len */
-/* global LineHighlighter */
 
-import '~/line_highlighter';
+import LineHighlighter from '~/line_highlighter';
 
 (function() {
   describe('LineHighlighter', function() {

spec/javascripts/merge_request_spec.js

 /* eslint-disable space-before-function-paren, no-return-assign */
-/* global MergeRequest */
 
-import '~/merge_request';
+import MergeRequest from '~/merge_request';
 import CloseReopenReportToggle from '~/close_reopen_report_toggle';
 import IssuablesHelper from '~/helpers/issuables_helper';
 

spec/javascripts/right_sidebar_spec.js

 /* eslint-disable space-before-function-paren, no-var, one-var, one-var-declaration-per-line, new-parens, no-return-assign, new-cap, vars-on-top, max-len */
-/* global Sidebar */
 
 import '~/commons/bootstrap';
-import '~/right_sidebar';
+import Sidebar from '~/right_sidebar';
 
 (function() {
   var $aside, $icon, $labelsIcon, $page, $toggle, assertSidebarState;