search

jonthornton / Datepair.js

A javascript plugin for intelligently selecting date and time ranges, inspired by Google Calendar.
https://www.jonthornton.com/Datepair.js
360 stars 85 forks source link

Bug with manually entering end date using keyboard #129

Open mdolnik opened 3 years ago

mdolnik commented 3 years ago

Steps to reproduce using Basic Example on https://www.jonthornton.com/Datepair.js:

  1. Pick a date or enter a date into the Start Date field (eg 4/13/2021)
  2. Manually delete the auto-filled End Date
  3. Using the keyboard, manually type in an end date (eg 4/14/2021)

As soon as you get to typing in the year (eg 4/14/2) the start date changes to the year "2" (eg 4/14/2) and when you type in the rest of the end year value (eg 4/14/2), the start date remains at year "2".

Another way to reproduce the same bug:

  1. Pick a date or enter a date into the Start Date field (eg 4/13/2021)
  2. Using the keyboard, change the end date's year to 2020 (eg select the end of the value, delete the 1 and type 0)

As soon as you delete the 1 (eg 4/13/202) the start date changes to the year "202" (eg 4/13/202) and when you type in the rest of the end year value (eg 4/13/2020), the start date remains at year "202".

Presumably this is happening as every date change event is comparing the start date to the end date and if the end date is before the start date, then the start date is set to the end date value. But since a partial year (eg "2" or "202" in the examples above) will always be less than a full year (eg 2021) then the update only occurs once.

Is there any way to only have this change occur when unfocusing? Or perhaps ignore auto-changing dates when the 2 year values do not have the same number of digits?

jonthornton commented 3 years ago

It's now fixed in https://github.com/jonthornton/Datepair.js/releases/tag/0.4.17. Thanks for the very clear bug report!

mdolnik-eelzee commented 3 years ago

Great, thanks for the quick turnaround!

One minor issue, it appears that the latest release did not update the dist/datepair.min.js file with the changes, only the version number was changed in the file's comment.

https://github.com/jonthornton/Datepair.js/commit/8ab365ca593b66062bf4b611ed74a4f50616d64f#diff-47634f723b52be0f1be868fa7e099afa67146505fc56edaf53922bf962404e0d

The non-minified version seems to fix the bug though, thanks

mdolnik-eelzee commented 3 years ago

Actually there still remains the same issue, but now with the month/day portions of the date.

Steps to reproduce using Basic Example on https://www.jonthornton.com/Datepair.js:

  1. Pick a date or enter a date into the Start Date field (eg 4/13/2021)
  2. Using the mouse and keyboard, change the end date's day to 14 (eg select the end of the value, delete the 3 and type 4)

As soon as you delete the 3 (eg 4/1/2021) the start date changes to the first of the month (eg 4/1/2021) and when you type in the rest of the end day value (eg 4/14/2020), the start date remains at "4/1/2021".

This is more evident when using the date format YYYY-MM-DD as the year would be entered first and the day last, so changing a date like 2021-04-22 to 2021-04-23 using the keyboard would make datepair.js temporarily think it was changed to 2021-04-2 (ie 2021-04-02)

The same issue occurs with changing the month (eg changing the end date from 12/25/2021 to 11/25/2021 will change the start date to 1/25/2021) so I don't think the 1000 year condition will fix the issue for months and days.

Would it be possible to detect whether the user is focused on the text element, and wait for it to un-focus before auto-filling the other date?

jonthornton commented 3 years ago

Unfortunately the date/time picker widgets place focus on the text input, and it's proving difficult to disambiguate between the different event triggers. It looks like a bigger refactor of the event handling might be needed to fix this- I'll see what I can do.