FullCalendarVDom.render is throwing errors during calendar initialization

Bug Reports

You MUST post a recreation or else your issue will be CLOSED without explanation. Instructions: https://fullcalendar.io/reporting-bugs

This issue is unfortunately not possible to reproduce on the clean FullCalendar setup. Loading UMD module in a script tag, does not create this issue.

However, the issue is still happening in FullCalendar.

I’m using a CMS tool called Duda: https://www.duda.co/

They allow creating of widgets, kind of like web components, but tied to the CMS backend data directly.

I’ve created one such widget for FullCalendar. Unfortunately, I cannot load FullCalendar, because I always get this error:

main.min.js:6 Uncaught (in promise) TypeError: Cannot read property '__k' of undefined
    at A (main.min.js:6)
    at e.o.handleRenderRequest [as drainedOption] (main.min.js:6)
    at e.drained (main.min.js:6)
    at e.tryDrain (main.min.js:6)
    at e.request (main.min.js:6)
    at t.render (main.min.js:6)
    at calendar:458

Or in unminified version:

 main.js:57 Uncaught (in promise) TypeError: Cannot read property '__k' of undefined
    at H (main.js:57)
    at DelayedRunner.Calendar._this.handleRenderRequest [as drainedOption] (main.js:9112)
    at DelayedRunner.drained (main.js:6976)
    at DelayedRunner.tryDrain (main.js:6958)
    at DelayedRunner.request (main.js:6920)
    at Calendar.render (main.js:9150)
    at calendar:458

It’s basically this line:

i && i.__k || u.__k

Seems like both of these variables are undefined here and that’s where the error happens.

I opened the unminified FullCalendar and found plenty of polyfill code that’s still minified. I assume these are some third-party libraries? It would be great to be able to know which libraries these are. I think this should be written in the docs and maybe added as a comment somewhere in the code as well.

I understand the main issue is with Duda CMS’ JS code, but it’s hard to debug this, since, even “unminified” FullCalendar code has minified parts that are actually throwing errors. How can I find out which library is throwing errors so that I can keep digging? Thanks!

Here’s the webpage where I’m trying to load the calendar: https://morris_ct.multiscreensite.com/calendar

[atertoc]

I ran into this issue as well with version 5.3.2. After some investigation I found that I was using a hashtag (#) in my getElementById method. My original init code looked like this: var calendarObj = new FullCalendar.Calendar(document.getElementById("#calendar")... and once I changed it to: var calendarObj = new FullCalendar.Calendar(document.getElementById("calendar")... the error went away. Not saying the hashtag is always the issue but this does show that the error appears to be tied to whether the getElementById pulls a valid DOM object or not.

You are my bloody hero, I too copied the basic JS examples and converted to jQuery syntax by mistake. As I’ve just started migrating projects to Webpacker, I totally went deep into debugging a non-issue. Thank you so much for saving me!

[sawest]

I ran into this issue as well with version 5.3.2. After some investigation I found that I was using a hashtag (#) in my getElementById method. My original init code looked like this: var calendarObj = new FullCalendar.Calendar(document.getElementById("#calendar")... and once I changed it to: var calendarObj = new FullCalendar.Calendar(document.getElementById("calendar")... the error went away. Not saying the hashtag is always the issue but this does show that the error appears to be tied to whether the getElementById pulls a valid DOM object or not.