Migrate to GlButton in approvals footer

parent 776d0068
<script> <script>
import { GlButton, GlDeprecatedButton } from '@gitlab/ui'; import { GlButton } from '@gitlab/ui';
import { __ } from '~/locale'; import { __ } from '~/locale';
import UserAvatarList from '~/vue_shared/components/user_avatar/user_avatar_list.vue'; import UserAvatarList from '~/vue_shared/components/user_avatar/user_avatar_list.vue';
import ApprovalsList from './approvals_list.vue'; import ApprovalsList from './approvals_list.vue';
...@@ -7,7 +7,6 @@ import ApprovalsList from './approvals_list.vue'; ...@@ -7,7 +7,6 @@ import ApprovalsList from './approvals_list.vue';
export default { export default {
components: { components: {
GlButton, GlButton,
GlDeprecatedButton,
UserAvatarList, UserAvatarList,
ApprovalsList, ApprovalsList,
}, },
...@@ -81,14 +80,14 @@ export default { ...@@ -81,14 +80,14 @@ export default {
/> />
<template v-if="isCollapsed"> <template v-if="isCollapsed">
<user-avatar-list :items="suggestedApproversTrimmed" :breakpoint="0" empty-text="" /> <user-avatar-list :items="suggestedApproversTrimmed" :breakpoint="0" empty-text="" />
<gl-deprecated-button variant="link" @click="toggle">{{ <gl-button data-testid="approvers-expand-button" variant="link" @click="toggle">{{
__('View eligible approvers') __('View eligible approvers')
}}</gl-deprecated-button> }}</gl-button>
</template> </template>
<template v-else> <template v-else>
<gl-deprecated-button variant="link" @click="toggle">{{ <gl-button data-testid="approvers-collapse-button" variant="link" @click="toggle">{{
__('Collapse') __('Collapse')
}}</gl-deprecated-button> }}</gl-button>
</template> </template>
</div> </div>
<div v-if="!isCollapsed && approvalRules.length" class="border-top"> <div v-if="!isCollapsed && approvalRules.length" class="border-top">
......
import { GlDeprecatedButton, GlButton, GlLoadingIcon, GlIcon } from '@gitlab/ui'; import { GlButton, GlLoadingIcon, GlIcon } from '@gitlab/ui';
import { mount } from '@vue/test-utils'; import { mount } from '@vue/test-utils';
import ApprovalsFooter from 'ee/vue_merge_request_widget/components/approvals/approvals_footer.vue'; import ApprovalsFooter from 'ee/vue_merge_request_widget/components/approvals/approvals_footer.vue';
import ApprovalsList from 'ee/vue_merge_request_widget/components/approvals/approvals_list.vue'; import ApprovalsList from 'ee/vue_merge_request_widget/components/approvals/approvals_list.vue';
...@@ -28,8 +28,8 @@ describe('EE MRWidget approvals footer', () => { ...@@ -28,8 +28,8 @@ describe('EE MRWidget approvals footer', () => {
const findToggle = () => wrapper.find(GlButton); const findToggle = () => wrapper.find(GlButton);
const findToggleIcon = () => findToggle().find(GlIcon); const findToggleIcon = () => findToggle().find(GlIcon);
const findToggleLoadingIcon = () => findToggle().find(GlLoadingIcon); const findToggleLoadingIcon = () => findToggle().find(GlLoadingIcon);
const findExpandButton = () => wrapper.find(GlDeprecatedButton); const findExpandButton = () => wrapper.find('[data-testid="approvers-expand-button"]');
const findCollapseButton = () => wrapper.find(GlDeprecatedButton); const findCollapseButton = () => wrapper.find('[data-testid="approvers-collapse-button"]');
const findList = () => wrapper.find(ApprovalsList); const findList = () => wrapper.find(ApprovalsList);
const findAvatars = () => wrapper.find(UserAvatarList); const findAvatars = () => wrapper.find(UserAvatarList);
......
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