Fixes merge request controls not being visible

This fixes a bug where viewing a commit in a single commit
merge request would throw a JavaScript error and not
display the merge request controls.

Closes https://gitlab.com/gitlab-org/gitlab/-/issues/326801

app/assets/javascripts/diffs/components/compare_versions.vue

@@ -142,7 +142,7 @@ export default {
         </gl-button-group>
       </div>
       <gl-sprintf
-        v-else-if="hasSourceVersions"
+        v-else-if="!commit && hasSourceVersions"
         class="d-flex align-items-center compare-versions-container"
         :message="s__('MergeRequest|Compare %{target} and %{source}')"
       >

changelogs/unreleased/ph-326801-singleCommitMergeRequestControls.yml

+---
+title: Fixes merge request controls not visible when merge request has single commit
+merge_request:
+author:
+type: fixed

spec/frontend/diffs/components/compare_versions_spec.js

@@ -19,8 +19,11 @@ describe('CompareVersions', () => {
   const targetBranchName = 'tmp-wine-dev';
   const { commit } = getDiffWithCommit();
 
-  const createWrapper = (props = {}, commitArgs = {}) => {
+  const createWrapper = (props = {}, commitArgs = {}, createCommit = true) => {
+    if (createCommit) {
       store.state.diffs.commit = { ...store.state.diffs.commit, ...commitArgs };
+    }
+
     wrapper = mount(CompareVersionsComponent, {
       localVue,
       store,
@@ -59,7 +62,7 @@ describe('CompareVersions', () => {
 
   describe('template', () => {
     beforeEach(() => {
-      createWrapper();
+      createWrapper({}, {}, false);
     });
 
     it('should render Tree List toggle button with correct attribute values', () => {