Changes tab VUE refactoring

1 files changed, 39 insertions, 112 deletions

diff --git a/spec/javascripts/notes_spec.js b/spec/javascripts/notes_spec.js
index 2854263a25a..faeedae40e9 100644
--- a/spec/javascripts/notes_spec.js
+++ b/spec/javascripts/notes_spec.js
@@ -35,11 +35,11 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
   describe('Notes', function() {
     const FLASH_TYPE_ALERT = 'alert';
     const NOTES_POST_PATH = /(.*)\/notes\?html=true$/;
-    var commentsTemplate = 'merge_requests/merge_request_with_comment.html.raw';
-    preloadFixtures(commentsTemplate);
+    var fixture = 'snippets/show.html.raw';
+    preloadFixtures(fixture);
 
     beforeEach(function() {
-      loadFixtures(commentsTemplate);
+      loadFixtures(fixture);
       gl.utils.disableButtonIfEmptyField = _.noop;
       window.project_uploads_path = 'http://test.host/uploads';
       $('body').attr('data-page', 'projects:merge_requets:show');
@@ -65,16 +65,9 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
       let mock;
 
       beforeEach(function() {
-        spyOn(axios, 'patch').and.callThrough();
+        spyOn(axios, 'patch').and.callFake(() => new Promise(() => {}));
         mock = new MockAdapter(axios);
-
-        mock
-          .onPatch(
-            `${
-              gl.TEST_HOST
-            }/frontend-fixtures/merge-requests-project/merge_requests/1.json`,
-          )
-          .reply(200, {});
+        mock.onAny().reply(200, {});
 
         $('.js-comment-button').on('click', function(e) {
           e.preventDefault();
@@ -90,26 +83,17 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
         const changeEvent = document.createEvent('HTMLEvents');
         changeEvent.initEvent('change', true, true);
         $('input[type=checkbox]')
-          .attr('checked', true)[1]
+          .attr('checked', true)[0]
           .dispatchEvent(changeEvent);
 
-        expect($('.js-task-list-field.original-task-list').val()).toBe(
-          '- [x] Task List Item',
-        );
+        expect($('.js-task-list-field.original-task-list').val()).toBe('- [x] Task List Item');
       });
 
       it('submits an ajax request on tasklist:changed', function(done) {
         $('.js-task-list-container').trigger('tasklist:changed');
 
         setTimeout(() => {
-          expect(axios.patch).toHaveBeenCalledWith(
-            `${
-              gl.TEST_HOST
-            }/frontend-fixtures/merge-requests-project/merge_requests/1.json`,
-            {
-              note: { note: '' },
-            },
-          );
+          expect(axios.patch).toHaveBeenCalled();
           done();
         });
       });
@@ -200,9 +184,7 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
           updatedNote.note = 'bar';
           this.notes.updateNote(updatedNote, $targetNote);
 
-          expect(this.notes.revertNoteEditForm).toHaveBeenCalledWith(
-            $targetNote,
-          );
+          expect(this.notes.revertNoteEditForm).toHaveBeenCalledWith($targetNote);
           expect(this.notes.setupNewNote).toHaveBeenCalled();
 
           done();
@@ -282,10 +264,7 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
           Notes.isNewNote.and.returnValue(true);
           Notes.prototype.renderNote.call(notes, note, null, $notesList);
 
-          expect(Notes.animateAppendNote).toHaveBeenCalledWith(
-            note.html,
-            $notesList,
-          );
+          expect(Notes.animateAppendNote).toHaveBeenCalledWith(note.html, $notesList);
         });
       });
 
@@ -300,10 +279,7 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
 
           Notes.prototype.renderNote.call(notes, note, null, $notesList);
 
-          expect(Notes.animateUpdateNote).toHaveBeenCalledWith(
-            note.html,
-            $note,
-          );
+          expect(Notes.animateUpdateNote).toHaveBeenCalledWith(note.html, $note);
           expect(notes.setupNewNote).toHaveBeenCalledWith($newNote);
         });
 
@@ -331,10 +307,7 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
             $notesList.find.and.returnValue($note);
             Notes.prototype.renderNote.call(notes, note, null, $notesList);
 
-            expect(notes.putConflictEditWarningInPlace).toHaveBeenCalledWith(
-              note,
-              $note,
-            );
+            expect(notes.putConflictEditWarningInPlace).toHaveBeenCalledWith(note, $note);
           });
         });
       });
@@ -400,10 +373,7 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
         $form.length = 1;
         row = jasmine.createSpyObj('row', ['prevAll', 'first', 'find']);
 
-        notes = jasmine.createSpyObj('notes', [
-          'isParallelView',
-          'updateNotesCount',
-        ]);
+        notes = jasmine.createSpyObj('notes', ['isParallelView', 'updateNotesCount']);
         notes.note_ids = [];
 
         spyOn(Notes, 'isNewNote');
@@ -464,10 +434,7 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
         });
 
         it('should call Notes.animateAppendNote', () => {
-          expect(Notes.animateAppendNote).toHaveBeenCalledWith(
-            note.html,
-            discussionContainer,
-          );
+          expect(Notes.animateAppendNote).toHaveBeenCalledWith(note.html, discussionContainer);
         });
       });
     });
@@ -571,9 +538,7 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
         mockNotesPost();
 
         $('.js-comment-button').click();
-        expect($notesContainer.find('.note.being-posted').length > 0).toEqual(
-          true,
-        );
+        expect($notesContainer.find('.note.being-posted').length > 0).toEqual(true);
       });
 
       it('should remove placeholder note when new comment is done posting', done => {
@@ -617,9 +582,7 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
         $('.js-comment-button').click();
 
         setTimeout(() => {
-          expect($notesContainer.find(`#note_${note.id}`).length > 0).toEqual(
-            true,
-          );
+          expect($notesContainer.find(`#note_${note.id}`).length > 0).toEqual(true);
 
           done();
         });
@@ -734,14 +697,10 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
         spyOn(gl.awardsHandler, 'addAwardToEmojiBar').and.callThrough();
         $('.js-comment-button').click();
 
-        expect(
-          $notesContainer.find('.system-note.being-posted').length,
-        ).toEqual(1); // Placeholder shown
+        expect($notesContainer.find('.system-note.being-posted').length).toEqual(1); // Placeholder shown
 
         setTimeout(() => {
-          expect(
-            $notesContainer.find('.system-note.being-posted').length,
-          ).toEqual(0); // Placeholder removed
+          expect($notesContainer.find('.system-note.being-posted').length).toEqual(0); // Placeholder removed
           done();
         });
       });
@@ -815,9 +774,7 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
 
       it('should return form metadata object from form reference', () => {
         $form.find('textarea.js-note-text').val(sampleComment);
-        const { formData, formContent, formAction } = this.notes.getFormData(
-          $form,
-        );
+        const { formData, formContent, formAction } = this.notes.getFormData($form);
 
         expect(formData.indexOf(sampleComment) > -1).toBe(true);
         expect(formContent).toEqual(sampleComment);
@@ -833,9 +790,7 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
         const { formContent } = this.notes.getFormData($form);
 
         expect(_.escape).toHaveBeenCalledWith(sampleComment);
-        expect(formContent).toEqual(
-          '<script>alert("Boom!");</script>',
-        );
+        expect(formContent).toEqual('<script>alert("Boom!");</script>');
       });
     });
 
@@ -845,8 +800,7 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
       });
 
       it('should return true when comment begins with a quick action', () => {
-        const sampleComment =
-          '/wip\n/milestone %1.0\n/merge\n/unassign Merging this';
+        const sampleComment = '/wip\n/milestone %1.0\n/merge\n/unassign Merging this';
         const hasQuickActions = this.notes.hasQuickActions(sampleComment);
 
         expect(hasQuickActions).toBeTruthy();
@@ -870,8 +824,7 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
     describe('stripQuickActions', () => {
       it('should strip quick actions from the comment which begins with a quick action', () => {
         this.notes = new Notes();
-        const sampleComment =
-          '/wip\n/milestone %1.0\n/merge\n/unassign Merging this';
+        const sampleComment = '/wip\n/milestone %1.0\n/merge\n/unassign Merging this';
         const stripedComment = this.notes.stripQuickActions(sampleComment);
 
         expect(stripedComment).toBe('');
@@ -879,8 +832,7 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
 
       it('should strip quick actions from the comment but leaves plain comment if it is present', () => {
         this.notes = new Notes();
-        const sampleComment =
-          '/wip\n/milestone %1.0\n/merge\n/unassign\nMerging this';
+        const sampleComment = '/wip\n/milestone %1.0\n/merge\n/unassign\nMerging this';
         const stripedComment = this.notes.stripQuickActions(sampleComment);
 
         expect(stripedComment).toBe('Merging this');
@@ -888,8 +840,7 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
 
       it('should NOT strip string that has slashes within', () => {
         this.notes = new Notes();
-        const sampleComment =
-          'http://127.0.0.1:3000/root/gitlab-shell/issues/1';
+        const sampleComment = 'http://127.0.0.1:3000/root/gitlab-shell/issues/1';
         const stripedComment = this.notes.stripQuickActions(sampleComment);
 
         expect(stripedComment).toBe(sampleComment);
@@ -909,29 +860,21 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
 
       it('should return executing quick action description when note has single quick action', () => {
         const sampleComment = '/close';
-        expect(
-          this.notes.getQuickActionDescription(
-            sampleComment,
-            availableQuickActions,
-          ),
-        ).toBe('Applying command to close this issue');
+        expect(this.notes.getQuickActionDescription(sampleComment, availableQuickActions)).toBe(
+          'Applying command to close this issue',
+        );
       });
 
       it('should return generic multiple quick action description when note has multiple quick actions', () => {
         const sampleComment = '/close\n/title [Duplicate] Issue foobar';
-        expect(
-          this.notes.getQuickActionDescription(
-            sampleComment,
-            availableQuickActions,
-          ),
-        ).toBe('Applying multiple commands');
+        expect(this.notes.getQuickActionDescription(sampleComment, availableQuickActions)).toBe(
+          'Applying multiple commands',
+        );
       });
 
       it('should return generic quick action description when available quick actions list is not populated', () => {
         const sampleComment = '/close\n/title [Duplicate] Issue foobar';
-        expect(this.notes.getQuickActionDescription(sampleComment)).toBe(
-          'Applying command',
-        );
+        expect(this.notes.getQuickActionDescription(sampleComment)).toBe('Applying command');
       });
     });
 
@@ -961,17 +904,11 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
         expect($tempNote.attr('id')).toEqual(uniqueId);
         expect($tempNote.hasClass('being-posted')).toBeTruthy();
         expect($tempNote.hasClass('fade-in-half')).toBeTruthy();
-        $tempNote
-          .find('.timeline-icon > a, .note-header-info > a')
-          .each(function() {
-            expect($(this).attr('href')).toEqual(`/${currentUsername}`);
-          });
-        expect($tempNote.find('.timeline-icon .avatar').attr('src')).toEqual(
-          currentUserAvatar,
-        );
-        expect(
-          $tempNote.find('.timeline-content').hasClass('discussion'),
-        ).toBeFalsy();
+        $tempNote.find('.timeline-icon > a, .note-header-info > a').each(function() {
+          expect($(this).attr('href')).toEqual(`/${currentUsername}`);
+        });
+        expect($tempNote.find('.timeline-icon .avatar').attr('src')).toEqual(currentUserAvatar);
+        expect($tempNote.find('.timeline-content').hasClass('discussion')).toBeFalsy();
         expect(
           $tempNoteHeader
             .find('.d-none.d-sm-inline-block')
@@ -1002,9 +939,7 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
         });
 
         expect($tempNote.prop('nodeName')).toEqual('LI');
-        expect(
-          $tempNote.find('.timeline-content').hasClass('discussion'),
-        ).toBeTruthy();
+        expect($tempNote.find('.timeline-content').hasClass('discussion')).toBeTruthy();
       });
 
       it('should return a escaped user name', () => {
@@ -1061,11 +996,7 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
       });
 
       it('shows a flash message', () => {
-        this.notes.addFlash(
-          'Error message',
-          FLASH_TYPE_ALERT,
-          this.notes.parentTimeline.get(0),
-        );
+        this.notes.addFlash('Error message', FLASH_TYPE_ALERT, this.notes.parentTimeline.get(0));
 
         expect($('.flash-alert').is(':visible')).toBeTruthy();
       });
@@ -1078,11 +1009,7 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
       });
 
       it('hides visible flash message', () => {
-        this.notes.addFlash(
-          'Error message 1',
-          FLASH_TYPE_ALERT,
-          this.notes.parentTimeline.get(0),
-        );
+        this.notes.addFlash('Error message 1', FLASH_TYPE_ALERT, this.notes.parentTimeline.get(0));
 
         this.notes.clearFlash();