Moves widget header into a vue file
This commit is contained in:
Filipa Lacerda
parent
1533cf1053
commit
3d89a03e72
6 changed files with 355 additions and 216 deletions
|
|
@ -1,117 +0,0 @@
|
|||
import tooltip from '../../vue_shared/directives/tooltip';
|
||||
import { pluralize } from '../../lib/utils/text_utility';
|
||||
import icon from '../../vue_shared/components/icon.vue';
|
||||
|
||||
export default {
|
||||
name: 'MRWidgetHeader',
|
||||
props: {
|
||||
mr: { type: Object, required: true },
|
||||
},
|
||||
directives: {
|
||||
tooltip,
|
||||
},
|
||||
components: {
|
||||
icon,
|
||||
},
|
||||
computed: {
|
||||
shouldShowCommitsBehindText() {
|
||||
return this.mr.divergedCommitsCount > 0;
|
||||
},
|
||||
commitsText() {
|
||||
return pluralize('commit', this.mr.divergedCommitsCount);
|
||||
},
|
||||
branchNameClipboardData() {
|
||||
// This supports code in app/assets/javascripts/copy_to_clipboard.js that
|
||||
// works around ClipboardJS limitations to allow the context-specific
|
||||
// copy/pasting of plain text or GFM.
|
||||
return JSON.stringify({
|
||||
text: this.mr.sourceBranch,
|
||||
gfm: `\`${this.mr.sourceBranch}\``,
|
||||
});
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
isBranchTitleLong(branchTitle) {
|
||||
return branchTitle.length > 32;
|
||||
},
|
||||
},
|
||||
template: `
|
||||
<div class="mr-source-target">
|
||||
<div class="normal">
|
||||
<strong>
|
||||
Request to merge
|
||||
<span
|
||||
class="label-branch"
|
||||
:class="{'label-truncated': isBranchTitleLong(mr.sourceBranch)}"
|
||||
:title="isBranchTitleLong(mr.sourceBranch) ? mr.sourceBranch : ''"
|
||||
data-placement="bottom"
|
||||
:v-tooltip="isBranchTitleLong(mr.sourceBranch)"
|
||||
v-html="mr.sourceBranchLink"></span>
|
||||
<button
|
||||
v-tooltip
|
||||
class="btn btn-transparent btn-clipboard"
|
||||
data-title="Copy branch name to clipboard"
|
||||
:data-clipboard-text="branchNameClipboardData">
|
||||
<i
|
||||
aria-hidden="true"
|
||||
class="fa fa-clipboard"></i>
|
||||
</button>
|
||||
into
|
||||
<span
|
||||
class="label-branch"
|
||||
:v-tooltip="isBranchTitleLong(mr.sourceBranch)"
|
||||
:class="{'label-truncatedtooltip': isBranchTitleLong(mr.targetBranch)}"
|
||||
:title="isBranchTitleLong(mr.targetBranch) ? mr.targetBranch : ''"
|
||||
data-placement="bottom">
|
||||
<a :href="mr.targetBranchTreePath">{{mr.targetBranch}}</a>
|
||||
</span>
|
||||
</strong>
|
||||
<span
|
||||
v-if="shouldShowCommitsBehindText"
|
||||
class="diverged-commits-count">
|
||||
(<a :href="mr.targetBranchPath">{{mr.divergedCommitsCount}} {{commitsText}} behind</a>)
|
||||
</span>
|
||||
</div>
|
||||
<div v-if="mr.isOpen">
|
||||
<a
|
||||
href="#modal_merge_info"
|
||||
data-toggle="modal"
|
||||
:disabled="mr.sourceBranchRemoved"
|
||||
class="btn btn-sm inline">
|
||||
Check out branch
|
||||
</a>
|
||||
<span class="dropdown prepend-left-10">
|
||||
<a
|
||||
class="btn btn-sm inline dropdown-toggle"
|
||||
data-toggle="dropdown"
|
||||
aria-label="Download as"
|
||||
role="button">
|
||||
<icon
|
||||
name="download">
|
||||
</icon>
|
||||
<i
|
||||
class="fa fa-caret-down"
|
||||
aria-hidden="true">
|
||||
</i>
|
||||
</a>
|
||||
<ul class="dropdown-menu dropdown-menu-align-right">
|
||||
<li>
|
||||
<a
|
||||
:href="mr.emailPatchesPath"
|
||||
download>
|
||||
Email patches
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
:href="mr.plainDiffPath"
|
||||
download>
|
||||
Plain diff
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
`,
|
||||
};
|
||||
|
|
@ -0,0 +1,139 @@
|
|||
<script>
|
||||
import tooltip from '~/vue_shared/directives/tooltip';
|
||||
import { n__ } from '~/locale';
|
||||
import icon from '~/vue_shared/components/icon.vue';
|
||||
import clipboardButton from '~/vue_shared/components/clipboard_button.vue';
|
||||
|
||||
export default {
|
||||
name: 'MRWidgetHeader',
|
||||
directives: {
|
||||
tooltip,
|
||||
},
|
||||
components: {
|
||||
icon,
|
||||
clipboardButton,
|
||||
},
|
||||
props: {
|
||||
mr: {
|
||||
type: Object,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
shouldShowCommitsBehindText() {
|
||||
return this.mr.divergedCommitsCount > 0;
|
||||
},
|
||||
commitsText() {
|
||||
return n__('commit behind', 'commits behind', this.mr.divergedCommitsCount);
|
||||
},
|
||||
branchNameClipboardData() {
|
||||
// This supports code in app/assets/javascripts/copy_to_clipboard.js that
|
||||
// works around ClipboardJS limitations to allow the context-specific
|
||||
// copy/pasting of plain text or GFM.
|
||||
return JSON.stringify({
|
||||
text: this.mr.sourceBranch,
|
||||
gfm: `\`${this.mr.sourceBranch}\``,
|
||||
});
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
isBranchTitleLong(branchTitle) {
|
||||
return branchTitle.length > 32;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<template>
|
||||
<div class="mr-source-target">
|
||||
<div class="normal">
|
||||
<strong>
|
||||
{{ s__("mrWidget|Request to merge") }}
|
||||
<span
|
||||
class="label-branch js-source-branch"
|
||||
:class="{ 'label-truncated': isBranchTitleLong(mr.sourceBranch) }"
|
||||
:title="isBranchTitleLong(mr.sourceBranch) ? mr.sourceBranch : ''"
|
||||
data-placement="bottom"
|
||||
:v-tooltip="isBranchTitleLong(mr.sourceBranch)"
|
||||
v-html="mr.sourceBranchLink"
|
||||
>
|
||||
</span>
|
||||
|
||||
<clipboardButton
|
||||
:text="branchNameClipboardData"
|
||||
:title="__('Copy branch name to clipboard')"
|
||||
/>
|
||||
|
||||
{{ s__("mrWidget|into") }}
|
||||
|
||||
<span
|
||||
class="label-branch"
|
||||
:v-tooltip="isBranchTitleLong(mr.sourceBranch)"
|
||||
:class="{ 'label-truncatedtooltip': isBranchTitleLong(mr.targetBranch) }"
|
||||
:title="isBranchTitleLong(mr.targetBranch) ? mr.targetBranch : ''"
|
||||
data-placement="bottom"
|
||||
>
|
||||
<a
|
||||
:href="mr.targetBranchTreePath"
|
||||
class="js-target-branch"
|
||||
>
|
||||
{{ mr.targetBranch }}
|
||||
</a>
|
||||
</span>
|
||||
</strong>
|
||||
<span
|
||||
v-if="shouldShowCommitsBehindText"
|
||||
class="diverged-commits-count"
|
||||
>
|
||||
(<a :href="mr.targetBranchPath">{{ mr.divergedCommitsCount }} {{ commitsText }}</a>)
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div v-if="mr.isOpen">
|
||||
<button
|
||||
data-target="#modal_merge_info"
|
||||
data-toggle="modal"
|
||||
:disabled="mr.sourceBranchRemoved"
|
||||
class="btn btn-sm inline js-check-out-branch"
|
||||
type="button"
|
||||
>
|
||||
{{ s__("mrWidget|Check out branch") }}
|
||||
</button>
|
||||
<span class="dropdown prepend-left-10">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm inline dropdown-toggle"
|
||||
data-toggle="dropdown"
|
||||
aria-label="Download as"
|
||||
aria-haspopup="true"
|
||||
aria-expanded="false"
|
||||
>
|
||||
<icon name="download" />
|
||||
<i
|
||||
class="fa fa-caret-down"
|
||||
aria-hidden="true">
|
||||
</i>
|
||||
</button>
|
||||
<ul class="dropdown-menu dropdown-menu-align-right">
|
||||
<li>
|
||||
<a
|
||||
class="js-download-email-patches"
|
||||
:href="mr.emailPatchesPath"
|
||||
download
|
||||
>
|
||||
{{ s__("mrWidget|Email patches") }}
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="js-download-plain-diff"
|
||||
:href="mr.plainDiffPath"
|
||||
download
|
||||
>
|
||||
{{ s__("mrWidget|Plain diff") }}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -7,14 +7,14 @@
|
|||
missingBranch: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: ''
|
||||
default: '',
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
missingBranchInfo() {
|
||||
return sprintf(
|
||||
s__('mrWidget|If the %{branch} branch exists in your local repository, you can merge this merge request manually using the'),
|
||||
{ branch: this.missingBranch }
|
||||
{ branch: this.missingBranch },
|
||||
);
|
||||
},
|
||||
},
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@
|
|||
|
||||
export { default as Vue } from 'vue';
|
||||
export { default as SmartInterval } from '~/smart_interval';
|
||||
export { default as WidgetHeader } from './components/mr_widget_header';
|
||||
export { default as WidgetHeader } from './components/mr_widget_header.vue';
|
||||
export { default as WidgetMergeHelp } from './components/mr_widget_merge_help.vue';
|
||||
export { default as WidgetPipeline } from './components/mr_widget_pipeline.vue';
|
||||
export { default as WidgetDeployment } from './components/mr_widget_deployment';
|
||||
|
|
|
|||
|
|
@ -1,121 +1,220 @@
|
|||
import Vue from 'vue';
|
||||
import headerComponent from '~/vue_merge_request_widget/components/mr_widget_header';
|
||||
|
||||
const createComponent = (mr) => {
|
||||
const Component = Vue.extend(headerComponent);
|
||||
return new Component({
|
||||
el: document.createElement('div'),
|
||||
propsData: { mr },
|
||||
});
|
||||
};
|
||||
import headerComponent from '~/vue_merge_request_widget/components/mr_widget_header.vue';
|
||||
import mountComponent from '../../helpers/vue_mount_component_helper';
|
||||
|
||||
describe('MRWidgetHeader', () => {
|
||||
describe('props', () => {
|
||||
it('should have props', () => {
|
||||
const { mr } = headerComponent.props;
|
||||
let vm;
|
||||
let Component;
|
||||
|
||||
expect(mr.type instanceof Object).toBeTruthy();
|
||||
expect(mr.required).toBeTruthy();
|
||||
});
|
||||
beforeEach(() => {
|
||||
Component = Vue.extend(headerComponent);
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
vm.$destroy();
|
||||
});
|
||||
|
||||
describe('computed', () => {
|
||||
let vm;
|
||||
beforeEach(() => {
|
||||
vm = createComponent({
|
||||
divergedCommitsCount: 12,
|
||||
sourceBranch: 'mr-widget-refactor',
|
||||
sourceBranchLink: '/foo/bar/mr-widget-refactor',
|
||||
targetBranch: 'master',
|
||||
describe('shouldShowCommitsBehindText', () => {
|
||||
it('return true when there are divergedCommitsCount', () => {
|
||||
vm = mountComponent(Component, { mr: {
|
||||
divergedCommitsCount: 12,
|
||||
sourceBranch: 'mr-widget-refactor',
|
||||
sourceBranchLink: '<a href="/foo/bar/mr-widget-refactor">Link</a>',
|
||||
targetBranch: 'master',
|
||||
} });
|
||||
|
||||
expect(vm.shouldShowCommitsBehindText).toEqual(true);
|
||||
});
|
||||
|
||||
it('returns false where there are no divergedComits count', () => {
|
||||
vm = mountComponent(Component, { mr: {
|
||||
divergedCommitsCount: 0,
|
||||
sourceBranch: 'mr-widget-refactor',
|
||||
sourceBranchLink: '<a href="/foo/bar/mr-widget-refactor">Link</a>',
|
||||
targetBranch: 'master',
|
||||
} });
|
||||
expect(vm.shouldShowCommitsBehindText).toEqual(false);
|
||||
});
|
||||
});
|
||||
|
||||
it('shouldShowCommitsBehindText', () => {
|
||||
expect(vm.shouldShowCommitsBehindText).toBeTruthy();
|
||||
describe('commitsText', () => {
|
||||
it('returns singular when there is one commit', () => {
|
||||
vm = mountComponent(Component, { mr: {
|
||||
divergedCommitsCount: 1,
|
||||
sourceBranch: 'mr-widget-refactor',
|
||||
sourceBranchLink: '<a href="/foo/bar/mr-widget-refactor">Link</a>',
|
||||
targetBranch: 'master',
|
||||
} });
|
||||
|
||||
vm.mr.divergedCommitsCount = 0;
|
||||
expect(vm.shouldShowCommitsBehindText).toBeFalsy();
|
||||
});
|
||||
expect(vm.commitsText).toEqual('commit behind');
|
||||
});
|
||||
|
||||
it('commitsText', () => {
|
||||
expect(vm.commitsText).toEqual('commits');
|
||||
it('returns plural when there is more than one commit', () => {
|
||||
vm = mountComponent(Component, { mr: {
|
||||
divergedCommitsCount: 2,
|
||||
sourceBranch: 'mr-widget-refactor',
|
||||
sourceBranchLink: '<a href="/foo/bar/mr-widget-refactor">Link</a>',
|
||||
targetBranch: 'master',
|
||||
} });
|
||||
|
||||
vm.mr.divergedCommitsCount = 1;
|
||||
expect(vm.commitsText).toEqual('commit');
|
||||
expect(vm.commitsText).toEqual('commits behind');
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('template', () => {
|
||||
let vm;
|
||||
let el;
|
||||
let mr;
|
||||
const sourceBranchPath = '/foo/bar/mr-widget-refactor';
|
||||
describe('common elements', () => {
|
||||
beforeEach(() => {
|
||||
vm = mountComponent(Component, { mr: {
|
||||
divergedCommitsCount: 12,
|
||||
sourceBranch: 'mr-widget-refactor',
|
||||
sourceBranchLink: '<a href="/foo/bar/mr-widget-refactor">mr-widget-refactor</a>',
|
||||
sourceBranchRemoved: false,
|
||||
targetBranchPath: 'foo/bar/commits-path',
|
||||
targetBranchTreePath: 'foo/bar/tree/path',
|
||||
targetBranch: 'master',
|
||||
isOpen: true,
|
||||
emailPatchesPath: '/mr/email-patches',
|
||||
plainDiffPath: '/mr/plainDiffPath',
|
||||
} });
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
mr = {
|
||||
divergedCommitsCount: 12,
|
||||
sourceBranch: 'mr-widget-refactor',
|
||||
sourceBranchLink: `<a href="${sourceBranchPath}">mr-widget-refactor</a>`,
|
||||
sourceBranchRemoved: false,
|
||||
targetBranchPath: 'foo/bar/commits-path',
|
||||
targetBranchTreePath: 'foo/bar/tree/path',
|
||||
targetBranch: 'master',
|
||||
isOpen: true,
|
||||
emailPatchesPath: '/mr/email-patches',
|
||||
plainDiffPath: '/mr/plainDiffPath',
|
||||
};
|
||||
it('renders source branch link', () => {
|
||||
expect(
|
||||
vm.$el.querySelector('.js-source-branch').innerHTML,
|
||||
).toEqual('<a href="/foo/bar/mr-widget-refactor">mr-widget-refactor</a>');
|
||||
});
|
||||
|
||||
vm = createComponent(mr);
|
||||
el = vm.$el;
|
||||
});
|
||||
it('renders clipboard button', () => {
|
||||
expect(vm.$el.querySelector('.btn-clipboard')).not.toEqual(null);
|
||||
});
|
||||
|
||||
it('should render template elements correctly', () => {
|
||||
expect(el.classList.contains('mr-source-target')).toBeTruthy();
|
||||
const sourceBranchLink = el.querySelectorAll('.label-branch')[0];
|
||||
const targetBranchLink = el.querySelectorAll('.label-branch')[1];
|
||||
const commitsCount = el.querySelector('.diverged-commits-count');
|
||||
|
||||
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.targetBranchTreePath);
|
||||
expect(commitsCount.textContent).toContain('12 commits behind');
|
||||
expect(commitsCount.querySelector('a').getAttribute('href')).toEqual(mr.targetBranchPath);
|
||||
|
||||
expect(el.textContent).toContain('Check out branch');
|
||||
expect(el.querySelectorAll('.dropdown li a')[0].getAttribute('href')).toEqual(mr.emailPatchesPath);
|
||||
expect(el.querySelectorAll('.dropdown li a')[1].getAttribute('href')).toEqual(mr.plainDiffPath);
|
||||
|
||||
expect(el.querySelector('a[href="#modal_merge_info"]').getAttribute('disabled')).toBeNull();
|
||||
});
|
||||
|
||||
it('should not have right action links if the MR state is not open', (done) => {
|
||||
vm.mr.isOpen = false;
|
||||
Vue.nextTick(() => {
|
||||
expect(el.textContent).not.toContain('Check out branch');
|
||||
expect(el.querySelectorAll('.dropdown li a').length).toEqual(0);
|
||||
done();
|
||||
it('renders target branch', () => {
|
||||
expect(vm.$el.querySelector('.js-target-branch').textContent.trim()).toEqual('master');
|
||||
});
|
||||
});
|
||||
|
||||
it('should not render diverged commits count if the MR has no diverged commits', (done) => {
|
||||
vm.mr.divergedCommitsCount = null;
|
||||
Vue.nextTick(() => {
|
||||
expect(el.textContent).not.toContain('commits behind');
|
||||
expect(el.querySelectorAll('.diverged-commits-count').length).toEqual(0);
|
||||
done();
|
||||
describe('with an open merge request', () => {
|
||||
afterEach(() => {
|
||||
vm.$destroy();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
vm = mountComponent(Component, { mr: {
|
||||
divergedCommitsCount: 12,
|
||||
sourceBranch: 'mr-widget-refactor',
|
||||
sourceBranchLink: '<a href="/foo/bar/mr-widget-refactor">mr-widget-refactor</a>',
|
||||
sourceBranchRemoved: false,
|
||||
targetBranchPath: 'foo/bar/commits-path',
|
||||
targetBranchTreePath: 'foo/bar/tree/path',
|
||||
targetBranch: 'master',
|
||||
isOpen: true,
|
||||
emailPatchesPath: '/mr/email-patches',
|
||||
plainDiffPath: '/mr/plainDiffPath',
|
||||
} });
|
||||
});
|
||||
|
||||
it('renders checkout branch button with modal trigger', () => {
|
||||
const button = vm.$el.querySelector('.js-check-out-branch');
|
||||
|
||||
expect(button.textContent.trim()).toEqual('Check out branch');
|
||||
expect(button.getAttribute('data-target')).toEqual('#modal_merge_info');
|
||||
expect(button.getAttribute('data-toggle')).toEqual('modal');
|
||||
});
|
||||
|
||||
it('renders download dropdown with links', () => {
|
||||
expect(
|
||||
vm.$el.querySelector('.js-download-email-patches').textContent.trim(),
|
||||
).toEqual('Email patches');
|
||||
|
||||
expect(
|
||||
vm.$el.querySelector('.js-download-email-patches').getAttribute('href'),
|
||||
).toEqual('/mr/email-patches');
|
||||
|
||||
expect(
|
||||
vm.$el.querySelector('.js-download-plain-diff').textContent.trim(),
|
||||
).toEqual('Plain diff');
|
||||
|
||||
expect(
|
||||
vm.$el.querySelector('.js-download-plain-diff').getAttribute('href'),
|
||||
).toEqual('/mr/plainDiffPath');
|
||||
});
|
||||
});
|
||||
|
||||
it('should disable check out branch button if source branch has been removed', (done) => {
|
||||
vm.mr.sourceBranchRemoved = true;
|
||||
describe('with a closed merge request', () => {
|
||||
beforeEach(() => {
|
||||
vm = mountComponent(Component, { mr: {
|
||||
divergedCommitsCount: 12,
|
||||
sourceBranch: 'mr-widget-refactor',
|
||||
sourceBranchLink: '<a href="/foo/bar/mr-widget-refactor">mr-widget-refactor</a>',
|
||||
sourceBranchRemoved: false,
|
||||
targetBranchPath: 'foo/bar/commits-path',
|
||||
targetBranchTreePath: 'foo/bar/tree/path',
|
||||
targetBranch: 'master',
|
||||
isOpen: false,
|
||||
emailPatchesPath: '/mr/email-patches',
|
||||
plainDiffPath: '/mr/plainDiffPath',
|
||||
} });
|
||||
});
|
||||
|
||||
Vue.nextTick()
|
||||
.then(() => {
|
||||
expect(el.querySelector('a[href="#modal_merge_info"]').getAttribute('disabled')).toBe('disabled');
|
||||
done();
|
||||
})
|
||||
.catch(done.fail);
|
||||
it('does not render checkout branch button with modal trigger', () => {
|
||||
const button = vm.$el.querySelector('.js-check-out-branch');
|
||||
|
||||
expect(button).toEqual(null);
|
||||
});
|
||||
|
||||
it('does not render download dropdown with links', () => {
|
||||
expect(
|
||||
vm.$el.querySelector('.js-download-email-patches'),
|
||||
).toEqual(null);
|
||||
|
||||
expect(
|
||||
vm.$el.querySelector('.js-download-plain-diff'),
|
||||
).toEqual(null);
|
||||
});
|
||||
});
|
||||
|
||||
describe('without diverged commits', () => {
|
||||
beforeEach(() => {
|
||||
vm = mountComponent(Component, { mr: {
|
||||
divergedCommitsCount: 0,
|
||||
sourceBranch: 'mr-widget-refactor',
|
||||
sourceBranchLink: '<a href="/foo/bar/mr-widget-refactor">mr-widget-refactor</a>',
|
||||
sourceBranchRemoved: false,
|
||||
targetBranchPath: 'foo/bar/commits-path',
|
||||
targetBranchTreePath: 'foo/bar/tree/path',
|
||||
targetBranch: 'master',
|
||||
isOpen: true,
|
||||
emailPatchesPath: '/mr/email-patches',
|
||||
plainDiffPath: '/mr/plainDiffPath',
|
||||
} });
|
||||
});
|
||||
|
||||
it('does not render diverged commits info', () => {
|
||||
expect(vm.$el.querySelector('.diverged-commits-count')).toEqual(null);
|
||||
});
|
||||
});
|
||||
|
||||
describe('with diverged commits', () => {
|
||||
beforeEach(() => {
|
||||
vm = mountComponent(Component, { mr: {
|
||||
divergedCommitsCount: 12,
|
||||
sourceBranch: 'mr-widget-refactor',
|
||||
sourceBranchLink: '<a href="/foo/bar/mr-widget-refactor">mr-widget-refactor</a>',
|
||||
sourceBranchRemoved: false,
|
||||
targetBranchPath: 'foo/bar/commits-path',
|
||||
targetBranchTreePath: 'foo/bar/tree/path',
|
||||
targetBranch: 'master',
|
||||
isOpen: true,
|
||||
emailPatchesPath: '/mr/email-patches',
|
||||
plainDiffPath: '/mr/plainDiffPath',
|
||||
} });
|
||||
});
|
||||
|
||||
it('renders diverged commits info', () => {
|
||||
expect(vm.$el.querySelector('.diverged-commits-count').textContent.trim()).toEqual('(12 commits behind)');
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -2,9 +2,6 @@ import Vue from 'vue';
|
|||
import mergeHelpComponent from '~/vue_merge_request_widget/components/mr_widget_merge_help.vue';
|
||||
import mountComponent from '../../helpers/vue_mount_component_helper';
|
||||
|
||||
|
||||
const text = `If the ${props.missingBranch} branch exists in your local repository`;
|
||||
|
||||
describe('MRWidgetMergeHelp', () => {
|
||||
let vm;
|
||||
let Component;
|
||||
|
|
@ -17,7 +14,7 @@ describe('MRWidgetMergeHelp', () => {
|
|||
vm.$destroy();
|
||||
});
|
||||
|
||||
fdescribe('with missing branch', () => {
|
||||
describe('with missing branch', () => {
|
||||
beforeEach(() => {
|
||||
vm = mountComponent(Component, {
|
||||
missingBranch: 'this-is-not-the-branch-you-are-looking-for',
|
||||
|
|
@ -25,8 +22,16 @@ describe('MRWidgetMergeHelp', () => {
|
|||
});
|
||||
|
||||
it('renders missing branch information', () => {
|
||||
console.log('', vm.$el);
|
||||
expect(
|
||||
vm.$el.textContent.trim().replace(/[\r\n]+/g, ' ').replace(/\s\s+/g, ' '),
|
||||
).toEqual(
|
||||
'If the this-is-not-the-branch-you-are-looking-for branch exists in your local repository, you can merge this merge request manually using the command line',
|
||||
);
|
||||
});
|
||||
|
||||
it('renders element to open a modal', () => {
|
||||
expect(vm.$el.querySelector('a').getAttribute('href')).toEqual('#modal_merge_info');
|
||||
expect(vm.$el.querySelector('a').getAttribute('data-toggle')).toEqual('modal');
|
||||
});
|
||||
});
|
||||
|
||||
|
|
@ -34,5 +39,18 @@ describe('MRWidgetMergeHelp', () => {
|
|||
beforeEach(() => {
|
||||
vm = mountComponent(Component);
|
||||
});
|
||||
|
||||
it('renders information about how to merge manually', () => {
|
||||
expect(
|
||||
vm.$el.textContent.trim().replace(/[\r\n]+/g, ' ').replace(/\s\s+/g, ' '),
|
||||
).toEqual(
|
||||
'You can merge this merge request manually using the command line',
|
||||
);
|
||||
});
|
||||
|
||||
it('renders element to open a modal', () => {
|
||||
expect(vm.$el.querySelector('a').getAttribute('href')).toEqual('#modal_merge_info');
|
||||
expect(vm.$el.querySelector('a').getAttribute('data-toggle')).toEqual('modal');
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in a new issue