Merge branch 'ce-nfriend-fix-the-merge-button' into 'master'

CE backport for gitlab-org/gitlab-ee!14894: Fix the merge button dropdown

See merge request gitlab-org/gitlab-ce!31248

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

@@ -94,9 +94,6 @@ export default {
 
       return __('Merge');
     },
-    shouldShowMergeOptionsDropdown() {
-      return this.isAutoMergeAvailable && !this.mr.onlyAllowMergeIfPipelineSucceeds;
-    },
     isRemoveSourceBranchButtonDisabled() {
       return this.isMergeButtonDisabled;
     },
@@ -246,7 +243,7 @@ export default {
               {{ mergeButtonText }}
             </button>
             <button
-              v-if="isAutoMergeAvailable"
+              v-if="shouldShowMergeImmediatelyDropdown"
               :disabled="isMergeButtonDisabled"
               type="button"
               class="btn btn-sm btn-info dropdown-toggle js-merge-moment"
@@ -256,7 +253,7 @@ export default {
               <i class="fa fa-chevron-down qa-merge-moment-dropdown" aria-hidden="true"></i>
             </button>
             <ul
-              v-if="shouldShowMergeOptionsDropdown"
+              v-if="shouldShowMergeImmediatelyDropdown"
               class="dropdown-menu dropdown-menu-right"
               role="menu"
             >

app/assets/javascripts/vue_merge_request_widget/mixins/ready_to_merge.js

@@ -15,5 +15,8 @@ export default {
       // MWPS is currently the only auto merge strategy available in CE
       return __('Merge when pipeline succeeds');
     },
+    shouldShowMergeImmediatelyDropdown() {
+      return this.mr.isPipelineActive && !this.mr.onlyAllowMergeIfPipelineSucceeds;
+    },
   },
 };

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

@@ -236,24 +236,26 @@ describe('ReadyToMerge', () => {
       });
     });
 
-    describe('shouldShowMergeOptionsDropdown', () => {
-      it('should return false when no auto merge strategies are available', () => {
-        Vue.set(vm.mr, 'availableAutoMergeStrategies', []);
+    describe('shouldShowMergeImmediatelyDropdown', () => {
+      it('should return false if no pipeline is active', () => {
+        Vue.set(vm.mr, 'isPipelineActive', false);
+        Vue.set(vm.mr, 'onlyAllowMergeIfPipelineSucceeds', false);
 
-        expect(vm.shouldShowMergeOptionsDropdown).toBe(false);
+        expect(vm.shouldShowMergeImmediatelyDropdown).toBe(false);
       });
 
-      it('should return true when at least one auto merge strategy is available', () => {
-        Vue.set(vm.mr, 'availableAutoMergeStrategies', [ATMTWPS_MERGE_STRATEGY]);
+      it('should return false if "Pipelines must succeed" is enabled for the current project', () => {
+        Vue.set(vm.mr, 'isPipelineActive', true);
+        Vue.set(vm.mr, 'onlyAllowMergeIfPipelineSucceeds', true);
 
-        expect(vm.shouldShowMergeOptionsDropdown).toBe(true);
+        expect(vm.shouldShowMergeImmediatelyDropdown).toBe(false);
       });
 
-      it('should return false when pipeline active but only merge when pipeline succeeds set in project options', () => {
-        Vue.set(vm.mr, 'availableAutoMergeStrategies', [ATMTWPS_MERGE_STRATEGY]);
-        Vue.set(vm.mr, 'onlyAllowMergeIfPipelineSucceeds', true);
+      it('should return true if the MR\'s pipeline is active and "Pipelines must succeed" is not enabled for the current project', () => {
+        Vue.set(vm.mr, 'isPipelineActive', true);
+        Vue.set(vm.mr, 'onlyAllowMergeIfPipelineSucceeds', false);
 
-        expect(vm.shouldShowMergeOptionsDropdown).toBe(false);
+        expect(vm.shouldShowMergeImmediatelyDropdown).toBe(true);
       });
     });