Commit 2978c49f authored by David O'Regan's avatar David O'Regan

Merge branch '229677-mr-widget-conflicts-warning' into 'master'

Replace how to merge HAML

See merge request gitlab-org/gitlab!48766
parents cc8e7c13 5c5c2d9a
......@@ -214,7 +214,6 @@ linters:
- 'app/views/projects/mattermosts/_team_selection.html.haml'
- 'app/views/projects/mattermosts/new.html.haml'
- 'app/views/projects/merge_requests/_commits.html.haml'
- 'app/views/projects/merge_requests/_how_to_merge.html.haml'
- 'app/views/projects/merge_requests/_mr_title.html.haml'
- 'app/views/projects/merge_requests/conflicts/_commit_stats.html.haml'
- 'app/views/projects/merge_requests/conflicts/_file_actions.html.haml'
......
<script>
import { GlButton, GlAlert } from '@gitlab/ui';
import { GlButton, GlAlert, GlModalDirective } from '@gitlab/ui';
import { CENTERED_LIMITED_CONTAINER_CLASSES } from '../constants';
export default {
......@@ -7,6 +7,9 @@ export default {
GlAlert,
GlButton,
},
directives: {
GlModalDirective,
},
props: {
limited: {
type: Boolean,
......@@ -60,9 +63,8 @@ export default {
</gl-button>
<gl-button
v-if="mergeable"
v-gl-modal-directive="'modal-merge-info'"
class="gl-alert-action"
data-toggle="modal"
data-target="#modal_merge_info"
>
{{ __('Merge locally') }}
</gl-button>
......
import $ from 'jquery';
export default () => {
const modal = $('#modal_merge_info');
if (modal) {
modal.modal({
modal: true,
show: false,
});
$('.how_to_merge_link').on('click', modal.show);
$('.modal-header .close').on('click', modal.hide);
}
};
......@@ -2,7 +2,6 @@ import ZenMode from '~/zen_mode';
import initIssuableSidebar from '~/init_issuable_sidebar';
import ShortcutsIssuable from '~/behaviors/shortcuts/shortcuts_issuable';
import { handleLocationHash } from '~/lib/utils/common_utils';
import howToMerge from '~/how_to_merge';
import initPipelines from '~/commit/pipelines/pipelines_bundle';
import initSourcegraph from '~/sourcegraph';
import loadAwardsHandler from '~/awards_handler';
......@@ -15,7 +14,6 @@ export default function() {
initPipelines();
new ShortcutsIssuable(true); // eslint-disable-line no-new
handleLocationHash();
howToMerge();
initSourcegraph();
loadAwardsHandler();
initInviteMemberModal();
......
<script>
import { GlButton, GlModalDirective } from '@gitlab/ui';
import { sprintf, s__ } from '~/locale';
export default {
name: 'MRWidgetMergeHelp',
components: {
GlButton,
},
directives: {
GlModalDirective,
},
props: {
missingBranch: {
type: String,
......@@ -31,13 +38,12 @@ export default {
{{ s__('mrWidget|You can merge this merge request manually using the') }}
</template>
<button
type="button"
class="btn-link btn-blank js-open-modal-help"
data-toggle="modal"
data-target="#modal_merge_info"
<gl-button
v-gl-modal-directive="'modal-merge-info'"
variant="link"
class="gl-mt-n2 js-open-modal-help"
>
{{ s__('mrWidget|command line') }}
</button>
</gl-button>
</section>
</template>
......@@ -507,19 +507,6 @@ $mr-widget-min-height: 69px;
display: none;
}
#modal_merge_info .modal-dialog {
.dark {
margin-right: 40px;
}
.btn-clipboard {
margin-right: 20px;
margin-top: 5px;
position: absolute;
right: 0;
}
}
.mr-links {
padding-left: $gl-padding-8 + $status-icon-size + $gl-btn-padding;
......
#modal_merge_info.modal{ tabindex: '-1' }
.modal-dialog.modal-lg
.modal-content
.modal-header
%h3.modal-title Check out, review, and merge locally
%button.close{ type: "button", "data-dismiss": "modal", "aria-label" => _('Close') }
%span{ "aria-hidden": true } &times;
.modal-body
%p
%strong Step 1.
Fetch and check out the branch for this merge request
= clipboard_button(target: "pre#merge-info-1", title: _("Copy commands"))
%pre.dark#merge-info-1
- if @merge_request.for_fork?
-# All repo/branch refs have been quoted to allow support for special characters (such as #my-branch)
:preserve
git fetch "#{h default_url_to_repo(@merge_request.source_project)}" "#{h @merge_request.source_branch}"
git checkout -b "#{h @merge_request.source_project_path}-#{h @merge_request.source_branch}" FETCH_HEAD
- else
:preserve
git fetch origin
git checkout -b "#{h @merge_request.source_branch}" "origin/#{h @merge_request.source_branch}"
%p
%strong Step 2.
Review the changes locally
%p
%strong Step 3.
Merge the branch and fix any conflicts that come up
= clipboard_button(target: "pre#merge-info-3", title: _("Copy commands"))
%pre.dark#merge-info-3
- if @merge_request.for_fork?
:preserve
git fetch origin
git checkout "#{h @merge_request.target_branch}"
git merge --no-ff "#{h @merge_request.source_project_path}-#{h @merge_request.source_branch}"
- else
:preserve
git fetch origin
git checkout "#{h @merge_request.target_branch}"
git merge --no-ff "#{h @merge_request.source_branch}"
%p
%strong Step 4.
Push the result of the merge to GitLab
= clipboard_button(target: "pre#merge-info-4", title: _("Copy commands"))
%pre.dark#merge-info-4
:preserve
git push origin "#{h @merge_request.target_branch}"
- unless @merge_request.can_be_merged_by?(current_user)
%p
Note that pushing to GitLab requires write access to this repository.
%p
%strong Tip:
= succeed '.' do
You can also checkout merge requests locally by
= link_to 'following these guidelines', help_page_path('user/project/merge_requests/reviewing_and_managing_merge_requests.md', anchor: "checkout-merge-requests-locally-through-the-head-ref"), target: '_blank', rel: 'noopener noreferrer'
......@@ -16,9 +16,6 @@
.merge-request{ data: { mr_action: mr_action, url: merge_request_path(@merge_request, format: :json), project_path: project_path(@merge_request.project), lock_version: @merge_request.lock_version } }
= render "projects/merge_requests/mr_title"
- if @merge_request.source_branch_exists?
= render "projects/merge_requests/how_to_merge"
.merge-request-details.issuable-details{ data: { id: @merge_request.project.id } }
= render "projects/merge_requests/mr_box"
.merge-request-tabs-holder{ class: ("js-tabs-affix" unless ENV['RAILS_ENV'] == 'test') }
......
---
title: Replace how to merge HAML with Vue component
merge_request: 48766
author:
type: changed
import Vue from 'vue';
import mountComponent from 'helpers/vue_mount_component_helper';
import mergeHelpComponent from '~/vue_merge_request_widget/components/mr_widget_merge_help.vue';
import { shallowMount } from '@vue/test-utils';
import MergeHelpComponent from '~/vue_merge_request_widget/components/mr_widget_merge_help.vue';
describe('MRWidgetMergeHelp', () => {
let vm;
let Component;
let wrapper;
beforeEach(() => {
Component = Vue.extend(mergeHelpComponent);
const createComponent = ({ props = {} } = {}) => {
wrapper = shallowMount(MergeHelpComponent, {
propsData: {
missingBranch: 'this-is-not-the-branch-you-are-looking-for',
...props,
},
});
};
afterEach(() => {
vm.$destroy();
wrapper.destroy();
wrapper = null;
});
describe('with missing branch', () => {
beforeEach(() => {
vm = mountComponent(Component, {
missingBranch: 'this-is-not-the-branch-you-are-looking-for',
});
createComponent();
});
it('renders missing branch information', () => {
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 button to open help modal', () => {
expect(vm.$el.querySelector('.js-open-modal-help').getAttribute('data-target')).toEqual(
'#modal_merge_info',
);
expect(vm.$el.querySelector('.js-open-modal-help').getAttribute('data-toggle')).toEqual(
'modal',
expect(wrapper.find('.mr-widget-help').text()).toContain(
'If the this-is-not-the-branch-you-are-looking-for branch exists in your local repository',
);
});
});
describe('without missing branch', () => {
beforeEach(() => {
vm = mountComponent(Component);
createComponent({
props: { missingBranch: '' },
});
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('.js-open-modal-help').getAttribute('data-target')).toEqual(
'#modal_merge_info',
);
expect(vm.$el.querySelector('.js-open-modal-help').getAttribute('data-toggle')).toEqual(
'modal',
it('renders information about how to merge manually', () => {
expect(wrapper.find('.mr-widget-help').text()).toContain(
'You can merge this merge request manually',
);
});
});
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment