Bug with april month and starting-date-value

[akation]

Description

When Im trying to set starting-date-value and ending-date-value it works with all months except april. I've tried to use new Date(), moment, everything that comes to my mind and still getting problems setting starting-date-value with april (04) month. I even did start date feb to april and it's working, the problem is with april to april.

Error in render: "TypeError: Cannot read property 'days' of undefined"

Code sample

<HotelDatePicker :starting-date-value="temporal_check_in" :ending-date-value="temporal_check_out" @check-in-changed="setCheckinDate" @check-out-changed="setCheckoutDate" />

created() { if (this.$route.query.check_in && this.$route.query.check_out) { this.config.check_in = this.$route.query.check_in; this.config.check_out = this.$route.query.check_out;

 // DOWN HERE WE HAVE THE PROBLEM LINES
  this.temporal_check_in = moment(this.$route.query.check_in).toDate();
  this.temporal_check_out = moment(this.$route.query.check_out).toDate();
}

},

[matiasperrone]

Hi @akation,

Please, provide us with a working example. Can you? because if not, it's more difficult find the exact error and fix it

At first it seems a GET parameters issue... but who knows

[akation]

Let me know if it helps:

http://stage.homebelike.com/

Destination: Dominican Republic Dates: 1 - 3 of april

http://stage.homebelike.com/results?destination=%7B%22label%22%3A%22Dominican%20Republic%22,%22type%22%3A%22country%22,%22id%22%3A66%7D&travelers=%7B%22label%22%3A%221%2B%20Travelers%22,%22value%22%3A1%7D&check_in=2020-4-1&check_out=2020-4-3

Then see the console error =/

[akation]

I was checking the data i received from the URL and console log it.

Data that trigger errors:

2020-5-1 2020-5-9 Fri May 01 2020 00:00:00 GMT-0400 (Atlantic Standard Time) Sat May 09 2020 00:00:00 GMT-0400 (Atlantic Standard Time)

Data working properly:

2020-4-3 2020-4-11 Fri Apr 03 2020 00:00:00 GMT-0400 (Atlantic Standard Time) Sat Apr 11 2020 00:00:00 GMT-0400 (Atlantic Standard Time)

The only difference between them, is the month.

Definitely It should be a bug.

And the bug it's just with :starting-date-value and :ending-date-value

[akation]

Is there anyone else that could help me with this?

[matiasperrone]

Andrés,

I didn't have the time to check this bug. Would you like to send me a PR?

[matiasperrone]

So, here is the console warning:

Deprecation warning: value provided is not in a recognized RFC2822 or ISO format. moment construction falls back to js Date(), which is not reliable across all browsers and versions. Non RFC2822/ISO date formats are discouraged and will be removed in an upcoming major release. Please refer to http://momentjs.com/guides/#/warnings/js-date/ for more info.
Arguments: 
[0] _isAMomentObject: true, _isUTC: false, _useUTC: false, _l: undefined, _i: 2020-4-1, _f: undefined, _strict: undefined, _locale: [object Object]
Error
    at Function.createFromInputFallback (http://stage.homebelike.com/js/chunk-vendors.eecc5776.js:67:56277)
    at Nn (http://stage.homebelike.com/js/chunk-vendors.eecc5776.js:67:81588)
    at Un (http://stage.homebelike.com/js/chunk-vendors.eecc5776.js:67:83398)
    at Bn (http://stage.homebelike.com/js/chunk-vendors.eecc5776.js:67:83264)
    at Xn (http://stage.homebelike.com/js/chunk-vendors.eecc5776.js:67:82982)
    at qn (http://stage.homebelike.com/js/chunk-vendors.eecc5776.js:67:83723)
    at Jn (http://stage.homebelike.com/js/chunk-vendors.eecc5776.js:67:83757)
    at i (http://stage.homebelike.com/js/chunk-vendors.eecc5776.js:67:52920)
    at o.created (http://stage.homebelike.com/js/Results.090be7b8.js:6:55183)
    at nt (http://stage.homebelike.com/js/chunk-vendors.eecc5776.js:35:11657)
Y @ moment.js:293
DevTools failed to parse SourceMap: chrome-extension://hdokiejnpimakedhajhdlcegeplioahd/sourcemaps/onloadwff.js.map

It seems an MomentJS issue. We don't have moment dependencies. Maybe you can create a moment using year, month and day instead of using a string.

I will close this because the problem seems external.

[akation]

ok but I am using moment because i was getting the same error before including moment, and i thought maybe using moment i could fix this issue with the date format.

[matiasperrone]

Why do you transform a perfect good Date object into a string object? that's the problem. this.config.check_out has the problem, try specifying the format string or use the Date object instead and transform the view with a computed property instead.

[akation]

Thank you for trying to help.

Look at this:

Invalid prop: type check failed for prop "startingDateValue". Expected Date, got String with value "Sun May 03 2020 00:00:00 GMT-0400 (Atlantic Standard Time)".

I'm passing through localstorage the whole object, when i try to assign it to startingDateValue I get that error =/

I'm not changing anything, in setCheckinDate and setCheckoutDate when dates change I save them to localstorage and then in other view, try to show the selected dates using starting-date-value and ending-date-value

[matiasperrone]

You have to convert to Date

[akation]

Would you please give me an example? because of the way Im converting it to a date it's not working. Using parse date.

[matiasperrone]

new Date('Sun May 03 2020 00:00:00 GMT-0400 (Atlantic Standard Time)') or try to save it in JSON format

[akation]

I tried that before and got an error, I tried again and got Error in render: "TypeError: Cannot read property 'days' of undefined"

=(

[matiasperrone]

@akation this are development issues please provide me with a https://codepen.io/ and (if I have the time) I will help you.

[akation]

It's a bug, I solved it downgrading the version.

Thanks for the help.

https://github.com/krystalcampioni/vue-hotel-datepicker/issues/139

AdrienMoretti commented on Apr 26, 2019 Hey, can you check your version of Vue Hotel Date Picker in your package-lock.json? Be careful with your version of Vue Hotel Date Picker, because the version 2.7.1 doesn't work, i had the same problem as you.

To solve it, i replaced "vue-hotel-datepicker": "^2.6.4" by "vue-hotel-datepicker": "2.6.4" in package.json

Next, remove node_modules folder, package-lock.json file and install everything again :)

https://www.npmjs.com/package/vue-hotel-datepicker

[matiasperrone]

What version are you using?

[matiasperrone]

Check the v3 RC-1 please! https://github.com/krystalcampioni/vue-hotel-datepicker/releases/tag/v3.0.0-RC1