Date parsing does not conform strictly to the provided date format

[benbcai]

Expected behavior

The date value entered in the input should be parsed strictly based on the provided dateFormat. For example, the provided dateFormat is MM/dd/yyyy. When changing the date value in the input from 03/04/2019 to 03/04/20, one would expect the date picker to reject 03/04/20 as a valid date value since it does not conform to the date format. However, the date in the calendar is updated to March 4th, 2020 as it accepts 20 as a valid year even when the format has a 4-digit year.

Actual behavior

The date picker accepts date values that do not conform to the provided dateFormat. This causes the calendar to accept a date that does not follow the format and sets the unintended date.

react-datepicker uses the parse function from date-fns so the cause of the issue is actually in date-fns. See date-fns/date-fns#942. One way for react-datepicker to address this issue is to add a check to format parsedDate using the provided format and compare that with the input value.

return isValid(parsedDate) && value === format(parsedDate, dateFormat) ? parsedDate : null;

Steps to reproduce

1. Go to the first Default example here.
2. Today's date is dafaulted. (i.e. 03/04/2019)
3. Delete the last two digit in the year. That is, change from 03/04/2019 to 03/04/20.
4. Notice that the date in the calendar is updated to March 4th 2020.
5. Click outside of the input.
6. The date is updated to 03/04/2020

Example 1:

Example 2: dateFormat is yyyy/MM/dd