Maximum call stack exceeded trying to set date in paper-date-picker

Question

With https://github.com/bendavis78/paper-date-picker (based on moment.js) I am trying to set the date (optionally) offset months in the future.

The element:

<paper-date-picker date="{{date}}"></paper-date-picker>

The following property works:

properties: {
    date: {
        type: Date
    }
}

But this floods the console with "Uncaught RangeError: Maximum call stack size exceeded." from polymer:1258 & polymer-mini:964

properties: {
    date: {
        type: Date,
        value: function() {
          var myDate = new Date();
          var offset = this.attributes.offset ? parseInt(this.attributes.offset.value) : 0;
            myDate.setMonth(myDate.getMonth() + offset);
            return myDate;
        }
    }
}

It doesn't seem to matter what the date transform is, if the "value" block is there it fails. Logging the values in the function shows the above parses date as I'd expect, but I guess my expectations differ from the component?

Can anyone spot where I'm going wrong?

Answer 1

You need to set the date of the calendar object rather than the date-picker object, e.g. this.$.datepicker-id.$.calendar.date = new Date();

That worked in terms of resetting the date for the picker, but I actually encountered a different issue afterwards related to not being able to reselect the same date that I previously selected after closing the dialog. I had to remove the logic in calendar._updateSelection to not set the selected.width to 0px.