Hi there,
I am using the Scheduler component and more generally the Date object from DayPilot Pro React.
I recently encountered a problem where I tried to convert date strings in the format "YYYY-MM-DD" to DayPilot.Date objects:
[1] const originalDate = "2022-05-16";
[2] const dateObject = DayPilot.Date(originalDate);
[3] console.log(dateObject, typeof dateObject)
[4] dateObject.addDays(10);
The dateObject from line [2] would log as undefined on line [3], and consequently, line [4] then gave me the following error (in Chrome):
"TypeError: Cannot read properties of undefined (reading 'addDays')"
However, I realized that the "new" keyword was missing in line [2], and once added, it seems like the code now runs as expected:
[2] const dateObject = new DayPilot.Date(originalDate);
So far, so good. However, I have follow-up questions on this issue, since I don't completely understand it's behaviour in my code:
Weirdly, I encountered the problem described above when I tried to reproduce the bug in an isolated setting, but the original behaviour in the ComponentDidMount of my Scheduler component (where the bug first appeared) was somewhat different:
There, I get my originalDate string from an object property -- I verified that it is always a valid date string in the format "YYYY-MM-DD", so I could not think of a reason why this should behave differently -- and instead of undefined, the equivalent to line [3] would show that the date gets converted to a regular Object here, looking like this (nested objects shortened for readability):
{
"Global": {...},
"isKhtml": true,
"isIE": false,
"isIEQuirks": false,
"browser": {...},
"libs": {...},
"touch": {...},
"Stats": {...},
"Util": {...},
"Areas": {...},
"Http": {},
"DateUtil": {},
"ColorUtil": {},
"ModalStatic": {...},
"value": "2022-05-16T00:00:00"
}
Regardless, the equivalent to line [4] would still log the same error as before:
"TypeError: Cannot read properties of undefined (reading 'addDays')"
What is even more surprising is that this problem ONLY occurs in my Scheduler component if the date is after 2022-05-11, while dates before that are simply converted to DayPilot.Date objects without any errors (even without the "new" keyword).
When placing the exact code from my example in the Scheduler component right before the original bug, I get type undefined from line [3] and the same error from line [4] -- for any dates after 2022-05-01. Dates before this convert to DayPilot.Date perfectly fine. (Note that the date where it switches to causing errors is even different...)
Curiously, if I place the following line right before THAT (i.e., in the ComponentDidMount of the Scheduler component, before the original bug and example code), this yet again leads to different behaviour:
console.log(DayPilot.Date("2022-05-10"));
- If the logged date's string is any day before 2022-05-02, this seems to cause no additional bugs (it logs a normal DayPilot.Date object)
- If the logged date's string is 2022-05-02 or later, and the other buggy code snippets after this are set to dates that work (i.e., before 2022-05-02 or 2022-05-12, respectively), this causes strange unrelated-looking bugs way further down in the code that don't appear otherwise ("TypeError: Cannot read properties of null (reading 'rows')")
- If the logged date's string is 2022-05-02 or later, and the other buggy code snippets after this are set to dates that DON'T work either, it causes the following error "TypeError: Cannot redefine property: ticks"
I apologize for this wall of text, but since this behaviour is really unintuitive for me and hard to reproduce, I wonder if anyone else has encountered similar problems, especially linked to changing behaviour depending on the date. I have to add that I am not highly proficient in React/Javascript, so if this makes sense to anyone with a better understanding of the languages, an explanation would be very much appreciated.
Thank you for taking the time to consider my problem!
Best,
Katharina