Material: datepicker: filter in year mode only validates first of the month

[schliffer]

Bug, enhancement request, or proposal: Bug

CodePen and steps to reproduce the issue:

CodePen Demo which demonstrates the issue:

https://codepen.io/schliffer/pen/bJBgYP

Detailed Reproduction Steps:

1. Create a filter on the datepicker that restricts to only weekends
2. View the datepicker in year mode
3. Only months that start on a weekend are selectable

What is the expected behavior?

Any month containing a valid date will be selectable in year mode.

What is the current behavior?

Any month where the 1st of the month is valid is selectable in year mode

What is the use-case or motivation for changing an existing behavior?

To allow users to use the year mode in combination with a date filter.

Which versions of AngularJS, Material, OS, and browsers are affected?

• AngularJS: 1.6
• AngularJS Material: 1.1.18
• OS: All
• Browsers: All

Is there anything else we should know? Stack Traces, Screenshots, etc.

Fixing this issue: https://github.com/angular/material/issues/11525 seems to have caused the problem in year mode.

[jelbourn]

Related PR: https://github.com/angular/material/pull/11526

[dohomi]

I have a similar issue with md-datepicker. After version > 1.1.12 randomly dates are invalid without being able to find out whats the reason behind it. I downgraded for now back to 1.1.12 which seems like the last working version for the picker.

[Splaktar]

@dohomi dates are invalid or months/years are invalid?

[Splaktar]

OK, previously in year view, md-date-filter did not work at all (no months would be filtered/disabled).

Are you proposing that we should iterate through every date in every displayed month to determine if any date in a specific month is valid, then if any one date in a month is valid do not filter/disable that month?

Or is the proposal to add an API like md-disable-month-filtering" in order to disable md-date-filter when in year view?

[schliffer]

I'm fine with any of these 3 ideas (in order of preference):

1. Add md-enable-month-filtering to opt into the new filtering (will break fewer existing datepickers)
2. If a datepicker has month mode enabled, iterate through all dates in the month when doing filtering in the year view, otherwise datepicker is broken for this use case.
3. Reverting the change to add date filtering to the year view

[Splaktar]

None of these options seem ideal to me. However, I just thought of an alternative that may be better.

1. Add a new md-month-filter API so that developers can provide their own function (that returns a boolean and has a level of performance deemed acceptable to them) to filter months. Revert the change to md-date-filter and update the docs to make it clear that it is only for filtering of days.

Thoughts?

[schliffer]

I like that idea, preserves both use cases without breaking either.

[dohomi]

@Splaktar the datepicker inside of a form was not usable any longer. Every date picked after 15th April was all of sudden not valid (even without any validation in place). I was not using month filter, it was the default md-datepicker.

[Splaktar]

@dohomi that sounds like a different issue. Please open a new issue with a CodePen reproduction.

[Splaktar]

Apologies for the delay, but I've posted a PR for this: https://github.com/angular/material/pull/11918.