Merge branch 'ph/207121/shaMismatchCanMerge' into 'master'

Fixes merge button showing incorrectly

Closes #207121

See merge request gitlab-org/gitlab!30278

app/assets/javascripts/vue_merge_request_widget/stores/get_state_key.js

@@ -21,7 +21,7 @@ export default function deviseState(data) {
     return stateKey.unresolvedDiscussions;
   } else if (this.isPipelineBlocked) {
     return stateKey.pipelineBlocked;
-  } else if (this.isSHAMismatch) {
+  } else if (this.canMerge && this.isSHAMismatch) {
     return stateKey.shaMismatch;
   } else if (this.autoMergeEnabled) {
     return this.mergeError ? stateKey.autoMergeFailed : stateKey.autoMergeEnabled;

changelogs/unreleased/ph-207121-shaMismatchCanMerge.yml

+---
+title: Fixed enabled merge button incorrectly showing to users who can't merge
+merge_request:
+author:
+type: fixed

spec/frontend/vue_mr_widget/stores/get_state_key_spec.js

@@ -35,10 +35,12 @@ describe('getStateKey', () => {
 
     expect(bound()).toEqual('autoMergeEnabled');
 
+    context.canMerge = true;
     context.isSHAMismatch = true;
 
     expect(bound()).toEqual('shaMismatch');
 
+    context.canMerge = false;
     context.isPipelineBlocked = true;
 
     expect(bound()).toEqual('pipelineBlocked');
@@ -100,4 +102,26 @@ describe('getStateKey', () => {
 
     expect(bound()).toEqual('rebase');
   });
+
+  it.each`
+    canMerge | isSHAMismatch | stateKey
+    ${true}  | ${true}       | ${'shaMismatch'}
+    ${false} | ${true}       | ${'notAllowedToMerge'}
+    ${false} | ${false}      | ${'notAllowedToMerge'}
+  `(
+    'returns $stateKey when canMerge is $canMerge and isSHAMismatch is $isSHAMismatch',
+    ({ canMerge, isSHAMismatch, stateKey }) => {
+      const bound = getStateKey.bind(
+        {
+          canMerge,
+          isSHAMismatch,
+        },
+        {
+          commits_count: 2,
+        },
+      );
+
+      expect(bound()).toEqual(stateKey);
+    },
+  );
 });