Remove issuable form from global namespace

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

 /* eslint-disable comma-dangle, space-before-function-paren, no-new */
-import IssuableContext from '../../issuable_context';
 /* global MilestoneSelect */
 /* global LabelsSelect */
 /* global Sidebar */
@@ -11,6 +10,7 @@ import AssigneeTitle from '../../sidebar/components/assignees/assignee_title';
 import Assignees from '../../sidebar/components/assignees/assignees';
 import DueDateSelectors from '../../due_date_select';
 import './sidebar/remove_issue';
+import IssuableContext from '../../issuable_context';
 
 const Store = gl.issueBoards.BoardsStore;
 

app/assets/javascripts/dispatcher.js

@@ -2,7 +2,7 @@
 /* global ProjectSelect */
 import IssuableIndex from './issuable_index';
 /* global Milestone */
-/* global IssuableForm */
+import IssuableForm from './issuable_form';
 /* global LabelsSelect */
 /* global MilestoneSelect */
 /* global NewBranchForm */

app/assets/javascripts/issuable_form.js

-/* eslint-disable func-names, space-before-function-paren, no-var, prefer-rest-params, wrap-iife, no-use-before-define, no-useless-escape, no-new, quotes, object-shorthand, no-unused-vars, comma-dangle, no-alert, consistent-return, no-else-return, prefer-template, one-var, one-var-declaration-per-line, curly, max-len */
+/* eslint-disable func-names, prefer-rest-params, wrap-iife, no-use-before-define, no-useless-escape, no-new, object-shorthand, no-unused-vars, comma-dangle, no-alert, consistent-return, no-else-return, prefer-template, one-var, one-var-declaration-per-line, curly, max-len */
 /* global GitLab */
 /* global Autosave */
 
@@ -8,76 +8,76 @@ import GfmAutoComplete from './gfm_auto_complete';
 import ZenMode from './zen_mode';
 import { parsePikadayDate, pikadayToString } from './lib/utils/datefix';
 
-(function() {
-  this.IssuableForm = (function() {
-    IssuableForm.prototype.wipRegex = /^\s*(\[WIP\]\s*|WIP:\s*|WIP\s+)+\s*/i;
-
-    function IssuableForm(form) {
-      var $issuableDueDate, calendar;
+export default class IssuableForm {
+  constructor(form) {
     this.form = form;
     this.toggleWip = this.toggleWip.bind(this);
     this.renderWipExplanation = this.renderWipExplanation.bind(this);
     this.resetAutosave = this.resetAutosave.bind(this);
     this.handleSubmit = this.handleSubmit.bind(this);
+    this.wipRegex = /^\s*(\[WIP\]\s*|WIP:\s*|WIP\s+)+\s*/i;
+
     new GfmAutoComplete(gl.GfmAutoComplete && gl.GfmAutoComplete.dataSources).setup();
     new UsersSelect();
     new ZenMode();
-      this.titleField = this.form.find("input[name*='[title]']");
-      this.descriptionField = this.form.find("textarea[name*='[description]']");
+
+    this.titleField = this.form.find('input[name*="[title]"]');
+    this.descriptionField = this.form.find('textarea[name*="[description]"]');
     if (!(this.titleField.length && this.descriptionField.length)) {
       return;
     }
+
     this.initAutosave();
-      this.form.on("submit", this.handleSubmit);
-      this.form.on("click", ".btn-cancel", this.resetAutosave);
+    this.form.on('submit', this.handleSubmit);
+    this.form.on('click', '.btn-cancel', this.resetAutosave);
     this.initWip();
-      $issuableDueDate = $('#issuable-due-date');
+
+    const $issuableDueDate = $('#issuable-due-date');
+
     if ($issuableDueDate.length) {
-        calendar = new Pikaday({
+      const calendar = new Pikaday({
         field: $issuableDueDate.get(0),
         theme: 'gitlab-theme animate-picker',
         format: 'yyyy-mm-dd',
         container: $issuableDueDate.parent().get(0),
         parse: dateString => parsePikadayDate(dateString),
         toString: date => pikadayToString(date),
-          onSelect: function(dateText) {
-            $issuableDueDate.val(calendar.toString(dateText));
-          }
+        onSelect: dateText => $issuableDueDate.val(calendar.toString(dateText)),
       });
       calendar.setDate(parsePikadayDate($issuableDueDate.val()));
     }
   }
 
-    IssuableForm.prototype.initAutosave = function() {
-      new Autosave(this.titleField, [document.location.pathname, document.location.search, "title"]);
-      return new Autosave(this.descriptionField, [document.location.pathname, document.location.search, "description"]);
-    };
+  initAutosave() {
+    new Autosave(this.titleField, [document.location.pathname, document.location.search, 'title']);
+    return new Autosave(this.descriptionField, [document.location.pathname, document.location.search, 'description']);
+  }
 
-    IssuableForm.prototype.handleSubmit = function() {
+  handleSubmit() {
     return this.resetAutosave();
-    };
+  }
 
-    IssuableForm.prototype.resetAutosave = function() {
-      this.titleField.data("autosave").reset();
-      return this.descriptionField.data("autosave").reset();
-    };
+  resetAutosave() {
+    this.titleField.data('autosave').reset();
+    return this.descriptionField.data('autosave').reset();
+  }
 
-    IssuableForm.prototype.initWip = function() {
-      this.$wipExplanation = this.form.find(".js-wip-explanation");
-      this.$noWipExplanation = this.form.find(".js-no-wip-explanation");
+  initWip() {
+    this.$wipExplanation = this.form.find('.js-wip-explanation');
+    this.$noWipExplanation = this.form.find('.js-no-wip-explanation');
     if (!(this.$wipExplanation.length && this.$noWipExplanation.length)) {
       return;
     }
-      this.form.on("click", ".js-toggle-wip", this.toggleWip);
-      this.titleField.on("keyup blur", this.renderWipExplanation);
+    this.form.on('click', '.js-toggle-wip', this.toggleWip);
+    this.titleField.on('keyup blur', this.renderWipExplanation);
     return this.renderWipExplanation();
-    };
+  }
 
-    IssuableForm.prototype.workInProgress = function() {
+  workInProgress() {
     return this.wipRegex.test(this.titleField.val());
-    };
+  }
 
-    IssuableForm.prototype.renderWipExplanation = function() {
+  renderWipExplanation() {
     if (this.workInProgress()) {
       this.$wipExplanation.show();
       return this.$noWipExplanation.hide();
@@ -85,9 +85,9 @@ import { parsePikadayDate, pikadayToString } from './lib/utils/datefix';
       this.$wipExplanation.hide();
       return this.$noWipExplanation.show();
     }
-    };
+  }
 
-    IssuableForm.prototype.toggleWip = function(event) {
+  toggleWip(event) {
     event.preventDefault();
     if (this.workInProgress()) {
       this.removeWip();
@@ -95,16 +95,13 @@ import { parsePikadayDate, pikadayToString } from './lib/utils/datefix';
       this.addWip();
     }
     return this.renderWipExplanation();
-    };
-
-    IssuableForm.prototype.removeWip = function() {
-      return this.titleField.val(this.titleField.val().replace(this.wipRegex, ""));
-    };
+  }
 
-    IssuableForm.prototype.addWip = function() {
-      return this.titleField.val("WIP: " + (this.titleField.val()));
-    };
+  removeWip() {
+    return this.titleField.val(this.titleField.val().replace(this.wipRegex, ''));
+  }
 
-    return IssuableForm;
-  })();
-}).call(window);
+  addWip() {
+    this.titleField.val(`WIP: ${(this.titleField.val())}`);
+  }
+}

spec/javascripts/labels_issue_sidebar_spec.js

@@ -6,7 +6,6 @@ import '~/gl_dropdown';
 import 'select2';
 import '~/api';
 import '~/create_label';
-import '~/issuable_context';
 import '~/users_select';
 import '~/labels_select';