2021-03-08 18:12:59 +05:30
|
|
|
import { GlDatepicker } from '@gitlab/ui';
|
2021-03-11 19:13:27 +05:30
|
|
|
import { shallowMount } from '@vue/test-utils';
|
2020-01-01 13:55:28 +05:30
|
|
|
import datePicker from '~/vue_shared/components/pikaday.vue';
|
2018-03-17 18:26:18 +05:30
|
|
|
|
|
|
|
describe('datePicker', () => {
|
2020-06-23 00:09:42 +05:30
|
|
|
let wrapper;
|
2021-03-08 18:12:59 +05:30
|
|
|
|
|
|
|
const buildWrapper = (propsData = {}) => {
|
2020-06-23 00:09:42 +05:30
|
|
|
wrapper = shallowMount(datePicker, {
|
2021-03-08 18:12:59 +05:30
|
|
|
propsData,
|
2018-03-17 18:26:18 +05:30
|
|
|
});
|
2021-03-08 18:12:59 +05:30
|
|
|
};
|
2018-03-17 18:26:18 +05:30
|
|
|
|
2020-06-23 00:09:42 +05:30
|
|
|
afterEach(() => {
|
|
|
|
wrapper.destroy();
|
|
|
|
wrapper = null;
|
|
|
|
});
|
2021-03-08 18:12:59 +05:30
|
|
|
it('should emit newDateSelected when GlDatePicker emits the input event', () => {
|
|
|
|
const minDate = new Date();
|
|
|
|
const maxDate = new Date();
|
|
|
|
const selectedDate = new Date();
|
|
|
|
const theDate = selectedDate.toISOString().slice(0, 10);
|
2020-06-23 00:09:42 +05:30
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
buildWrapper({ minDate, maxDate, selectedDate });
|
2018-03-17 18:26:18 +05:30
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
expect(wrapper.find(GlDatepicker).props()).toMatchObject({
|
|
|
|
minDate,
|
|
|
|
maxDate,
|
|
|
|
value: selectedDate,
|
|
|
|
});
|
|
|
|
wrapper.find(GlDatepicker).vm.$emit('input', selectedDate);
|
|
|
|
expect(wrapper.emitted('newDateSelected')[0][0]).toBe(theDate);
|
2018-03-17 18:26:18 +05:30
|
|
|
});
|
2021-03-08 18:12:59 +05:30
|
|
|
it('should emit the hidePicker event when GlDatePicker emits the close event', () => {
|
|
|
|
buildWrapper();
|
2018-03-17 18:26:18 +05:30
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
wrapper.find(GlDatepicker).vm.$emit('close');
|
2018-12-13 13:39:08 +05:30
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
expect(wrapper.emitted('hidePicker')).toHaveLength(1);
|
2018-03-17 18:26:18 +05:30
|
|
|
});
|
|
|
|
});
|