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
60
61
62
63
64
65
|
import { mount } from '@vue/test-utils';
import EmailParticipantsWarning from '~/notes/components/email_participants_warning.vue';
describe('Email Participants Warning Component', () => {
let wrapper;
const findMoreButton = () => wrapper.find('button');
const createWrapper = (emails) => {
wrapper = mount(EmailParticipantsWarning, {
propsData: { emails },
});
};
describe('with 3 or less emails', () => {
beforeEach(() => {
createWrapper(['a@gitlab.com', 'b@gitlab.com', 'c@gitlab.com']);
});
it('more button does not exist', () => {
expect(findMoreButton().exists()).toBe(false);
});
it('all emails are displayed', () => {
expect(wrapper.text()).toBe(
'a@gitlab.com, b@gitlab.com, and c@gitlab.com will be notified of your comment.',
);
});
});
describe('with more than 3 emails', () => {
beforeEach(() => {
createWrapper(['a@gitlab.com', 'b@gitlab.com', 'c@gitlab.com', 'd@gitlab.com']);
});
it('only displays first 3 emails', () => {
expect(wrapper.text()).toContain('a@gitlab.com, b@gitlab.com, c@gitlab.com');
expect(wrapper.text()).not.toContain('d@gitlab.com');
});
it('more button does exist', () => {
expect(findMoreButton().exists()).toBe(true);
});
it('more button displays the correct wordage', () => {
expect(findMoreButton().text()).toBe('and 1 more');
});
describe('when more button clicked', () => {
beforeEach(() => {
findMoreButton().trigger('click');
});
it('more button no longer exists', () => {
expect(findMoreButton().exists()).toBe(false);
});
it('all emails are displayed', () => {
expect(wrapper.text()).toBe(
'a@gitlab.com, b@gitlab.com, c@gitlab.com, and d@gitlab.com will be notified of your comment.',
);
});
});
});
});
|
