Resolve "Remove links from Web IDE unexpectedly navigate you to a different page"
This commit is contained in:
parent
b8198897b9
commit
9f3bf8246d
|
@ -0,0 +1,41 @@
|
|||
<script>
|
||||
import Icon from '~/vue_shared/components/icon.vue';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Icon,
|
||||
},
|
||||
props: {
|
||||
file: {
|
||||
type: Object,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
showButtons() {
|
||||
return this.file.permalink;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div
|
||||
v-if="showButtons"
|
||||
class="pull-right ide-btn-group"
|
||||
>
|
||||
<a
|
||||
:href="file.permalink"
|
||||
target="_blank"
|
||||
:title="s__('IDE|Open in file view')"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<span class="vertical-align-middle">Open in file view</span>
|
||||
<icon
|
||||
name="external-link"
|
||||
css-classes="vertical-align-middle space-right"
|
||||
:size="16"
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
</template>
|
|
@ -1,84 +0,0 @@
|
|||
<script>
|
||||
import { __ } from '~/locale';
|
||||
import tooltip from '~/vue_shared/directives/tooltip';
|
||||
import Icon from '~/vue_shared/components/icon.vue';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Icon,
|
||||
},
|
||||
directives: {
|
||||
tooltip,
|
||||
},
|
||||
props: {
|
||||
file: {
|
||||
type: Object,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
showButtons() {
|
||||
return (
|
||||
this.file.rawPath || this.file.blamePath || this.file.commitsPath || this.file.permalink
|
||||
);
|
||||
},
|
||||
rawDownloadButtonLabel() {
|
||||
return this.file.binary ? __('Download') : __('Raw');
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div
|
||||
v-if="showButtons"
|
||||
class="float-right ide-btn-group"
|
||||
>
|
||||
<a
|
||||
v-tooltip
|
||||
v-if="!file.binary"
|
||||
:href="file.blamePath"
|
||||
:title="__('Blame')"
|
||||
class="btn btn-sm btn-transparent blame"
|
||||
>
|
||||
<icon
|
||||
name="blame"
|
||||
:size="16"
|
||||
/>
|
||||
</a>
|
||||
<a
|
||||
v-tooltip
|
||||
:href="file.commitsPath"
|
||||
:title="__('History')"
|
||||
class="btn btn-sm btn-transparent history"
|
||||
>
|
||||
<icon
|
||||
name="history"
|
||||
:size="16"
|
||||
/>
|
||||
</a>
|
||||
<a
|
||||
v-tooltip
|
||||
:href="file.permalink"
|
||||
:title="__('Permalink')"
|
||||
class="btn btn-sm btn-transparent permalink"
|
||||
>
|
||||
<icon
|
||||
name="link"
|
||||
:size="16"
|
||||
/>
|
||||
</a>
|
||||
<a
|
||||
v-tooltip
|
||||
:href="file.rawPath"
|
||||
target="_blank"
|
||||
class="btn btn-sm btn-transparent prepend-left-10 raw"
|
||||
rel="noopener noreferrer"
|
||||
:title="rawDownloadButtonLabel">
|
||||
<icon
|
||||
name="download"
|
||||
:size="16"
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
</template>
|
|
@ -6,12 +6,12 @@ import ContentViewer from '~/vue_shared/components/content_viewer/content_viewer
|
|||
import { activityBarViews, viewerTypes } from '../constants';
|
||||
import monacoLoader from '../monaco_loader';
|
||||
import Editor from '../lib/editor';
|
||||
import IdeFileButtons from './ide_file_buttons.vue';
|
||||
import ExternalLink from './external_link.vue';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
ContentViewer,
|
||||
IdeFileButtons,
|
||||
ExternalLink,
|
||||
},
|
||||
props: {
|
||||
file: {
|
||||
|
@ -224,7 +224,7 @@ export default {
|
|||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ide-file-buttons
|
||||
<external-link
|
||||
:file="file"
|
||||
/>
|
||||
</div>
|
||||
|
|
|
@ -0,0 +1,5 @@
|
|||
---
|
||||
title: Change the IDE file buttons for an "Open in file view" button
|
||||
merge_request: 19129
|
||||
author: Sam Beckham
|
||||
type: changed
|
|
@ -0,0 +1,35 @@
|
|||
import Vue from 'vue';
|
||||
import externalLink from '~/ide/components/external_link.vue';
|
||||
import createVueComponent from '../../helpers/vue_mount_component_helper';
|
||||
import { file } from '../helpers';
|
||||
|
||||
describe('ExternalLink', () => {
|
||||
const activeFile = file();
|
||||
let vm;
|
||||
|
||||
function createComponent() {
|
||||
const ExternalLink = Vue.extend(externalLink);
|
||||
|
||||
activeFile.permalink = 'test';
|
||||
|
||||
return createVueComponent(ExternalLink, {
|
||||
file: activeFile,
|
||||
});
|
||||
}
|
||||
|
||||
afterEach(() => {
|
||||
vm.$destroy();
|
||||
});
|
||||
|
||||
it('renders the external link with the correct href', done => {
|
||||
activeFile.binary = true;
|
||||
vm = createComponent();
|
||||
|
||||
vm.$nextTick(() => {
|
||||
const openLink = vm.$el.querySelector('a');
|
||||
|
||||
expect(openLink.href).toMatch(`/${activeFile.permalink}`);
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
|
@ -1,61 +0,0 @@
|
|||
import Vue from 'vue';
|
||||
import repoFileButtons from '~/ide/components/ide_file_buttons.vue';
|
||||
import createVueComponent from '../../helpers/vue_mount_component_helper';
|
||||
import { file } from '../helpers';
|
||||
|
||||
describe('RepoFileButtons', () => {
|
||||
const activeFile = file();
|
||||
let vm;
|
||||
|
||||
function createComponent() {
|
||||
const RepoFileButtons = Vue.extend(repoFileButtons);
|
||||
|
||||
activeFile.rawPath = 'test';
|
||||
activeFile.blamePath = 'test';
|
||||
activeFile.commitsPath = 'test';
|
||||
|
||||
return createVueComponent(RepoFileButtons, {
|
||||
file: activeFile,
|
||||
});
|
||||
}
|
||||
|
||||
afterEach(() => {
|
||||
vm.$destroy();
|
||||
});
|
||||
|
||||
it('renders Raw, Blame, History and Permalink', done => {
|
||||
vm = createComponent();
|
||||
|
||||
vm.$nextTick(() => {
|
||||
const raw = vm.$el.querySelector('.raw');
|
||||
const blame = vm.$el.querySelector('.blame');
|
||||
const history = vm.$el.querySelector('.history');
|
||||
|
||||
expect(raw.href).toMatch(`/${activeFile.rawPath}`);
|
||||
expect(raw.getAttribute('data-original-title')).toEqual('Raw');
|
||||
expect(blame.href).toMatch(`/${activeFile.blamePath}`);
|
||||
expect(blame.getAttribute('data-original-title')).toEqual('Blame');
|
||||
expect(history.href).toMatch(`/${activeFile.commitsPath}`);
|
||||
expect(history.getAttribute('data-original-title')).toEqual('History');
|
||||
expect(vm.$el.querySelector('.permalink').getAttribute('data-original-title')).toEqual(
|
||||
'Permalink',
|
||||
);
|
||||
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('renders Download', done => {
|
||||
activeFile.binary = true;
|
||||
vm = createComponent();
|
||||
|
||||
vm.$nextTick(() => {
|
||||
const raw = vm.$el.querySelector('.raw');
|
||||
|
||||
expect(raw.href).toMatch(`/${activeFile.rawPath}`);
|
||||
expect(raw.getAttribute('data-original-title')).toEqual('Download');
|
||||
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
Loading…
Reference in New Issue