Skip to content
This repository was archived by the owner on Apr 17, 2022. It is now read-only.

Commit 7d0d384

Browse files
JasenkooJasenkoo
committed
chore: Test code organization
- Add test case for multiDates
1 parent f5d5969 commit 7d0d384

File tree

1 file changed

+47
-76
lines changed

1 file changed

+47
-76
lines changed

‎tests/unit/logic.spec.ts‎

Lines changed: 47 additions & 76 deletions
Original file line numberDiff line numberDiff line change
@@ -16,18 +16,22 @@ const format = (date: Date): string => {
1616
return `Selected year is ${date.getFullYear()}`;
1717
};
1818

19-
describe('Logic connection', () => {
20-
it('Should properly define initial values', async () => {
21-
const date = new Date();
22-
const dp = mount(Datepicker, { props: { modelValue: date } });
19+
const mountDatepicker = async (props: any = {}): Promise<{ dp: VueWrapper<any>; menu: VueWrapper<any> }> => {
20+
const dp = mount(Datepicker, { props });
2321

24-
dp.vm.openMenu();
22+
dp.vm.openMenu();
2523

26-
await dp.vm.$nextTick();
24+
await dp.vm.$nextTick();
25+
26+
const menu = dp.findComponent(DatepickerMenu);
2727

28-
const menu: VueWrapper<any> = dp.findComponent(DatepickerMenu);
28+
return { dp, menu };
29+
};
2930

30-
await menu.vm.$nextTick();
31+
describe('Logic connection', () => {
32+
it('Should properly define initial values', async () => {
33+
const date = new Date();
34+
const { menu } = await mountDatepicker({ modelValue: date });
3135

3236
expect(menu.vm.month(0)).toEqual(date.getMonth());
3337
expect(menu.vm.year(0)).toEqual(date.getFullYear());
@@ -38,13 +42,7 @@ describe('Logic connection', () => {
3842
it('Should properly map initial values for range picker', async () => {
3943
const start = new Date();
4044
const end = addDays(start, 7);
41-
const dp = mount(Datepicker, { props: { modelValue: [start, end], range: true } });
42-
43-
dp.vm.openMenu();
44-
45-
await dp.vm.$nextTick();
46-
47-
const menu: VueWrapper<any> = dp.findComponent(DatepickerMenu);
45+
const { menu } = await mountDatepicker({ modelValue: [start, end], range: true });
4846

4947
expect(menu.vm.hours).toHaveLength(2);
5048
expect(menu.vm.minutes).toHaveLength(2);
@@ -53,13 +51,7 @@ describe('Logic connection', () => {
5351

5452
it('Should select date', async () => {
5553
const tomorrow = setSeconds(addDays(new Date(), 1), 0);
56-
const dp = mount(Datepicker, { props: { modelValue: null } });
57-
58-
dp.vm.openMenu();
59-
60-
await dp.vm.$nextTick();
61-
62-
const menu = dp.findComponent(DatepickerMenu);
54+
const { dp, menu } = await mountDatepicker({ modelValue: null });
6355

6456
const calendar = menu.findComponent(Calendar);
6557

@@ -72,13 +64,8 @@ describe('Logic connection', () => {
7264
it('Should select range', async () => {
7365
const start = setSeconds(addDays(new Date(), 1), 0);
7466
const end = setSeconds(addDays(start, 7), 0);
75-
const dp = mount(Datepicker, { props: { modelValue: null, range: true } });
76-
77-
dp.vm.openMenu();
67+
const { menu } = await mountDatepicker({ modelValue: null, range: true });
7868

79-
await dp.vm.$nextTick();
80-
81-
const menu: VueWrapper<any> = dp.findComponent(DatepickerMenu);
8269
const calendar = menu.findComponent(Calendar);
8370
calendar.vm.$emit('selectDate', { value: start, current: true });
8471
await calendar.vm.$nextTick();
@@ -96,13 +83,8 @@ describe('Logic connection', () => {
9683
it('Should select auto range', async () => {
9784
const start = setSeconds(new Date(), 0);
9885
const end = setSeconds(addDays(start, 7), 0);
99-
const dp = mount(Datepicker, { props: { modelValue: null, range: true, autoRange: 7 } });
100-
101-
dp.vm.openMenu();
86+
const { menu } = await mountDatepicker({ modelValue: null, range: true, autoRange: 7 });
10287

103-
await dp.vm.$nextTick();
104-
105-
const menu: VueWrapper<any> = dp.findComponent(DatepickerMenu);
10688
const calendar = menu.findComponent(Calendar);
10789

10890
calendar.vm.$emit('selectDate', { value: start, current: true });
@@ -116,13 +98,8 @@ describe('Logic connection', () => {
11698
it('Should update time', async () => {
11799
const val = 15;
118100
const date = new Date();
119-
const dp = mount(Datepicker, { props: { modelValue: date } });
120-
121-
dp.vm.openMenu();
101+
const { menu } = await mountDatepicker({ modelValue: date });
122102

123-
await dp.vm.$nextTick();
124-
125-
const menu: VueWrapper<any> = dp.findComponent(DatepickerMenu);
126103
const timePicker = menu.findComponent(TimePicker);
127104
timePicker.vm.$emit('update:hours', val);
128105
await timePicker.vm.$nextTick();
@@ -137,13 +114,8 @@ describe('Logic connection', () => {
137114
const val = 15;
138115
const start = new Date();
139116
const end = addDays(new Date(), 7);
140-
const dp = mount(Datepicker, { props: { modelValue: [start, end], range: true } });
141-
142-
dp.vm.openMenu();
117+
const { menu } = await mountDatepicker({ modelValue: [start, end], range: true });
143118

144-
await dp.vm.$nextTick();
145-
146-
const menu: VueWrapper<any> = dp.findComponent(DatepickerMenu);
147119
const timePicker = menu.findComponent(TimePicker);
148120
timePicker.vm.$emit('update:hours', [start.getHours(), val]);
149121
await timePicker.vm.$nextTick();
@@ -156,13 +128,8 @@ describe('Logic connection', () => {
156128

157129
it('Should set month', async () => {
158130
const month = 0;
159-
const dp = mount(Datepicker, { props: { modelValue: null, range: true } });
160-
161-
dp.vm.openMenu();
131+
const { menu } = await mountDatepicker({ modelValue: null, range: true });
162132

163-
await dp.vm.$nextTick();
164-
165-
const menu: VueWrapper<any> = dp.findComponent(DatepickerMenu);
166133
const monthYearInput = menu.findComponent(MonthYearInput);
167134
monthYearInput.vm.$emit('update:month', month);
168135

@@ -171,13 +138,8 @@ describe('Logic connection', () => {
171138

172139
it('Should set year', async () => {
173140
const year = 2022;
174-
const dp = mount(Datepicker, { props: { modelValue: null, range: true } });
175-
176-
dp.vm.openMenu();
141+
const { menu } = await mountDatepicker({ modelValue: null, range: true });
177142

178-
await dp.vm.$nextTick();
179-
180-
const menu: VueWrapper<any> = dp.findComponent(DatepickerMenu);
181143
const monthYearInput = menu.findComponent(MonthYearInput);
182144
monthYearInput.vm.$emit('update:year', year);
183145

@@ -187,13 +149,8 @@ describe('Logic connection', () => {
187149
it('Should format with custom function', async () => {
188150
const selected = new Date();
189151

190-
const dp = mount(Datepicker, { props: { modelValue: null, format } });
191-
192-
dp.vm.openMenu();
152+
const { dp, menu } = await mountDatepicker({ modelValue: null, format });
193153

194-
await dp.vm.$nextTick();
195-
196-
const menu: VueWrapper<any> = dp.findComponent(DatepickerMenu);
197154
const calendar = menu.findComponent(Calendar);
198155
calendar.vm.$emit('selectDate', { value: selected, current: true });
199156
await calendar.vm.$nextTick();
@@ -206,13 +163,8 @@ describe('Logic connection', () => {
206163
it('Should display preview format from function', async () => {
207164
const selected = new Date();
208165

209-
const dp = mount(Datepicker, { props: { modelValue: null, previewFormat: format } });
210-
211-
dp.vm.openMenu();
166+
const { menu } = await mountDatepicker({ modelValue: null, previewFormat: format });
212167

213-
await dp.vm.$nextTick();
214-
215-
const menu: VueWrapper<any> = dp.findComponent(DatepickerMenu);
216168
const calendar = menu.findComponent(Calendar);
217169
calendar.vm.$emit('selectDate', { value: selected, current: true });
218170
await calendar.vm.$nextTick();
@@ -225,13 +177,13 @@ describe('Logic connection', () => {
225177
const selected = new Date(0);
226178
// The day of the week (E) is locale-sensitive in Japanese.
227179
// Since epoch time zero (1970/1/1) was a Thursday, the 'Thu' must be localized to '木'.
228-
const dp = mount(Datepicker, { props: { modelValue: null, format: 'E', locale: 'ja-JP', formatLocale: ja } });
229-
230-
dp.vm.openMenu();
180+
const { dp, menu } = await mountDatepicker({
181+
modelValue: null,
182+
format: 'E',
183+
locale: 'ja-JP',
184+
formatLocale: ja,
185+
});
231186

232-
await dp.vm.$nextTick();
233-
234-
const menu: VueWrapper<any> = dp.findComponent(DatepickerMenu);
235187
const calendar = menu.findComponent(Calendar);
236188
calendar.vm.$emit('selectDate', { value: selected, current: true });
237189
await calendar.vm.$nextTick();
@@ -240,4 +192,23 @@ describe('Logic connection', () => {
240192

241193
expect(dp.vm.inputValue).toEqual('木');
242194
});
195+
196+
it('Should select multiple dates', async () => {
197+
const dates = [new Date(), addDays(new Date(), 1), addDays(new Date(), 2), addDays(new Date(), 3)];
198+
const { dp, menu } = await mountDatepicker({ modeValue: null, multiDates: true });
199+
200+
const calendar = menu.findComponent(Calendar);
201+
for (const date of dates) {
202+
calendar.vm.$emit('selectDate', { value: setSeconds(date, 0), current: true });
203+
await calendar.vm.$nextTick();
204+
}
205+
expect(dp.vm.internalModelValue).toHaveLength(4);
206+
expect(dp.vm.internalModelValue[0]).toEqual(setSeconds(dates[0], 0));
207+
208+
for (const date of dates) {
209+
calendar.vm.$emit('selectDate', { value: setSeconds(date, 0), current: true });
210+
await calendar.vm.$nextTick();
211+
}
212+
expect(dp.vm.internalModelValue).toBeNull();
213+
});
243214
});

0 commit comments

Comments
 (0)