Expanding days with many items throws an error.

[danolsen]

Version

1.15.3

Test Environment

Google Chrome 102.0.5005.115 Microsoft Windows 11 Pro, Version 21H2, OS build 22000.708

Current Behavior

The image shows the my rendered calendar. When I switch between Day/Week/Month I am able to expand days with many calendar entries as seen on June 8. However, after a few switches I start to get an error trying to expand the list of items by clicking the +15. The error says:

Uncaught TypeError: Cannot read properties of null (reading 'children')
    at ./src/js/handler/daygrid/move.js.DayGridMove.checkExpectedCondition [as checkExpectCondition] (tui-calendar.js:13865:32)
    at ./src/js/handler/daygrid/click.js.DayGridClick._onClick (tui-calendar.js:13028:36)
    at r.invoke (tui-code-snippet.min.js:7:17459)
    at r.fire (tui-code-snippet.min.js:7:17262)
    at ./src/js/handler/drag.js.Drag._onMouseUp (tui-calendar.js:15050:14)
    at HTMLDocument.handler (tui-calendar.js:5415:16)

// Calendar creation.
let calendar = new tui.Calendar('#calendar', {
    defaultView: 'month',
    template: {
        allday: function(schedule) {
            let html = [];
            if(schedule.raw.calType === "document") {
                html.push("<i class='fa-solid fa-file'></i> ");
            }
            html.push(schedule.title);
            return html.join("");
        }
    },
    calendars: [
        {
            id: 5,
            name: "Test Calendar"
        }
    ],

});

I load the schedules via a function where I make and ajax call. When the data comes back I call the following:

calendar.clear(true);
calendar.createSchedules(response.data);

I am not sure what causes this error. Some switches work fine and others don't. The error usually appears after three or four view switches. Once I get the error I then get the error every time after any view switch going forward.

Expected Behavior

When I switch views I should be able to expand days that have a large list of items. In the image above, when I click on the +15 it should always work after multiple switches.

[adhrinae]

@danolsen

Usually, the entire state of the calendar instance is not persistent whenever you call the changeView method. Sadly, It's a known bug and hard to fix in the current version.

I'll try to prevent this kind of bug in the next version.

[danolsen]

Do you have a recommendation on how to get around this? So that the calendar continues to work?

[adhrinae]

@danolsen

Can you try clear all schedules before changing views and then recreate them?

// before switching
calendar.clear();
calendar.changeView('month');

// after switching, you may cache your schedule date from the server
calendar.createSchedules(schedules);

[danolsen]

@danolsen

Can you try clear all schedules before changing views and then recreate them?

// before switching
calendar.clear();
calendar.changeView('month');

// after switching, you may cache your schedule date from the server
calendar.createSchedules(schedules);

I still get the same error.

[adhrinae]

@danolsen

OK. I'm afraid I have no idea of any workarounds right now.

[Volmarg]

It's 2024 and the problem still exist.

Well it's a brute force, it will wipe the unsaved data, move calendar etc. but it works. Don't like but it but not having any other option here.

      this.calendarInstance.destroy();
      this.initCalendar(); // my code
      this.calendarInstance.createSchedules(this.schedules);
      this.calendarInstance.changeView(type, true);