Merge branch 'ph/p207499/fixNonAsciiChars' into 'master'

Fixes Vue file list for paths with non-ascii characters

Closes #207499

See merge request gitlab-org/gitlab!25877

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

 <script>
 import { GlDropdown, GlDropdownDivider, GlDropdownHeader, GlDropdownItem } from '@gitlab/ui';
+import { joinPaths } from '~/lib/utils/url_utility';
 import { __ } from '../../locale';
 import Icon from '../../vue_shared/components/icon.vue';
 import getRefMixin from '../mixins/get_ref';
@@ -102,12 +103,12 @@ export default {
         .filter(p => p !== '')
         .reduce(
           (acc, name, i) => {
-            const path = `${i > 0 ? acc[i].path : ''}/${name}`;
+            const path = joinPaths(i > 0 ? acc[i].path : '', encodeURIComponent(name));
 
             return acc.concat({
               name,
               path,
-              to: `/-/tree/${escape(this.ref)}${escape(path)}`,
+              to: `/-/tree/${joinPaths(escape(this.ref), path)}`,
             });
           },
           [

app/assets/javascripts/repository/components/table/row.vue

@@ -91,7 +91,9 @@ export default {
   },
   computed: {
     routerLinkTo() {
-      return this.isFolder ? { path: `/-/tree/${escape(this.ref)}/${escape(this.path)}` } : null;
+      return this.isFolder
+        ? { path: `/-/tree/${escape(this.ref)}/${encodeURIComponent(this.path)}` }
+        : null;
     },
     iconName() {
       return `fa-${getIconName(this.type, this.path)}`;
@@ -141,6 +143,7 @@ export default {
       <i v-else :aria-label="type" role="img" :class="iconName" class="fa fa-fw"></i>
       <component
         :is="linkComponent"
+        ref="link"
         :to="routerLinkTo"
         :href="url"
         class="str-truncated"

app/assets/javascripts/repository/log_tree.js

@@ -27,7 +27,7 @@ export function fetchLogsTree(client, path, offset, resolver = null) {
 
   fetchpromise = axios
     .get(
-      `${gon.relative_url_root}/${projectPath}/-/refs/${escape(ref)}/logs_tree/${escape(
+      `${gon.relative_url_root}/${projectPath}/-/refs/${escape(ref)}/logs_tree/${encodeURIComponent(
         path.replace(/^\//, ''),
       )}`,
       {

changelogs/unreleased/ph-p207499-fixNonAsciiChars.yml

+---
+title: Fixed repository browsing for folders with non-ascii characters
+merge_request: 25877
+author:
+type: fixed

lib/gitlab/tree_summary.rb

@@ -69,7 +69,7 @@ module Gitlab
     end
 
     def entry_path(entry)
-      File.join(*[path, entry[:file_name]].compact)
+      File.join(*[path, entry[:file_name]].compact).force_encoding(Encoding::ASCII_8BIT)
     end
 
     def build_entry(entry)

spec/features/projects/tree/tree_show_spec.rb

@@ -37,6 +37,16 @@ describe 'Projects tree', :js do
     expect(page).not_to have_selector('.flash-alert')
   end
 
+  it 'renders tree table with non-ASCII filenames without errors' do
+    visit project_tree_path(project, File.join(test_sha, 'encoding'))
+    wait_for_requests
+
+    expect(page).to have_selector('.tree-item')
+    expect(page).to have_content('Files, encoding and much more')
+    expect(page).to have_content('テスト.txt')
+    expect(page).not_to have_selector('.flash-alert')
+  end
+
   context 'gravatar disabled' do
     let(:gravatar_enabled) { false }
 

spec/frontend/repository/components/breadcrumbs_spec.js

@@ -41,7 +41,7 @@ describe('Repository breadcrumbs component', () => {
         .findAll(RouterLinkStub)
         .at(3)
         .props('to'),
-    ).toEqual('/-/tree//app/assets/javascripts%23');
+    ).toEqual('/-/tree/app/assets/javascripts%23');
   });
 
   it('renders last link as active', () => {

spec/frontend/repository/components/table/row_spec.js

@@ -109,6 +109,26 @@ describe('Repository table row component', () => {
     });
   });
 
+  it.each`
+    path
+    ${'test#'}
+    ${'Änderungen'}
+  `('renders link for $path', ({ path }) => {
+    factory({
+      id: '1',
+      sha: '123',
+      path,
+      type: 'tree',
+      currentPath: '/',
+    });
+
+    return vm.vm.$nextTick().then(() => {
+      expect(vm.find({ ref: 'link' }).props('to')).toEqual({
+        path: `/-/tree/master/${encodeURIComponent(path)}`,
+      });
+    });
+  });
+
   it('pushes new route for directory with hash', () => {
     factory({
       id: '1',

spec/lib/gitlab/tree_summary_spec.rb

@@ -129,6 +129,17 @@ describe Gitlab::TreeSummary do
         expect(commits).to satisfy_one { |c| c.id == whitespace_commit_sha }
       end
     end
+
+    context 'in a subdirectory with non-ASCII filenames' do
+      let(:path) { 'encoding' }
+
+      it 'returns commits for entries in the subdirectory' do
+        entry = entries.find { |x| x[:file_name] == 'テスト.txt' }
+
+        expect(entry).to be_a(Hash)
+        expect(entry).to include(:commit)
+      end
+    end
   end
 
   describe '#more?' do