1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
|
import { shallowMount } from '@vue/test-utils';
import { GlButton } from '@gitlab/ui';
import { createMockDirective, getBinding } from 'helpers/vue_mock_directive';
import LeaveButton from '~/vue_shared/components/members/action_buttons/leave_button.vue';
import LeaveModal from '~/vue_shared/components/members/modals/leave_modal.vue';
import { LEAVE_MODAL_ID } from '~/vue_shared/components/members/constants';
import { member } from '../mock_data';
describe('LeaveButton', () => {
let wrapper;
const createComponent = (propsData = {}) => {
wrapper = shallowMount(LeaveButton, {
propsData: {
member,
...propsData,
},
directives: {
GlTooltip: createMockDirective(),
GlModal: createMockDirective(),
},
});
};
const findButton = () => wrapper.find(GlButton);
beforeEach(() => {
createComponent();
});
afterEach(() => {
wrapper.destroy();
});
it('displays a tooltip', () => {
const button = findButton();
expect(getBinding(button.element, 'gl-tooltip')).not.toBeUndefined();
expect(button.attributes('title')).toBe('Leave');
});
it('sets `aria-label` attribute', () => {
expect(findButton().attributes('aria-label')).toBe('Leave');
});
it('renders leave modal', () => {
const leaveModal = wrapper.find(LeaveModal);
expect(leaveModal.exists()).toBe(true);
expect(leaveModal.props('member')).toEqual(member);
});
it('triggers leave modal', () => {
const binding = getBinding(findButton().element, 'gl-modal');
expect(binding).not.toBeUndefined();
expect(binding.value).toBe(LEAVE_MODAL_ID);
});
});
|
