Fix rendering double note issue.

5 files changed, 47 insertions, 19 deletions

diff --git a/app/assets/javascripts/notes/components/issue_comment_form.vue b/app/assets/javascripts/notes/components/issue_comment_form.vue
index 183d8e5aa38..419d6225d8e 100644
--- a/app/assets/javascripts/notes/components/issue_comment_form.vue
+++ b/app/assets/javascripts/notes/components/issue_comment_form.vue
@@ -97,6 +97,8 @@
     methods: {
       ...mapActions([
         'saveNote',
+        'stopPolling',
+        'restartPolling',
         'removePlaceholderNotes',
       ]),
       setIsSubmitButtonDisabled(note, isSubmitting) {
@@ -126,10 +128,13 @@
           this.isSubmitting = true;
           this.note = ''; // Empty textarea while being requested. Repopulate in catch
           this.resizeTextarea();
+          this.stopPolling();
 
           this.saveNote(noteData)
             .then((res) => {
               this.isSubmitting = false;
+              this.restartPolling();
+
               if (res.errors) {
                 if (res.errors.commands_only) {
                   this.discard();
diff --git a/app/assets/javascripts/notes/stores/actions.js b/app/assets/javascripts/notes/stores/actions.js
index 923611bda9a..1a791039909 100644
--- a/app/assets/javascripts/notes/stores/actions.js
+++ b/app/assets/javascripts/notes/stores/actions.js
@@ -187,6 +187,14 @@ export const poll = ({ commit, state, getters }) => {
   });
 };
 
+export const stopPolling = () => {
+  eTagPoll.stop();
+};
+
+export const restartPolling = () => {
+  eTagPoll.restart();
+};
+
 export const fetchData = ({ commit, state, getters }) => {
   const requestData = { endpoint: state.notesData.notesPath, lastFetchedAt: state.lastFetchedAt };
 
diff --git a/app/assets/javascripts/notes/stores/mutations.js b/app/assets/javascripts/notes/stores/mutations.js
index 3b2b2089d6e..c2a08f3d6fe 100644
--- a/app/assets/javascripts/notes/stores/mutations.js
+++ b/app/assets/javascripts/notes/stores/mutations.js
@@ -5,15 +5,19 @@ import * as constants from '../constants';
 export default {
   [types.ADD_NEW_NOTE](state, note) {
     const { discussion_id, type } = note;
-    const noteData = {
-      expanded: true,
-      id: discussion_id,
-      individual_note: !(type === constants.DISCUSSION_NOTE),
-      notes: [note],
-      reply_id: discussion_id,
-    };
-
-    state.notes.push(noteData);
+    const [exists] = state.notes.filter(n => n.id === note.discussion_id);
+
+    if (!exists) {
+      const noteData = {
+        expanded: true,
+        id: discussion_id,
+        individual_note: !(type === constants.DISCUSSION_NOTE),
+        notes: [note],
+        reply_id: discussion_id,
+      };
+
+      state.notes.push(noteData);
+    }
   },
 
   [types.ADD_NEW_REPLY_TO_DISCUSSION](state, note) {
diff --git a/spec/javascripts/notes/stores/actions_spec.js b/spec/javascripts/notes/stores/actions_spec.js
index 72d362acb2f..2b2219dcf0c 100644
--- a/spec/javascripts/notes/stores/actions_spec.js
+++ b/spec/javascripts/notes/stores/actions_spec.js
@@ -1,4 +1,3 @@
-
 import * as actions from '~/notes/stores/actions';
 import testAction from './helpers';
 import { discussionMock, notesDataMock, userDataMock, issueDataMock, individualNote } from '../mock_data';
diff --git a/spec/javascripts/notes/stores/mutation_spec.js b/spec/javascripts/notes/stores/mutation_spec.js
index a38f29c1e39..1e22e03e178 100644
--- a/spec/javascripts/notes/stores/mutation_spec.js
+++ b/spec/javascripts/notes/stores/mutation_spec.js
@@ -3,19 +3,31 @@ import { note, discussionMock, notesDataMock, userDataMock, issueDataMock, indiv
 
 describe('Mutation Notes Store', () => {
   describe('ADD_NEW_NOTE', () => {
-    it('should add a new note to an array of notes', () => {
-      const state = { notes: [] };
+    let state;
+    let noteData;
+
+    beforeEach(() => {
+      state = { notes: [] };
+      noteData = {
+        expanded: true,
+        id: note.discussion_id,
+        individual_note: true,
+        notes: [note],
+        reply_id: note.discussion_id,
+      };
       mutations.ADD_NEW_NOTE(state, note);
+    });
 
+    it('should add a new note to an array of notes', () => {
       expect(state).toEqual({
-        notes: [{
-          expanded: true,
-          id: note.discussion_id,
-          individual_note: true,
-          notes: [note],
-          reply_id: note.discussion_id,
-        }],
+        notes: [noteData],
       });
+      expect(state.notes.length).toBe(1);
+    });
+
+    it('should not add the same note to the notes array', () => {
+      mutations.ADD_NEW_NOTE(state, note);
+      expect(state.notes.length).toBe(1);
     });
   });