bc518174
 王天杨
提交两个项目文件
|
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
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
|
import { addMonths } from 'date-fns';
import { DayPickerProps } from 'DayPicker';
import { customRender } from 'test/render';
import {
getNextButton,
getPrevButton,
queryNextButton,
queryPrevButton
} from 'test/selectors';
import { user } from 'test/user';
import { freezeBeforeAll } from 'test/utils';
import { CaptionNavigation } from './CaptionNavigation';
const today = new Date(2021, 8);
freezeBeforeAll(today);
describe('when rendered', () => {
const dayPickerProps: DayPickerProps = {
captionLayout: 'buttons'
};
test('should render the next month button', () => {
customRender(<CaptionNavigation displayMonth={today} />, dayPickerProps);
expect(getNextButton()).toBeInTheDocument();
});
test('should render the previous month button', () => {
customRender(<CaptionNavigation displayMonth={today} />, dayPickerProps);
expect(getPrevButton()).toBeInTheDocument();
});
describe('when displaying the first of multiple months', () => {
const numberOfMonths = 3;
beforeEach(() => {
customRender(<CaptionNavigation displayMonth={today} />, {
...dayPickerProps,
numberOfMonths
});
});
test('should not display the next month button', () => {
expect(queryNextButton()).toBeNull();
});
test('should show the previous month button', () => {
expect(getPrevButton()).toBeInTheDocument();
});
});
describe('when displaying the last of multiple months', () => {
const numberOfMonths = 3;
beforeEach(() => {
const lastMonth = addMonths(today, numberOfMonths - 1);
customRender(<CaptionNavigation displayMonth={lastMonth} />, {
...dayPickerProps,
numberOfMonths
});
});
test('should hide the previous month button', () => {
expect(queryPrevButton()).toBeNull();
});
test('should show the next month button', () => {
expect(getNextButton()).toBeInTheDocument();
});
});
describe('when displaying a month in the middle of multiple months', () => {
const numberOfMonths = 3;
beforeEach(() => {
const lastMonth = addMonths(today, numberOfMonths - 2);
customRender(<CaptionNavigation displayMonth={lastMonth} />, {
...dayPickerProps,
numberOfMonths
});
});
test('should not render the previous month button', () => {
expect(queryPrevButton()).toBeNull();
});
test('should not render the next month button', () => {
expect(queryNextButton()).toBeNull();
});
});
describe('when clicking the previous button', () => {
describe('and a previous month is defined', () => {
const testContext = {
...dayPickerProps,
onMonthChange: jest.fn()
};
const previousMonth = addMonths(today, -1);
beforeEach(async () => {
customRender(<CaptionNavigation displayMonth={today} />, testContext);
await user.click(getPrevButton());
});
test('should call the `onMonthChange` callback', () => {
expect(testContext.onMonthChange).toHaveBeenCalledWith(previousMonth);
});
});
describe('and the previous month is not defined', () => {
const testContext = {
...dayPickerProps,
fromDate: today,
onMonthChange: jest.fn()
};
beforeEach(async () => {
customRender(<CaptionNavigation displayMonth={today} />, testContext);
await user.click(getPrevButton());
});
test('should call the `onMonthChange` callback', () => {
expect(testContext.onMonthChange).not.toHaveBeenCalled();
});
});
});
describe('when clicking the next month button', () => {
describe('and the next month is defined', () => {
const testContext = {
...dayPickerProps,
onMonthChange: jest.fn()
};
const nextMonth = addMonths(today, 1);
beforeEach(async () => {
customRender(<CaptionNavigation displayMonth={today} />, testContext);
await user.click(getNextButton());
});
test('should call the `onMonthChange` callback', () => {
expect(testContext.onMonthChange).toHaveBeenCalledWith(nextMonth);
});
});
describe('and the next month is not defined', () => {
const testContext = {
...dayPickerProps,
toDate: today,
onMonthChange: jest.fn()
};
beforeEach(async () => {
customRender(<CaptionNavigation displayMonth={today} />, testContext);
await user.click(getNextButton());
});
test('should call the `onMonthChange` callback', () => {
expect(testContext.onMonthChange).not.toHaveBeenCalled();
});
});
});
});
|
