diff options
author | Clement Ho <clemmakesapps@gmail.com> | 2019-04-01 18:28:37 +0300 |
---|---|---|
committer | Clement Ho <clemmakesapps@gmail.com> | 2019-04-01 18:28:37 +0300 |
commit | f87ff7af538a6ac559217a4c7cfa0fd75f247fd6 (patch) | |
tree | 3ca07716df7a2d08f04d962ed72b9d44114cfda5 /app/assets/javascripts/diffs | |
parent | b224efe767e4f8e24b51b87753f55bf6d3129f68 (diff) | |
parent | a9441396daac861a381c50cef0766f929b1b26b6 (diff) |
Merge branch '57669-fix-bug-clicking-file-header-refreshes-page' into 'master'
Fix bug where clicking file header in diff refreshes page
Closes #57669
See merge request gitlab-org/gitlab-ce!26422
Diffstat (limited to 'app/assets/javascripts/diffs')
-rw-r--r-- | app/assets/javascripts/diffs/components/diff_file.vue | 30 | ||||
-rw-r--r-- | app/assets/javascripts/diffs/components/diff_file_header.vue | 30 |
2 files changed, 45 insertions, 15 deletions
diff --git a/app/assets/javascripts/diffs/components/diff_file.vue b/app/assets/javascripts/diffs/components/diff_file.vue index 0e779e1be9a..58a9605c181 100644 --- a/app/assets/javascripts/diffs/components/diff_file.vue +++ b/app/assets/javascripts/diffs/components/diff_file.vue @@ -170,21 +170,23 @@ export default { </div> <gl-loading-icon v-if="showLoadingIcon" class="diff-content loading" /> <template v-else> - <div v-if="errorMessage" class="diff-viewer"> - <div class="nothing-here-block" v-html="errorMessage"></div> + <div :id="`diff-content-${file.file_hash}`"> + <div v-if="errorMessage" class="diff-viewer"> + <div class="nothing-here-block" v-html="errorMessage"></div> + </div> + <div v-else-if="isCollapsed" class="nothing-here-block diff-collapsed"> + {{ __('This diff is collapsed.') }} + <a class="click-to-expand js-click-to-expand" href="#" @click.prevent="handleToggle">{{ + __('Click to expand it.') + }}</a> + </div> + <diff-content + v-else + :class="{ hidden: isCollapsed || isFileTooLarge }" + :diff-file="file" + :help-page-path="helpPagePath" + /> </div> - <div v-else-if="isCollapsed" class="nothing-here-block diff-collapsed"> - {{ __('This diff is collapsed.') }} - <a class="click-to-expand js-click-to-expand" href="#" @click.prevent="handleToggle">{{ - __('Click to expand it.') - }}</a> - </div> - <diff-content - v-else - :class="{ hidden: isCollapsed || isFileTooLarge }" - :diff-file="file" - :help-page-path="helpPagePath" - /> </template> <div v-if="isFileTooLarge" class="nothing-here-block diff-collapsed js-too-large-diff"> {{ __('This source diff could not be displayed because it is too large.') }} diff --git a/app/assets/javascripts/diffs/components/diff_file_header.vue b/app/assets/javascripts/diffs/components/diff_file_header.vue index d41d1464166..fda7b7c5fd9 100644 --- a/app/assets/javascripts/diffs/components/diff_file_header.vue +++ b/app/assets/javascripts/diffs/components/diff_file_header.vue @@ -11,6 +11,7 @@ import { __, s__, sprintf } from '~/locale'; import { diffViewerModes } from '~/ide/constants'; import EditButton from './edit_button.vue'; import DiffStats from './diff_stats.vue'; +import { scrollToElement } from '~/lib/utils/common_utils'; export default { components: { @@ -66,6 +67,9 @@ export default { hasExpandedDiscussions() { return this.diffHasExpandedDiscussions(this.diffFile); }, + diffContentIDSelector() { + return `#diff-content-${this.diffFile.file_hash}`; + }, icon() { if (this.diffFile.submodule) { return 'archive'; @@ -77,6 +81,11 @@ export default { if (this.diffFile.submodule) { return this.diffFile.submodule_tree_url || this.diffFile.submodule_link; } + + if (!this.discussionPath) { + return this.diffContentIDSelector; + } + return this.discussionPath; }, filePath() { @@ -149,6 +158,18 @@ export default { handleToggleDiscussions() { this.toggleFileDiscussions(this.diffFile); }, + handleFileNameClick(e) { + const isLinkToOtherPage = + this.diffFile.submodule_tree_url || this.diffFile.submodule_link || this.discussionPath; + + if (!isLinkToOtherPage) { + e.preventDefault(); + const selector = this.diffContentIDSelector; + + scrollToElement(document.querySelector(selector)); + window.location.hash = selector; + } + }, }, }; </script> @@ -168,7 +189,14 @@ export default { class="diff-toggle-caret append-right-5" @click.stop="handleToggle" /> - <a v-once ref="titleWrapper" :href="titleLink" class="append-right-4 js-title-wrapper"> + <a + v-once + id="diffFile.file_path" + ref="titleWrapper" + class="append-right-4 js-title-wrapper" + :href="titleLink" + @click="handleFileNameClick" + > <file-icon :file-name="filePath" :size="18" |