Fix merge button dropdown (CE)ce-nfriend-fix-the-merge-button

This commit fixes an issue that was causing the merge button dropdown
trigger to be shown even if the dropdown itself was hidden. This commit
also fixes an issue that caused the "Merge Immediately" option not to be
available when merge trains were enabled.

3 files changed, 18 insertions, 16 deletions

diff --git a/app/assets/javascripts/vue_merge_request_widget/components/states/ready_to_merge.vue b/app/assets/javascripts/vue_merge_request_widget/components/states/ready_to_merge.vue
index d4514767912..e294e1de976 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/states/ready_to_merge.vue
+++ b/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"
             >
diff --git a/app/assets/javascripts/vue_merge_request_widget/mixins/ready_to_merge.js b/app/assets/javascripts/vue_merge_request_widget/mixins/ready_to_merge.js
index 116d537c463..eef49e20159 100644
--- a/app/assets/javascripts/vue_merge_request_widget/mixins/ready_to_merge.js
+++ b/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;
+    },
   },
 };
diff --git a/spec/javascripts/vue_mr_widget/components/states/mr_widget_ready_to_merge_spec.js b/spec/javascripts/vue_mr_widget/components/states/mr_widget_ready_to_merge_spec.js
index ba3ba01944d..53e1f077610 100644
--- a/spec/javascripts/vue_mr_widget/components/states/mr_widget_ready_to_merge_spec.js
+++ b/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);
       });
     });