Nothing displayed - Githubissues

smartroad commented 1 year ago

Hi,

I have setup a fresh install on MM on a Pi3. I've installed Ext3 and used the examples but I don't get anything on screen other than "May" and a line underneath it

        {
            module: "calendar",
            header: "US Holidays",
            position: "top_left",
            config: {
                broadcastPastEvents: true, // <= IMPORTANT to see past events
                calendars: [
                    {
                        symbol: "calendar-check",
                        url: "webcal://www.calendarlabs.com/ical-calendar/ics/76/US_Holidays.ics",
                        name: "us_holiday",
                        color: "red" // <= RECOMMENDED to assign color
                    }
                ]
            }
        },
        {
            module: "MMM-CalendarExt3",
            position: "bottom_bar",
            title: "Calendar",
            config: {
                mode: "month",
                instanceId: "basicCalendar",
                maxEventLines: 5,
                firstDayOfWeek: 1,
                calendarSet: ['us_holiday'],

            }
        },

Am I missing something in my code?

smartroad commented 1 year ago

So I followed the instructions for going to 1.2.6 and I now have the calendar displaying. Not sure if that helps though?

eouia commented 1 year ago

Maybe submodule is not installed properly. Read the read me.md and do the process of update.

Ryanclbryant commented 1 year ago

The calendar module had been working for me for along time, over the weekend I ran through a series of package updates, and then the calendar stopped updating. Upgraded to 1.3.1, the calendar won't display. Downgraded to 1.2.6, nothing was displayed. Installed submodules, now the calendar is visible but no events are displayed, even though my instance of MMM-CalendarExt3Agenda is working correctly.

Absolutely no errors appearing, even with debug logLevel

eouia commented 1 year ago

Can you share me with your real iCal url and configuration file? (eouia0819@gmail.com)

Ryanclbryant commented 1 year ago

I'm copying my calendar down to a local file on my raspi, and the calendar module is just reading from the local file. Just looking at sanitizing the .ics and I'll send it over to you soon, but in the meantime I'm getting the same behaviour with absolutely no calendars included, here's my (current) config:

{
                        module: "MMM-CalendarExt3",
                        position: "bottom_bar",
                        title: "",
                        config: {
                                mode: "week",
                                instanceID: "basicCalendar",
                                firstDayOfWeek: 0,
                                calendarSet: [], //["family_calendar", "personal_calendar", "new_family_calendar"],
                                weekIndex: 0,
                                weeksInView: 2,
                                maxEventLines: 8,
                                animationSpeed: 2000,
                                waitFetch: 10000,
                                fontSize: '19px'
                        }
                },

I even created an empty .ics:

BEGIN:VCALENDAR
PRODID:-//Google Inc//Google Calendar 70.9054//EN
VERSION:2.0
CALSCALE:GREGORIAN
X-WR-CALNAME:Family
X-WR-TIMEZONE:America/Edmonton
END:VCALENDAR

and tried loading it but it's the same behaviour. Before I did my apt package upgrades on Sunday I had weather details being pushed into CalendarExt3, but it isn't happening any longer - while CalendarExt3Agenda is still populating this data. When the Agenda refreshes the Calendar just doesn't.

Ryanclbryant commented 1 year ago

Managed to narrow it down for my issue. There's a specific event that, whenever it is included in a calendar, and a MMM-CalendarExt3* module includes that calendar, that entire module fails to refresh any data at all. I added the calendar that event lives in onto MMM-CalendarExt3Agenda and actually replicated the issue in that module, too.

Noticed that the TZID for that event's DTSTART and DTEND were different than everything else in my .ics files. When expressed in GMT-07:00, the module does not refresh.

DTSTART;TZID="GMT-07:00":20230620T103000
DTEND;TZID="GMT-07:00":20230620T111500

Every other event is expressed as the time zone name, and when I manually edit the event above to match this format, the fresh works successfully.

DTSTART;TZID=America/Edmonton:20230620T103000
DTEND;TZID=America/Edmonton:20230620T111500

Here's a sanitized version of the event to replicate the issue:

BEGIN:VEVENT
DTSTART;TZID="GMT-07:00":20230620T103000
DTEND;TZID="GMT-07:00":20230620T111500
DTSTAMP:20230508T163127Z
UID:C98DC1A6-F932-4C23-A949-7134D01C53EF
URL:message:%3*******@PH7PR13MB5526.namprd1
 3.prod.outlook.com%3E
CREATED:20230508T163127Z
DESCRIPTION:
LAST-MODIFIED:20230508T163127Z
LOCATION:
SEQUENCE:0
STATUS:CONFIRMED
SUMMARY:*******
TRANSP:OPAQUE
BEGIN:VALARM
ACTION:NONE
TRIGGER;VALUE=DATE-TIME:19760401T005545Z
END:VALARM
END:VEVENT

and fixed version of the same:

BEGIN:VEVENT
DTSTART;TZID=America/Edmonton:20230620T103000
DTEND;TZID=America/Edmonton:20230620T111500
DTSTAMP:20230508T163127Z
UID:C98DC1A6-F932-4C23-A949-7134D01C53EF
URL:message:%3*******@PH7PR13MB5526.namprd1
 3.prod.outlook.com%3E
CREATED:20230508T163127Z
DESCRIPTION:
LAST-MODIFIED:20230508T163127Z
LOCATION:
SEQUENCE:0
STATUS:CONFIRMED
SUMMARY:*******
TRANSP:OPAQUE
BEGIN:VALARM
ACTION:NONE
TRIGGER;VALUE=DATE-TIME:19760401T005545Z
END:VALARM
END:VEVENT

I did also test out the nearly 50-year-old alarm, but that seems to be handled seemlessly. Loaded 1.2.6 with the fixed event, it works correctly. Went back to main with the fixed event, it still doesn't load... So that's a different issue!

eouia commented 1 year ago

Weird, because CX3*s don't parse calendar feeds by themselves. They get the event data from the original default calendar module, so that means the data gotten might be polluted from earlier. 'dateStart' and 'dataEnd' of an event should be proper Integer numbers or at least a number-like string when it is delivered as notification from calendar module. I suspect the parser of default calendar module cannot handle that data properly, or missing proper formatting when it tried to emit notification. Could you check the calendar module whether can handle that event? (And it is dawn here so I'll continue this conversation some hours later, sorry)

Ryanclbryant commented 1 year ago

Ah, good call…

[23.05.2023 14:07.01.747] [DEBUG] Processing entry...
[23.05.2023 14:07.01.748] [DEBUG] Event:
< “params”:[],"start":"00:20230620T103000","datetype”:"date-time","end":"00:20230620T111500","dtstamp":"2023-05-08T16:31:27.000Z","uid>
[23.05.2023 14:07.01.749] [DEBUG] start: Invalid Date
[23.05.2023 14:07.01.749] [DEBUG] end:: Invalid Date
[23.05.2023 14:07.01.749] [DEBUG] duration: NaN
[23.05.2023 14:07.01.750] [DEBUG] title: ******
[23.05.2023 14:07.01.750] [DEBUG]  if no tz, guess based on now
[23.05.2023 14:07.01.750] [DEBUG] initial tz=undefined
[23.05.2023 14:07.01.751] [DEBUG] adjustHours=0

So yes; bad tzid handing, I’ll send that through the default calendar module if it isn’t already there.

As for the actual issue reported here, as I mentioned I’m not able to get the module to actually appear when using 1.3.0+, still no error logs to note, it just doesn’t appear when using any of those branches or dev-latest. 1.2.6 works fine, hadn’t tried to upgrade before my package upgrades so I can’t say that is related.

Linux raspberrypi 6.1.21-v8+ #1642 SMP PREEMPT Mon Apr  3 17:24:16 BST 2023 aarch64 GNU/Linux

eouia commented 1 year ago

Ok, let's see what happened after update. First, can you check the front-end console log? You can get it by run npm run start:dev instead of pm2 execution. (You should stop and kill pm2 process before) Or on MM's running screen, the shortcut CTRL + SHIFT + I or CTRL + SHIFT + J would open the dev-console of Chromium/Chrome which is used for front UI of MM. (Ah, are you using serveronly mode and another 3rd party browser for MM? like midori or FF?) There might be some error lines displayed. Could you report me which error happens? Later I'll provide a more verbose version to get detail information on running.

Ryanclbryant commented 1 year ago

Testing dev-1.3.0 on electron browser and safari: My js knowledge is very limited, but enough that I can drop a few extra warns in, ha. Added Log.warn(this.library) at line 214 and 245

[Info] All modules started! (main.js, line 501)
[Warning] undefined (MMM-CalendarExt3.js, line 214)
[Warning] [CX3] Module is not prepared yet, wait a while. (MMM-CalendarExt3.js, line 228)

Confirms that the library isn't being loaded before getDom() is called, but it IS loaded before updateDom() runs.

[Warning] Module {displayLegend: function, eventsByDate: function, gapFromToday: function, getBeginOfWeek: function, getEndOfWeek: function, …} (MMM-CalendarExt3.js, line 145)
[Warning] module tries to update the DOM without being displayed. (main.js, line 547)

Ryanclbryant commented 1 year ago

Adding in some additional logs to figure out what's going on, definitely at my limit now... :) So with these changes:

diff --git a/MMM-CalendarExt3.js b/MMM-CalendarExt3.js
index 1a38bc9..b89dc4d 100644
--- a/MMM-CalendarExt3.js
+++ b/MMM-CalendarExt3.js
@@ -147,11 +147,15 @@ Module.register('MMM-CalendarExt3', {
       if (this?.library?.loaded) {
         this.fetch(conveertedPayload, sender)  
       } else {
+        Log.warn('this._domReady(): ' + this._domReady())
+        Log.warn('this._ready: ' + this._ready)
         Log.warn('[CX3] Module is not prepared yet, wait a while.')
       }
     }

     if (notification === 'DOM_OBJECTS_CREATED') {
+      Log.warn('this._domReady(): ' + this._domReady())
+      Log.warn('this._ready: ' + this._ready)
       this._domReady()
     }

@@ -225,6 +229,8 @@ Module.register('MMM-CalendarExt3', {
         this.updateDom(this.config.animationSpeed)
       }, this.config.refreshInterval)
     } else {
+      Log.warn('this._domReady(): ' + this._domReady())
+      Log.warn('this._ready: ' + this._ready)
       Log.warn('[CX3] Module is not prepared yet, wait a while.')
     }
     return dom
@@ -447,4 +453,4 @@ Module.register('MMM-CalendarExt3', {
     }
     return this.data.header
   }
-})
\ No newline at end of file
+})

Console logs:

[Log] Load script: modules/MMM-CalendarExt3/MMM-CalendarExt3.js (loader.js, line 167)
[Warning] this._domReady(): undefined (MMM-CalendarExt3.js, line 232)
[Warning] this._ready: false (MMM-CalendarExt3.js, line 233)
[Warning] [CX3] Module is not prepared yet, wait a while. (MMM-CalendarExt3.js, line 234)

On load, the calendar is still missing, but as soon as a notification arrives with a calendar update.... it works! Checked out dev-latest, made the same changes.... and it still works! I assume it's relating to domReady(), but I'm not familiar enough to be certain.

eouia commented 1 year ago

Nice approach. The new library is loaded asynchronously not to block MM's execution. So maybe the first attempt of getDom() would fail, and spit out Module is not prepared yet... warning(It is not an error, intended warning) It is intentionally designed so. This module will draw the contents with these conditions;

library is loaded
DOM of this module is created. (the first attempt of getDom())
calendar notification is received at least once.
These 3 conditions would happen in random order or unpredictable time gaps by the environment, so I should postpone the first drawing till all the conditions are prepared.

So in the first few seconds(by your system), my module will not show anything waiting until all the conditions are fulfilled. If this waiting takes somewhat long, there would be some reason;

the library is not loaded (Usually, installation fail or some other reason)
DOM is not created (There would be some uncaught error from this/other modules)
calendar notification is not coming (IDK why, anyway)

However, I have a worry about your approach.

Log.warn('this._domReady(): ' + this._domReady())

When you call this._domReady() just to leave the log, that calling itself will resolve the condition that DOM of this module is created by force. I suspect that the case is not a real solution to your issue. I think you should remove that line and try again.

Ryanclbryant commented 1 year ago

Aha, okay interesting. Removed the domReady() calls, added in some more logging, looks like even when those 3 conditions are met we never move forward with setting _ready:

[Log] Load script: modules/MMM-CalendarExt3/MMM-CalendarExt3.js (loader.js, line 167)
[Warning] _moduleLoaded (MMM-CalendarExt3.js, line 93)
[Warning] _firstData (MMM-CalendarExt3.js, line 105)
[Warning] _firstFetched (MMM-CalendarExt3.js, line 110)
[Warning] _domCreated (MMM-CalendarExt3.js, line 115)
[Warning] notificationReceived(): ALL_MODULES_STARTED (MMM-CalendarExt3.js, line 153)
[Warning] this?.library?.loaded: undefined (MMM-CalendarExt3.js, line 154)
[Warning] this._ready: false (MMM-CalendarExt3.js, line 155)
[Warning] getDom() (MMM-CalendarExt3.js, line 225)
[Warning] this?.library?.loaded: undefined (MMM-CalendarExt3.js, line 226)
[Warning] this._ready: false (MMM-CalendarExt3.js, line 227)
[Warning] draw() (MMM-CalendarExt3.js, line 256)
[Warning] this?.library?.loaded: undefined (MMM-CalendarExt3.js, line 257)
[Warning] this._ready: false (MMM-CalendarExt3.js, line 258)
[Warning] [CX3] Module is not prepared yet, wait a while. (MMM-CalendarExt3.js, line 250)
[Warning] notificationReceived(): MODULE_DOM_CREATED (MMM-CalendarExt3.js, line 153)
[Warning] this?.library?.loaded: undefined (MMM-CalendarExt3.js, line 154)
[Warning] this._ready: false (MMM-CalendarExt3.js, line 155)
[Warning] notificationReceived(): CALENDAR_EVENTS (MMM-CalendarExt3.js, line 153)
[Warning] this?.library?.loaded: true (MMM-CalendarExt3.js, line 154)
[Warning] this._ready: false (MMM-CalendarExt3.js, line 155)
[Warning] notificationReceived(): CALENDAR_EVENTS (MMM-CalendarExt3.js, line 153)
[Warning] this?.library?.loaded: true (MMM-CalendarExt3.js, line 154)
[Warning] this._ready: false (MMM-CalendarExt3.js, line 155)
[Warning] notificationReceived(): WEATHER_UPDATED (MMM-CalendarExt3.js, line 153)
[Warning] this?.library?.loaded: true (MMM-CalendarExt3.js, line 154)
[Warning] this._ready: false (MMM-CalendarExt3.js, line 155)
[Warning] notificationReceived(): CALENDAR_EVENTS (MMM-CalendarExt3.js, line 153)
[Warning] this?.library?.loaded: true (MMM-CalendarExt3.js, line 154)
[Warning] this._ready: false (MMM-CalendarExt3.js, line 155)

I see that the only attempt to call this._domReady() is within notificationReceived(), waiting for DOM_OBJECTS_CREATED, but A) we never actually receive that notification, B) the closest that I can find (MODULE_DOM_CREATED) only is received once, and in this case it is coming in before the library is loaded, so the call is skipped, and seemingly never re-evaluated.

I was able to resolve this by modifying line 154:

-    if (notification === 'DOM_OBJECTS_CREATED') {
+    if (notification === 'DOM_OBJECTS_CREATED' || notification == 'CALENDAR_EVENTS' || notification == 'WEATHER_UPDATED') {
       this._domReady()

Now it seems that as soon as we get that first CALENDAR_EVENTS notification the _ready flag is set to true (because the library is loaded by then), and everything works well from there!

eouia commented 1 year ago

Interesting.

As you can see, DOM_OBJECTS_CREATED fired normally.

The reason for waiting for this notification is to prevent too early getting events before preparing the module. When fewer modules are installed, it may not cause a problem. But if you have so many modules and some might take some time before this module's running, the event notification will arrive before this module's ready. It will make another issue. So I wait every condition should be accomplished.

Anyway, I don't know why your MM doesn't emit DOM_OBJECTS_CREATED notification. But if you feel enough, it might be good for you.

eouia commented 1 year ago

By the way, are you absolutely testing the essential modules? The fact DOM_OBJECTS_CREATED notification is not fired means some module fails to create its DOM or takes a too long time. I think that will be your other problem.

Ryanclbryant commented 1 year ago

Ah! You've found it. A different third party module which seems to have been abandoned is throwing an uncaught error, but still displays correctly. When I comment out that module I am now receiving both.

Normal config:

[Info] All modules started! (main.js, line 501)
[Warning] notificationReceived(): ALL_MODULES_STARTED (MMM-CalendarExt3.js, line 142)
[Warning] [CX3] Module is not prepared yet, wait a while. (MMM-CalendarExt3.js, line 229)
[Error] TypeError: undefined is not an object (evaluating 'this.tasks.items') — MMM-Todoist.js:579
    error
[Warning] notificationReceived(): MODULE_DOM_CREATED (MMM-CalendarExt3.js, line 142)
[Error] Unhandled Promise Rejection: TypeError: undefined is not an object (evaluating 'this.tasks.items')
    (anonymous function) (MMM-Todoist.js:579)
[Warning] notificationReceived(): NEWS_FEED_UPDATE (MMM-CalendarExt3.js, line 142)

When removing MMM-Todoist:

[Warning] notificationReceived(): MODULE_DOM_CREATED (MMM-CalendarExt3.js, line 142)
[Warning] notificationReceived(): DOM_OBJECTS_CREATED (MMM-CalendarExt3.js, line 142)

So yes, a separate module is failing to confirm the dom is loaded, even though it is, and that ends up preventing CalendarExt3 to load properly. Without knowing @smartroad I would hazard a guess they have something similar, then.

eouia commented 1 year ago

Nice. I'll consider to modify my codes not too strict for this kind of pitfall in next update.

-PS- Now I awake to that MODULE_DOM_CREATED would be a better signal than DOM_OBJECTS_CREATED. I'll edit it in next update.

O5ten commented 1 year ago

My MagicMirror is also affected by this. The calendar plugin is showing events nicely but my CalendarExt3 (both snap-1.2.6 and latest) aren't showing anything at all. This is on a little slower system which is also running serveronly. In most browsers, phones and systems it is showing properly, even another (more modern raspberry pi), except the one running the screen where it is needed. In my developer console i spotted an error boundary.at is not a function as well as the CX3 module isn't prepared yet warning but that one appears in all the browsers.

I'd love to test a fix if there is any soon. :)

eouia commented 1 year ago

@O5ten Array.at() was introduced 2 years ago in modern browsers. If your browser might have a too old version, plz update it to a newer one.

I basically develop all my modules to be compatible with Chrome/Chromium because the electron - the MM's standalone front client is using Chromium.

If you are using Midori or another obsolete browser, sorry. It's too painful to make modules to be compatible with those old legacies.

Which browser and version are you using?

CX3 module isn't prepared yet warning is just warning. you don't need to care.

eouia commented 1 year ago

@O5ten

// Array.prototype.at polyfill
Array.prototype.at = function (index) {
  if (index < 0) {
    index += this.length;
  }
  return this[index];
}

Try to add this into the 1st line of config.js; this is monkey-patch, so not a permanent or solid solution for this issue.

O5ten commented 1 year ago

Aaaah, that might actually be it. The mirror running has been running for a little more than two years and is probably not well updated. Thanks for the hint (and the monkey-patch). :)

I could absolutely reproduce the behavior on an old browser.

🎩 off.

xaglen commented 1 year ago

I had the same problem (current version not displaying anything besides the name of the month with a line underneath it), installing the older snap-1.2.6 worked for me.

eouia commented 1 year ago

Update submodule(described in README.md) Or update your MM. Or I need frontend log to examine it.

MMRIZE / MMM-CalendarExt3

Nothing displayed #71