From e84c943fa0609d05184cb95c845fa35cc1fcd432 Mon Sep 17 00:00:00 2001
From: Filipa Lacerda <filipa@gitlab.com>
Date: Mon, 12 Mar 2018 17:08:05 +0000
Subject: Fix loading icon being visible in the wrong button

---
 .../notes/components/comment_form_spec.js          | 14 +++++
 spec/javascripts/notes/stores/actions_spec.js      | 16 ++++++
 spec/javascripts/notes/stores/mutation_spec.js     | 66 ++++++++++++++++++++++
 3 files changed, 96 insertions(+)

(limited to 'spec/javascripts/notes')

diff --git a/spec/javascripts/notes/components/comment_form_spec.js b/spec/javascripts/notes/components/comment_form_spec.js
index 90016436cb7..224debbeff6 100644
--- a/spec/javascripts/notes/components/comment_form_spec.js
+++ b/spec/javascripts/notes/components/comment_form_spec.js
@@ -200,6 +200,20 @@ describe('issue_comment_form component', () => {
           done();
         });
       });
+
+      describe('when clicking close/reopen button', () => {
+        it('should disable button and show a loading spinner', (done) => {
+          const toggleStateButton = vm.$el.querySelector('.js-action-button');
+
+          toggleStateButton.click();
+          Vue.nextTick(() => {
+            expect(toggleStateButton.disabled).toEqual(true);
+            expect(toggleStateButton.querySelector('.js-loading-button-icon')).not.toBeNull();
+
+            done();
+          });
+        });
+      });
     });
 
     describe('issue is confidential', () => {
diff --git a/spec/javascripts/notes/stores/actions_spec.js b/spec/javascripts/notes/stores/actions_spec.js
index ab80ed7bbfb..0f092810574 100644
--- a/spec/javascripts/notes/stores/actions_spec.js
+++ b/spec/javascripts/notes/stores/actions_spec.js
@@ -87,6 +87,7 @@ describe('Actions Notes Store', () => {
         store.dispatch('closeIssue', { notesData: { closeIssuePath: '' } })
           .then(() => {
             expect(store.state.noteableData.state).toEqual('closed');
+            expect(store.state.isToggleStateButtonLoading).toEqual(false);
             done();
           })
           .catch(done.fail);
@@ -98,6 +99,7 @@ describe('Actions Notes Store', () => {
         store.dispatch('reopenIssue', { notesData: { reopenIssuePath: '' } })
           .then(() => {
             expect(store.state.noteableData.state).toEqual('reopened');
+            expect(store.state.isToggleStateButtonLoading).toEqual(false);
             done();
           })
           .catch(done.fail);
@@ -116,6 +118,20 @@ describe('Actions Notes Store', () => {
     });
   });
 
+  describe('toggleStateButtonLoading', () => {
+    it('should set loading as true', (done) => {
+      testAction(actions.toggleStateButtonLoading, true, {}, [
+        { type: 'TOGGLE_STATE_BUTTON_LOADING', payload: true },
+      ], done);
+    });
+
+    it('should set loading as false', (done) => {
+      testAction(actions.toggleStateButtonLoading, false, {}, [
+        { type: 'TOGGLE_STATE_BUTTON_LOADING', payload: false },
+      ], done);
+    });
+  });
+
   describe('toggleIssueLocalState', () => {
     it('sets issue state as closed', (done) => {
       testAction(actions.toggleIssueLocalState, 'closed', {}, [
diff --git a/spec/javascripts/notes/stores/mutation_spec.js b/spec/javascripts/notes/stores/mutation_spec.js
index e4baefc5bfc..2627f721d9d 100644
--- a/spec/javascripts/notes/stores/mutation_spec.js
+++ b/spec/javascripts/notes/stores/mutation_spec.js
@@ -217,4 +217,70 @@ describe('Notes Store mutations', () => {
       expect(state.notes[0].notes[0].note).toEqual('Foo');
     });
   });
+
+  describe('CLOSE_ISSUE', () => {
+    it('should set issue as closed', () => {
+      const state = {
+        notes: [],
+        targetNoteHash: null,
+        lastFetchedAt: null,
+        isToggleStateButtonLoading: false,
+        notesData: {},
+        userData: {},
+        noteableData: {},
+      };
+
+      mutations.CLOSE_ISSUE(state);
+      expect(state.noteableData.state).toEqual('closed');
+    });
+  });
+
+  describe('REOPEN_ISSUE', () => {
+    it('should set issue as closed', () => {
+      const state = {
+        notes: [],
+        targetNoteHash: null,
+        lastFetchedAt: null,
+        isToggleStateButtonLoading: false,
+        notesData: {},
+        userData: {},
+        noteableData: {},
+      };
+
+      mutations.REOPEN_ISSUE(state);
+      expect(state.noteableData.state).toEqual('reopened');
+    });
+  });
+
+  describe('TOGGLE_STATE_BUTTON_LOADING', () => {
+    it('should set isToggleStateButtonLoading as true', () => {
+      const state = {
+        notes: [],
+        targetNoteHash: null,
+        lastFetchedAt: null,
+        isToggleStateButtonLoading: false,
+        notesData: {},
+        userData: {},
+        noteableData: {},
+      };
+
+      mutations.TOGGLE_STATE_BUTTON_LOADING(state, true);
+      expect(state.isToggleStateButtonLoading).toEqual(true);
+    });
+
+    it('should set isToggleStateButtonLoading as false', () => {
+      const state = {
+        notes: [],
+        targetNoteHash: null,
+        lastFetchedAt: null,
+        isToggleStateButtonLoading: true,
+        notesData: {},
+        userData: {},
+        noteableData: {},
+      };
+
+      mutations.TOGGLE_STATE_BUTTON_LOADING(state, false);
+      expect(state.isToggleStateButtonLoading).toEqual(false);
+    });
+  });
 });
-- 
cgit v1.2.1