Fix "Remove source branch" button in MR widget during MWPS state

Fix https://gitlab.com/gitlab-org/gitlab-ce/issues/4281

app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merge_when_pipeline_succeeds.vue

@@ -63,7 +63,7 @@
         };
 
         this.isRemovingSourceBranch = true;
-        this.service.mergeResource.save(options)
+        this.service.merge(options)
           .then(res => res.data)
           .then((data) => {
             if (data.status === 'merge_when_pipeline_succeeds') {

changelogs/unreleased/42814-fix-remove-source-branch-when-mwps.yml

+---
+title: Fix "Remove source branch" button in Merge request widget during merge when pipeline
+  succeeds state
+merge_request: 17192
+author:
+type: fixed

spec/features/merge_request/user_merges_when_pipeline_succeeds_spec.rb

@@ -125,6 +125,12 @@ describe 'Merge request > User merges when pipeline succeeds', :js do
       expect(page).to have_content "canceled the automatic merge"
     end
 
+    it 'allows to remove source branch' do
+      click_link "Remove source branch"
+
+      expect(page).to have_content "The source branch will be removed"
+    end
+
     context 'when pipeline succeeds' do
       before do
         build.success

spec/javascripts/vue_mr_widget/components/states/mr_widget_merge_when_pipeline_succeeds_spec.js

 import Vue from 'vue';
 import mwpsComponent from '~/vue_merge_request_widget/components/states/mr_widget_merge_when_pipeline_succeeds.vue';
+import MRWidgetService from '~/vue_merge_request_widget/services/mr_widget_service';
 import eventHub from '~/vue_merge_request_widget/event_hub';
 import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
@@ -25,12 +26,7 @@ describe('MRWidgetMergeWhenPipelineSucceeds', () => {
         targetBranchPath,
         targetBranch,
       },
-      service: {
-        cancelAutomaticMerge() {},
-        mergeResource: {
-          save() {},
-        },
-      },
+      service: new MRWidgetService({}),
     });
   });
 
@@ -90,18 +86,16 @@ describe('MRWidgetMergeWhenPipelineSucceeds', () => {
 
     describe('removeSourceBranch', () => {
       it('should set flag and call service then request main component to update the widget', (done) => {
-        spyOn(vm.service.mergeResource, 'save').and.returnValue(new Promise((resolve) => {
-          resolve({
-            data: {
-              status: 'merge_when_pipeline_succeeds',
-            },
-          });
+        spyOn(vm.service, 'merge').and.returnValue(Promise.resolve({
+          data: {
+            status: 'merge_when_pipeline_succeeds',
+          },
         }));
 
         vm.removeSourceBranch();
         setTimeout(() => {
           expect(eventHub.$emit).toHaveBeenCalledWith('MRWidgetUpdateRequested');
-          expect(vm.service.mergeResource.save).toHaveBeenCalledWith({
+          expect(vm.service.merge).toHaveBeenCalledWith({
             sha,
             merge_when_pipeline_succeeds: true,
             should_remove_source_branch: true,