Merge branch 'acet-mr-widget-fix-link' into 'master'

MRWidget: Fix target branch link.

See merge request !11267

6 files changed, 16 insertions, 9 deletions

diff --git a/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_header.js b/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_header.js
index 4a1fd881169..fb648d66a30 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_header.js
+++ b/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_header.js
@@ -83,7 +83,7 @@ export default {
           :title="isBranchTitleLong(mr.targetBranch) ? mr.targetBranch : ''"
           data-placement="bottom">
           <a
-            :href="mr.targetBranchCommitsPath">
+            :href="mr.targetBranchPath">
             {{mr.targetBranch}}
           </a>
         </span>
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_closed.js b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_closed.js
index 7e66441e5ff..fc2e42c6821 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_closed.js
+++ b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_closed.js
@@ -20,7 +20,7 @@ export default {
         <p>
           The changes were not merged into
           <a
-            :href="mr.targetBranchCommitsPath"
+            :href="mr.targetBranchPath"
             class="label-branch">
             {{mr.targetBranch}}</a>.
         </p>
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_locked.js b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_locked.js
index e3c27dfb76d..0bd31731a0b 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_locked.js
+++ b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_locked.js
@@ -16,7 +16,7 @@ export default {
           The changes will be merged into
           <span class="label-branch">
             <a :href="mr.targetBranchPath">{{mr.targetBranch}}</a>
-          </span>
+          </span>.
         </p>
       </section>
     </div>
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merge_when_pipeline_succeeds.js b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merge_when_pipeline_succeeds.js
index bcdbedcd46b..419d174f3ff 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merge_when_pipeline_succeeds.js
+++ b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merge_when_pipeline_succeeds.js
@@ -87,7 +87,7 @@ export default {
             :href="mr.targetBranchPath"
             class="label-branch">
             {{mr.targetBranch}}
-          </a>
+          </a>.
         </p>
         <p v-if="mr.shouldRemoveSourceBranch">
           The source branch will be removed.
diff --git a/spec/javascripts/vue_mr_widget/components/mr_widget_header_spec.js b/spec/javascripts/vue_mr_widget/components/mr_widget_header_spec.js
index 48f816c8460..7f3eea7d2e5 100644
--- a/spec/javascripts/vue_mr_widget/components/mr_widget_header_spec.js
+++ b/spec/javascripts/vue_mr_widget/components/mr_widget_header_spec.js
@@ -48,10 +48,12 @@ describe('MRWidgetHeader', () => {
   describe('template', () => {
     let vm;
     let el;
+    const sourceBranchPath = '/foo/bar/mr-widget-refactor';
     const mr = {
       divergedCommitsCount: 12,
       sourceBranch: 'mr-widget-refactor',
-      sourceBranchLink: '/foo/bar/mr-widget-refactor',
+      sourceBranchLink: `<a href="${sourceBranchPath}">mr-widget-refactor</a>`,
+      targetBranchPath: 'foo/bar/commits-path',
       targetBranch: 'master',
       isOpen: true,
       emailPatchesPath: '/mr/email-patches',
@@ -65,8 +67,13 @@ describe('MRWidgetHeader', () => {
 
     it('should render template elements correctly', () => {
       expect(el.classList.contains('mr-source-target')).toBeTruthy();
-      expect(el.querySelectorAll('.label-branch')[0].textContent).toContain(mr.sourceBranch);
-      expect(el.querySelectorAll('.label-branch')[1].textContent).toContain(mr.targetBranch);
+      const sourceBranchLink = el.querySelectorAll('.label-branch')[0];
+      const targetBranchLink = el.querySelectorAll('.label-branch')[1];
+
+      expect(sourceBranchLink.textContent).toContain(mr.sourceBranch);
+      expect(targetBranchLink.textContent).toContain(mr.targetBranch);
+      expect(sourceBranchLink.querySelector('a').getAttribute('href')).toEqual(sourceBranchPath);
+      expect(targetBranchLink.querySelector('a').getAttribute('href')).toEqual(mr.targetBranchPath);
       expect(el.querySelector('.diverged-commits-count').textContent).toContain('12 commits behind');
 
       expect(el.textContent).toContain('Check out branch');
diff --git a/spec/javascripts/vue_mr_widget/components/states/mr_widget_closed_spec.js b/spec/javascripts/vue_mr_widget/components/states/mr_widget_closed_spec.js
index 78a70725e94..47303d1e80f 100644
--- a/spec/javascripts/vue_mr_widget/components/states/mr_widget_closed_spec.js
+++ b/spec/javascripts/vue_mr_widget/components/states/mr_widget_closed_spec.js
@@ -3,7 +3,7 @@ import closedComponent from '~/vue_merge_request_widget/components/states/mr_wid
 
 const mr = {
   targetBranch: 'good-branch',
-  targetBranchCommitsPath: '/good-branch',
+  targetBranchPath: '/good-branch',
   closedBy: {
     name: 'Fatih Acet',
     username: 'fatihacet',
@@ -44,7 +44,7 @@ describe('MRWidgetClosed', () => {
       expect(el.querySelector('h4').textContent).toContain('Closed by');
       expect(el.querySelector('h4').textContent).toContain(mr.closedBy.name);
       expect(el.textContent).toContain('The changes were not merged into');
-      expect(el.querySelector('.label-branch').getAttribute('href')).toEqual(mr.targetBranchCommitsPath);
+      expect(el.querySelector('.label-branch').getAttribute('href')).toEqual(mr.targetBranchPath);
       expect(el.querySelector('.label-branch').textContent).toContain(mr.targetBranch);
     });
   });