Added specs

3 files changed, 344 insertions, 2 deletions

diff --git a/spec/javascripts/close_reopen_report_toggle_spec.js b/spec/javascripts/close_reopen_report_toggle_spec.js
new file mode 100644
index 00000000000..9641a7e43d6
--- /dev/null
+++ b/spec/javascripts/close_reopen_report_toggle_spec.js
@@ -0,0 +1,265 @@
+import CloseReopenReportToggle from '~/close_reopen_report_toggle';
+import * as DropLab from '~/droplab/drop_lab';
+
+describe('CloseReopenReportToggle', () => {
+  describe('class constructor', () => {
+    const dropdownTrigger = {};
+    const dropdownList = {};
+    const button = {};
+    let commentTypeToggle;
+
+    beforeEach(function () {
+      commentTypeToggle = new CloseReopenReportToggle({
+        dropdownTrigger,
+        dropdownList,
+        button,
+      });
+    });
+
+    it('sets .dropdownTrigger', function () {
+      expect(commentTypeToggle.dropdownTrigger).toBe(dropdownTrigger);
+    });
+
+    it('sets .dropdownList', function () {
+      expect(commentTypeToggle.dropdownList).toBe(dropdownList);
+    });
+
+    it('sets .button', function () {
+      expect(commentTypeToggle.button).toBe(button);
+    });
+  });
+
+  describe('initDroplab', () => {
+    let closeReopenReportToggle;
+    const dropdownList = jasmine.createSpyObj('dropdownList', ['querySelector']);
+    const droplab = jasmine.createSpyObj('droplab', ['init']);
+    const dropdownTrigger = {};
+    const button = {};
+    const reopenItem = {};
+    const closeItem = {};
+    const config = {};
+
+    beforeEach(() => {
+      spyOn(DropLab, 'default').and.returnValue(droplab);
+      dropdownList.querySelector.and.returnValues(reopenItem, closeItem);
+
+      closeReopenReportToggle = new CloseReopenReportToggle({
+        dropdownTrigger,
+        dropdownList,
+        button,
+      });
+
+      spyOn(closeReopenReportToggle, 'setConfig').and.returnValue(config);
+
+      closeReopenReportToggle.initDroplab();
+    });
+
+    it('sets .reopenItem and .closeItem', () => {
+      expect(dropdownList.querySelector).toHaveBeenCalledWith('.reopen-item');
+      expect(dropdownList.querySelector).toHaveBeenCalledWith('.close-item');
+      expect(closeReopenReportToggle.reopenItem).toBe(reopenItem);
+      expect(closeReopenReportToggle.closeItem).toBe(closeItem);
+    });
+
+    it('instantiates DropLab and set .droplab', () => {
+      expect(DropLab.default).toHaveBeenCalled();
+      expect(closeReopenReportToggle.droplab).toBe(droplab);
+    });
+
+    it('calls .setConfig', () => {
+      expect(closeReopenReportToggle.setConfig).toHaveBeenCalled();
+    });
+
+    it('calls .droplab.init', () => {
+      expect(droplab.init).toHaveBeenCalledWith(
+        dropdownTrigger,
+        dropdownList,
+        jasmine.any(Array),
+        config,
+      );
+    });
+  });
+
+  describe('updateButton', () => {
+    let closeReopenReportToggle;
+    const dropdownList = {};
+    const dropdownTrigger = {};
+    const button = jasmine.createSpyObj('button', ['blur']);
+    const isClosed = true;
+
+    beforeEach(() => {
+      closeReopenReportToggle = new CloseReopenReportToggle({
+        dropdownTrigger,
+        dropdownList,
+        button,
+      });
+
+      spyOn(closeReopenReportToggle, 'toggleButtonType');
+
+      closeReopenReportToggle.updateButton(isClosed);
+    });
+
+    it('calls .toggleButtonType', () => {
+      expect(closeReopenReportToggle.toggleButtonType).toHaveBeenCalledWith(isClosed);
+    });
+
+    it('calls .button.blur', () => {
+      expect(closeReopenReportToggle.button.blur).toHaveBeenCalled();
+    });
+  });
+
+  describe('toggleButtonType', () => {
+    let closeReopenReportToggle;
+    const dropdownList = {};
+    const dropdownTrigger = {};
+    const button = {};
+    const isClosed = true;
+    const showItem = jasmine.createSpyObj('showItem', ['click']);
+    const hideItem = {};
+    showItem.classList = jasmine.createSpyObj('classList', ['add', 'remove']);
+    hideItem.classList = jasmine.createSpyObj('classList', ['add', 'remove']);
+
+    beforeEach(() => {
+      closeReopenReportToggle = new CloseReopenReportToggle({
+        dropdownTrigger,
+        dropdownList,
+        button,
+      });
+
+      spyOn(closeReopenReportToggle, 'getButtonTypes').and.returnValue([showItem, hideItem]);
+
+      closeReopenReportToggle.toggleButtonType(isClosed);
+    });
+
+    it('calls .getButtonTypes', () => {
+      expect(closeReopenReportToggle.getButtonTypes).toHaveBeenCalledWith(isClosed);
+    });
+
+    it('removes hide class and add selected class to showItem, opposite for hideItem', () => {
+      expect(showItem.classList.remove).toHaveBeenCalledWith('hidden');
+      expect(showItem.classList.add).toHaveBeenCalledWith('droplab-item-selected');
+      expect(hideItem.classList.add).toHaveBeenCalledWith('hidden');
+      expect(hideItem.classList.remove).toHaveBeenCalledWith('droplab-item-selected');
+    });
+
+    it('clicks the showItem', () => {
+      expect(showItem.click).toHaveBeenCalled();
+    });
+  });
+
+  describe('getButtonTypes', () => {
+    let closeReopenReportToggle;
+    const dropdownList = {};
+    const dropdownTrigger = {};
+    const button = {};
+    const reopenItem = {};
+    const closeItem = {};
+
+    beforeEach(() => {
+      closeReopenReportToggle = new CloseReopenReportToggle({
+        dropdownTrigger,
+        dropdownList,
+        button,
+      });
+
+      closeReopenReportToggle.reopenItem = reopenItem;
+      closeReopenReportToggle.closeItem = closeItem;
+    });
+
+    it('returns reopenItem, closeItem if isClosed is true', () => {
+      const buttonTypes = closeReopenReportToggle.getButtonTypes(true);
+
+      expect(buttonTypes).toEqual([reopenItem, closeItem]);
+    });
+
+    it('returns closeItem, reopenItem if isClosed is false', () => {
+      const buttonTypes = closeReopenReportToggle.getButtonTypes(false);
+
+      expect(buttonTypes).toEqual([closeItem, reopenItem]);
+    });
+  });
+
+  describe('setDisable', () => {
+    let closeReopenReportToggle;
+    const dropdownList = {};
+    const dropdownTrigger = jasmine.createSpyObj('button', ['setAttribute', 'removeAttribute']);
+    const button = jasmine.createSpyObj('button', ['setAttribute', 'removeAttribute']);
+
+    beforeEach(() => {
+      closeReopenReportToggle = new CloseReopenReportToggle({
+        dropdownTrigger,
+        dropdownList,
+        button,
+      });
+    });
+
+    it('disable .button and .dropdownTrigger if shouldDisable is true', () => {
+      closeReopenReportToggle.setDisable(true);
+
+      expect(button.setAttribute).toHaveBeenCalledWith('disabled', 'true');
+      expect(dropdownTrigger.setAttribute).toHaveBeenCalledWith('disabled', 'true');
+    });
+
+    it('enable .button and .dropdownTrigger if shouldDisable is false', () => {
+      closeReopenReportToggle.setDisable(false);
+
+      expect(button.removeAttribute).toHaveBeenCalledWith('disabled');
+      expect(dropdownTrigger.removeAttribute).toHaveBeenCalledWith('disabled');
+    });
+  });
+
+  describe('setConfig', () => {
+    let closeReopenReportToggle;
+    const dropdownList = {};
+    const dropdownTrigger = {};
+    const button = {};
+    let config;
+
+    beforeEach(() => {
+      closeReopenReportToggle = new CloseReopenReportToggle({
+        dropdownTrigger,
+        dropdownList,
+        button,
+      });
+
+      config = closeReopenReportToggle.setConfig();
+    });
+
+    it('returns a config object', () => {
+      expect(config).toEqual({
+        InputSetter: [
+          {
+            input: button,
+            valueAttribute: 'data-text',
+            inputAttribute: 'data-value',
+          },
+          {
+            input: button,
+            valueAttribute: 'data-text',
+            inputAttribute: 'title',
+          },
+          {
+            input: button,
+            valueAttribute: 'data-button-class',
+            inputAttribute: 'class',
+          },
+          {
+            input: dropdownTrigger,
+            valueAttribute: 'data-toggle-class',
+            inputAttribute: 'class',
+          },
+          {
+            input: button,
+            valueAttribute: 'data-url',
+            inputAttribute: 'href',
+          },
+          {
+            input: button,
+            valueAttribute: 'data-method',
+            inputAttribute: 'data-method',
+          },
+        ],
+      });
+    });
+  });
+});
diff --git a/spec/javascripts/issue_spec.js b/spec/javascripts/issue_spec.js
index df97a100b0d..43420076be0 100644
--- a/spec/javascripts/issue_spec.js
+++ b/spec/javascripts/issue_spec.js
@@ -1,6 +1,6 @@
 /* eslint-disable space-before-function-paren, one-var, one-var-declaration-per-line, no-use-before-define, comma-dangle, max-len */
 import Issue from '~/issue';
-
+import * as CloseReopenReportToggle from '~/close_reopen_report_toggle';
 import '~/lib/utils/text_utility';
 
 describe('Issue', function() {
@@ -195,4 +195,43 @@ describe('Issue', function() {
       });
     });
   });
+
+  describe('units', () => {
+    describe('class constructor', () => {
+      it('calls .initCloseReopenReport', () => {
+        spyOn(Issue.prototype, 'initCloseReopenReport');
+
+        new Issue(); // eslint-disable-line no-new
+
+        expect(Issue.prototype.initCloseReopenReport).toHaveBeenCalled();
+      });
+    });
+
+    describe('initCloseReopenReport', () => {
+      it('inits a new CloseReopenReportToggle instance and calls .initDroplab', () => {
+        const container = jasmine.createSpyObj('container', ['querySelector']);
+        const closeReopenReportToggle = jasmine.createSpyObj('closeReopenReportToggle', ['initDroplab']);
+        const dropdownTrigger = {};
+        const dropdownList = {};
+        const button = {};
+
+        spyOn(document, 'querySelector').and.returnValue(container);
+        spyOn(CloseReopenReportToggle, 'default').and.returnValue(closeReopenReportToggle);
+        container.querySelector.and.returnValues(dropdownTrigger, dropdownList, button);
+
+        Issue.prototype.initCloseReopenReport();
+
+        expect(document.querySelector).toHaveBeenCalledWith('.js-issuable-close-dropdown');
+        expect(container.querySelector).toHaveBeenCalledWith('.js-issuable-close-toggle');
+        expect(container.querySelector).toHaveBeenCalledWith('.js-issuable-close-menu');
+        expect(container.querySelector).toHaveBeenCalledWith('.js-issuable-close-button');
+        expect(CloseReopenReportToggle.default).toHaveBeenCalledWith({
+          dropdownTrigger,
+          dropdownList,
+          button,
+        });
+        expect(closeReopenReportToggle.initDroplab).toHaveBeenCalled();
+      });
+    });
+  });
 });
diff --git a/spec/javascripts/merge_request_spec.js b/spec/javascripts/merge_request_spec.js
index f444bcaf847..3235df50456 100644
--- a/spec/javascripts/merge_request_spec.js
+++ b/spec/javascripts/merge_request_spec.js
@@ -2,10 +2,11 @@
 /* global MergeRequest */
 
 import '~/merge_request';
+import * as CloseReopenReportToggle from '~/close_reopen_report_toggle';
 
 (function() {
   describe('MergeRequest', function() {
-    return describe('task lists', function() {
+    describe('task lists', function() {
       preloadFixtures('merge_requests/merge_request_with_task_list.html.raw');
       beforeEach(function() {
         loadFixtures('merge_requests/merge_request_with_task_list.html.raw');
@@ -27,5 +28,42 @@ import '~/merge_request';
         return $('.js-task-list-field').trigger('tasklist:changed');
       });
     });
+
+    describe('class constructor', () => {
+      it('calls .initCloseReopenReport', () => {
+        spyOn(MergeRequest, 'initCloseReopenReport');
+
+        new MergeRequest(); // eslint-disable-line no-new
+
+        expect(MergeRequest.initCloseReopenReport).toHaveBeenCalled();
+      });
+    });
+
+    describe('initCloseReopenReport', () => {
+      it('inits a new CloseReopenReportToggle instance and calls .initDroplab', () => {
+        const container = jasmine.createSpyObj('container', ['querySelector']);
+        const closeReopenReportToggle = jasmine.createSpyObj('closeReopenReportToggle', ['initDroplab']);
+        const dropdownTrigger = {};
+        const dropdownList = {};
+        const button = {};
+
+        spyOn(document, 'querySelector').and.returnValue(container);
+        spyOn(CloseReopenReportToggle, 'default').and.returnValue(closeReopenReportToggle);
+        container.querySelector.and.returnValues(dropdownTrigger, dropdownList, button);
+
+        MergeRequest.initCloseReopenReport();
+
+        expect(document.querySelector).toHaveBeenCalledWith('.js-issuable-close-dropdown');
+        expect(container.querySelector).toHaveBeenCalledWith('.js-issuable-close-toggle');
+        expect(container.querySelector).toHaveBeenCalledWith('.js-issuable-close-menu');
+        expect(container.querySelector).toHaveBeenCalledWith('.js-issuable-close-button');
+        expect(CloseReopenReportToggle.default).toHaveBeenCalledWith({
+          dropdownTrigger,
+          dropdownList,
+          button,
+        });
+        expect(closeReopenReportToggle.initDroplab).toHaveBeenCalled();
+      });
+    });
   });
 }).call(window);