Feature Sweep: Date Range Picker Component

[LevinMedia]

The feature sweep task involves revisiting a developed feature, and analyzing the components and functionality to ensure they match up with the original designed experience. Ideally you should perform a Feature Sweep using a device and/or browser that you typically do not work with. Try Browser Stack, or an emulator, try to feel experience through a different lens.

Prior to opening up additional issues, lets use this issue to discuss and log findings of your sweep - please share your browser/device config with your findings too.

[LevinMedia]

Bug

1. To reproduce, navigate to a report from anywhere else in WP-admin
2. Select the date range picker, the select the custom tab
3. using the manual inputs, select the first input and type 01/01/2016 or something else in the distant past that isnt visible on the current calendar) When you've entered the date TAB to the next field. (end date)
4. Note the focus is applied to the end date.
5. using the calendar, select todays date.
6. note the date selected in the calendar gets placed in the "start date" rather than the "end date" and the focus disappears.

---

Enhancement

Manually entering dates using the custom date range picker is a bit tedious. Ideally I'd like the experience to rely on a number input type, and feature something along the lines of the credit card entry fields that automatically advance through the sequence of numbers as you type.

When you focus into the field and begin to type, the input values replace the preview text one value at a time , and automatically skip past the dividers so that the user isn't required to type them manually.

it would look something like this as it's being entered:

mm / dd / yyyy
0m / dd / yyyy
01 / dd / yyyy
01 / 0d / yyyy
01 / 01 / yyyy
01 / 01 / 2yyy
01 / 01 / 20yy
01 / 01 / 201y
01 / 01 / 2018

The date should also only be validated once the focus leaves the input.

---

Bug

Unable to select today's date in the custom date range picker. For example: today is December 15th

[psealock]

Hey great stuff here @LevinMedia ! Its nice to get the final kinks out of this one.

Unable to select today's date in the custom date range picker. For example: today is December 15th

I noticed this as well and folded that fix into #1069

[timmyc]

Since the one issue here has been fixed, i'm closing this out.