fix(Calendar): default-date should be today, close #6025 (#6028)

src/calendar/demo/index.vue

@@ -90,6 +90,7 @@
         :show-confirm="false"
         :min-date="tiledMinDate"
         :max-date="tiledMaxDate"
+        :default-date="tiledMinDate"
         :style="{ height: '500px' }"
       />
     </demo-block>

src/calendar/index.js

@@ -148,6 +148,7 @@ export default createComponent({
     this.init();
   },
 
+  /* istanbul ignore next */
   activated() {
     this.init();
   },
@@ -200,18 +201,26 @@ export default createComponent({
     },
 
     getInitialDate() {
-      const { type, defaultDate, minDate } = this;
+      const { type, minDate, maxDate, defaultDate } = this;
+
+      let defaultVal = new Date();
+
+      if (compareDay(defaultVal, minDate) === -1) {
+        defaultVal = minDate;
+      } else if (compareDay(defaultVal, maxDate) === 1) {
+        defaultVal = maxDate;
+      }
 
       if (type === 'range') {
         const [startDay, endDay] = defaultDate || [];
-        return [startDay || minDate, endDay || getNextDay(minDate)];
+        return [startDay || defaultVal, endDay || getNextDay(defaultVal)];
       }
 
       if (type === 'multiple') {
-        return defaultDate || [minDate];
+        return defaultDate || [defaultVal];
       }
 
-      return defaultDate || minDate;
+      return defaultDate || defaultVal;
     },
 
     // calculate the position of the elements

src/calendar/test/index.spec.js

@@ -59,6 +59,7 @@ test('select event when type is multiple', async () => {
       minDate,
       maxDate,
       poppable: false,
+      defaultDate: [minDate],
     },
   });
 
@@ -181,6 +182,7 @@ test('reset method', async () => {
       maxDate,
       type: 'range',
       poppable: false,
+      defaultDate: [minDate, getNextDay(minDate)],
     },
   });
 
@@ -227,6 +229,7 @@ test('row-height prop', async () => {
       maxDate,
       poppable: false,
       rowHeight: 50,
+      defaultDate: minDate,
     },
   });
 
@@ -241,6 +244,7 @@ test('formatter prop', async () => {
       minDate,
       maxDate,
       poppable: false,
+      defaultDate: minDate,
       formatter(day) {
         const date = day.date.getDate();
 
@@ -275,6 +279,7 @@ test('title & footer slot', async () => {
       minDate,
       maxDate,
       poppable: false,
+      defaultDate: minDate,
     },
     scopedSlots: {
       title: () => 'Custom Title',
@@ -293,6 +298,7 @@ test('should reset when type changed', async () => {
       minDate,
       maxDate,
       poppable: false,
+      defaultDate: minDate,
     },
   });
 
@@ -301,7 +307,10 @@ test('should reset when type changed', async () => {
   wrapper.find('.van-calendar__confirm').trigger('click');
   expect(formatDate(wrapper.emitted('confirm')[0][0])).toEqual('2010/1/10');
 
-  wrapper.setProps({ type: 'range' });
+  wrapper.setProps({
+    type: 'range',
+    defaultDate: [minDate, getNextDay(minDate)],
+  });
   wrapper.find('.van-calendar__confirm').trigger('click');
   expect(formatRange(wrapper.emitted('confirm')[1][0])).toEqual(
     '2010/1/10-2010/1/11'
@@ -358,6 +367,7 @@ test('popup wrapper', async () => {
     propsData: {
       minDate,
       maxDate,
+      defaultDate: minDate,
     },
     listeners: {
       input(value) {
@@ -400,6 +410,7 @@ test('color prop when type is single', async () => {
       maxDate,
       color: 'blue',
       poppable: false,
+      defaultDate: minDate,
     },
   });
 

src/calendar/test/prop.spec.js

@@ -1,6 +1,6 @@
 import Calendar from '..';
 import { mount, later } from '../../../test';
-import { minDate, maxDate, formatRange } from './utils';
+import { minDate, maxDate, formatRange, formatDate } from './utils';
 
 test('max-range prop when showConfirm is false', async () => {
   const wrapper = mount(Calendar, {
@@ -120,3 +120,29 @@ test('allow-same-day prop', async () => {
   days.at(9).trigger('click');
   expect(select).toHaveBeenLastCalledWith([minDate, minDate]);
 });
+
+test('min-date after current time', () => {
+  const wrapper = mount(Calendar, {
+    propsData: {
+      poppable: false,
+      minDate: new Date(2200, 0, 1),
+      maxDate: new Date(2200, 0, 2),
+    },
+  });
+
+  wrapper.find('.van-calendar__confirm').trigger('click');
+  expect(formatDate(wrapper.emitted('confirm')[0][0])).toEqual('2200/1/1');
+});
+
+test('min-date before current time', () => {
+  const wrapper = mount(Calendar, {
+    propsData: {
+      poppable: false,
+      minDate: new Date(1800, 0, 1),
+      maxDate: new Date(1800, 0, 2),
+    },
+  });
+
+  wrapper.find('.van-calendar__confirm').trigger('click');
+  expect(formatDate(wrapper.emitted('confirm')[0][0])).toEqual('1800/1/2');
+});