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
|
import { GlIcon, GlTooltip } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { mockMilestone } from 'jest/boards/mock_data';
import IssueMilestone from '~/issuable/components/issue_milestone.vue';
describe('IssueMilestone component', () => {
let wrapper;
const findTooltip = () => wrapper.findComponent(GlTooltip);
const createComponent = (milestone = mockMilestone) =>
shallowMount(IssueMilestone, { propsData: { milestone } });
beforeEach(() => {
wrapper = createComponent();
});
it('renders milestone icon', () => {
expect(wrapper.findComponent(GlIcon).props('name')).toBe('clock');
});
it('renders milestone title', () => {
expect(wrapper.find('.milestone-title').text()).toBe(mockMilestone.title);
});
describe('tooltip', () => {
it('renders `Milestone`', () => {
expect(findTooltip().text()).toContain('Milestone');
});
it('renders milestone title', () => {
expect(findTooltip().text()).toContain(mockMilestone.title);
});
describe('humanized dates', () => {
it('renders `Expired` when there is a due date in the past', () => {
wrapper = createComponent({ ...mockMilestone, due_date: '2019-12-31', start_date: '' });
expect(findTooltip().text()).toContain('Expired 6 months ago(December 31, 2019)');
});
it('renders `remaining` when there is a due date in the future', () => {
wrapper = createComponent({ ...mockMilestone, due_date: '2020-12-31', start_date: '' });
expect(findTooltip().text()).toContain('5 months remaining(December 31, 2020)');
});
it('renders `Started` when there is a start date in the past', () => {
wrapper = createComponent({ ...mockMilestone, due_date: '', start_date: '2019-12-31' });
expect(findTooltip().text()).toContain('Started 6 months ago(December 31, 2019)');
});
it('renders `Starts` when there is a start date in the future', () => {
wrapper = createComponent({ ...mockMilestone, due_date: '', start_date: '2020-12-31' });
expect(findTooltip().text()).toContain('Starts in 5 months(December 31, 2020)');
});
});
});
});
|