Merge branch '352932-fix-blob-breadcrumb' into 'master'

Fix blob breadcrumb link

See merge request gitlab-org/gitlab!81128

app/assets/javascripts/repository/components/breadcrumbs.vue

@@ -148,11 +148,16 @@ export default {
         .reduce(
           (acc, name, i) => {
             const path = joinPaths(i > 0 ? acc[i].path : '', escapeFileUrl(name));
+            const isLastPath = i === this.currentPath.split('/').length - 1;
+            const to =
+              this.isBlobPath && isLastPath
+                ? `/-/blob/${joinPaths(this.escapedRef, path)}`
+                : `/-/tree/${joinPaths(this.escapedRef, path)}`;
 
             return acc.concat({
               name,
               path,
-              to: `/-/tree/${joinPaths(this.escapedRef, path)}`,
+              to,
             });
           },
           [
@@ -274,9 +279,11 @@ export default {
 
       return items;
     },
+    isBlobPath() {
+      return this.$route.name === 'blobPath' || this.$route.name === 'blobPathDecoded';
+    },
     renderAddToTreeDropdown() {
-      const isBlobPath = this.$route.name === 'blobPath' || this.$route.name === 'blobPathDecoded';
-      return !isBlobPath && (this.canCollaborate || this.canCreateMrFromFork);
+      return !this.isBlobPath && (this.canCollaborate || this.canCreateMrFromFork);
     },
   },
   methods: {

spec/frontend/repository/components/breadcrumbs_spec.js

@@ -59,6 +59,20 @@ describe('Repository breadcrumbs component', () => {
     expect(wrapper.findAll(RouterLinkStub).length).toEqual(linkCount);
   });
 
+  it.each`
+    routeName            | path                        | linkTo
+    ${'treePath'}        | ${'app/assets/javascripts'} | ${'/-/tree/app/assets/javascripts'}
+    ${'treePathDecoded'} | ${'app/assets/javascripts'} | ${'/-/tree/app/assets/javascripts'}
+    ${'blobPath'}        | ${'app/assets/index.js'}    | ${'/-/blob/app/assets/index.js'}
+    ${'blobPathDecoded'} | ${'app/assets/index.js'}    | ${'/-/blob/app/assets/index.js'}
+  `(
+    'links to the correct router path when routeName is $routeName',
+    ({ routeName, path, linkTo }) => {
+      factory(path, {}, { name: routeName });
+      expect(wrapper.findAll(RouterLinkStub).at(3).props('to')).toEqual(linkTo);
+    },
+  );
+
   it('escapes hash in directory path', () => {
     factory('app/assets/javascripts#');