fix(datepicker): fix wrong datepicker-input value for non MM/DD/YYYY locales

[g1shin]

After internationalization, the value is either null or wrong. For example, 06.09.2017 which is supposed to be September 6th, 2017 in European languages would be parsed as June 9th, 2017. The setter of value calls _getValidDateOrNull() to get the valid date from the given Date object, so just returning the value saved from the setter in getter would return the correct datepicker input value.

[kara]

Remove console log ?

[jelbourn]

Add a unit test for this fix?

[mmalerba]

Yes, if we're going to make this change we need to have tests that ensure the cached value returned by the getter never gets out of sync with the value of the element. We would need to test that value is correct after:

• update due to [value] binding
• update due to ngModel change
• update due to formControl change
• update due to valid user input
• update due to invalid user input
• possibly update due to document.query('input').value =? (this change will probably break this case, but maybe that ok because people shouldn't be doing that)

Also note that this will not fix the problem of the datepicker not working in non MM/DD/YYYY locales, it will still break as soon as the user inputs something because it has to go through DateAdapter.parse. The real fix for this is to integrate the new Angular i18n API that will be part of Angular 5.0 or have people use a different adapter in the mean time such as the MomentDateAdapter that I'm currently working on. However if this change doesn't break any of the cases I listed, I would be ok with merging it as it would save us some parsing work every time the value is read.

[g1shin]

I modified _onInput method so that input event does not result in null value for MdDatepickerInput. I also added a unit test for the internationalization fix. All the other instances that @mmalerba mentioned that need to be checked already seem to have tests for them, and they are all passing; so I think the value is correct now.

The only thing that still can't be fixed in this change is when the user types in the date in DD/MM/YYYY locales because _onInput simply parses in the input string. But with DateAdapter.parse, I don't think there is a way to address this particular case right now.

[mmalerba]

Why not just go through the setter? A lot of this logic looks the same. I think you could change this method to:

let date = this._dateAdapter.parse(value, this._dateFormats.parse.dateInput);
this.value = date;
this._cvaOnChange(this.date);
this.dateInput.emit(new MdDatepickerInputEvent(this, this._elementRef.nativeElement));

[g1shin]

@mmalerba this.value = date can't be used in _onInput() because the setter of value formats the date and sets it as the property on the native element so simply typing in 1 on immediately trigger update and set the value to 1.1.2001.

this._renderer.setProperty(this._elementRef.nativeElement, 'value', value ? this._dateAdapter.format(value, this._dateFormats.display.dateInput) : '');

We would only want the DateAdapter.format update when the date is chosen by clicking on a date in datepicker.

[mmalerba]

Oh I see right, that makes sense

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}