Commit 270576b8 authored by Phil Hughes's avatar Phil Hughes

Merge branch...

Merge branch '229210-replace-loadingbutton-with-gitlab-ui-s-glbutton-in-ee-app-assets-javascripts-vue_shared' into 'master'

Replace deprecated buttons with GlButton in …modal_footer.vue

Closes #229210 and #219773

See merge request gitlab-org/gitlab!41154
parents 30761ab0 2a263569
<script>
import { GlDeprecatedButton } from '@gitlab/ui';
import { GlButton } from '@gitlab/ui';
import DismissButton from 'ee/vue_shared/security_reports/components/dismiss_button.vue';
import SplitButton from 'ee/vue_shared/security_reports/components/split_button.vue';
import { s__ } from '~/locale';
import LoadingButton from '~/vue_shared/components/loading_button.vue';
export default {
name: 'ModalFooter',
components: {
DismissButton,
GlDeprecatedButton,
LoadingButton,
GlButton,
SplitButton,
},
props: {
......@@ -102,9 +100,9 @@ export default {
<template>
<div>
<gl-deprecated-button data-dismiss="modal" :disabled="disabled">
<gl-button data-dismiss="modal" :disabled="disabled">
{{ __('Cancel') }}
</gl-deprecated-button>
</gl-button>
<dismiss-button
v-if="canDismissVulnerability"
......@@ -127,15 +125,17 @@ export default {
@downloadPatch="$emit('downloadPatch')"
/>
<loading-button
<gl-button
v-else-if="actionButtons.length > 0"
:loading="actionButtons[0].isLoading"
:disabled="actionButtons[0].isLoading || disabled"
:label="actionButtons[0].name"
container-class="btn btn-success btn-inverted"
variant="success"
category="secondary"
class="js-action-button"
data-qa-selector="create_issue_button"
@click="$emit(actionButtons[0].action)"
/>
>
{{ __(actionButtons[0].name) }}
</gl-button>
</div>
</template>
---
title: Replace deprecated buttons with new GlButton component from GitLab UI
merge_request: 41154
author:
type: other
......@@ -3,7 +3,6 @@ import component from 'ee/vue_shared/security_reports/components/modal_footer.vu
import SplitButton from 'ee/vue_shared/security_reports/components/split_button.vue';
import DismissButton from 'ee/vue_shared/security_reports/components/dismiss_button.vue';
import createState from 'ee/vue_shared/security_reports/store/state';
import LoadingButton from '~/vue_shared/components/loading_button.vue';
describe('Security Reports modal footer', () => {
let wrapper;
......@@ -34,11 +33,11 @@ describe('Security Reports modal footer', () => {
it('only renders the create issue button', () => {
expect(wrapper.vm.actionButtons[0].name).toBe('Create issue');
expect(wrapper.find(LoadingButton).props('label')).toBe('Create issue');
expect(wrapper.find('.js-action-button').text()).toBe('Create issue');
});
it('emits createIssue when create issue button is clicked', () => {
wrapper.find(LoadingButton).trigger('click');
wrapper.find('.js-action-button').trigger('click');
return wrapper.vm.$nextTick().then(() => {
expect(wrapper.emitted().createNewIssue).toBeTruthy();
......@@ -57,11 +56,11 @@ describe('Security Reports modal footer', () => {
it('only renders the create merge request button', () => {
expect(wrapper.vm.actionButtons[0].name).toBe('Resolve with merge request');
expect(wrapper.find(LoadingButton).props('label')).toBe('Resolve with merge request');
expect(wrapper.find('.js-action-button').text()).toBe('Resolve with merge request');
});
it('emits createMergeRequest when create merge request button is clicked', () => {
wrapper.find(LoadingButton).trigger('click');
wrapper.find('.js-action-button').trigger('click');
return wrapper.vm.$nextTick().then(() => {
expect(wrapper.emitted().createMergeRequest).toBeTruthy();
......@@ -80,11 +79,11 @@ describe('Security Reports modal footer', () => {
it('renders the download patch button', () => {
expect(wrapper.vm.actionButtons[0].name).toBe('Download patch to resolve');
expect(wrapper.find(LoadingButton).props('label')).toBe('Download patch to resolve');
expect(wrapper.find('.js-action-button').text()).toBe('Download patch to resolve');
});
it('emits downloadPatch when download patch button is clicked', () => {
wrapper.find(LoadingButton).trigger('click');
wrapper.find('.js-action-button').trigger('click');
return wrapper.vm.$nextTick().then(() => {
expect(wrapper.emitted().downloadPatch).toBeTruthy();
......
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