[BUG] FullCalendar interaction - tooltips not rendering on views after the first

[thely]

Bug description
This one's a bit odd, because I don't know if it's this package or FullCalendar causing the issue. When using react-tooltip (as a global Tooltip object) with FullCalendar, only the first view's events will render tooltips. If I'm looking at a month view, the first month will render correctly. But for any other month other than the starting month, no tooltips render. (This happens with other FC views as well.) Looking in the inspector, no element appears in the DOM when hovering events in time periods outside the default. I've provided a CodeSandbox.

I saw that there used to be a rebuild() method in previous versions that's been deprecated in V5. Is there still a way to access that behavior, assuming it might fix the problem?

Version of Package
v5.30.0

To Reproduce
See the CodeSandbox minimal version here. Make sure the first two events are today, and the next two events are the following month (such that they don't render on the first month view). Hover the events in the current month, and the tooltips render; use the arrow buttons in the upper right to go to the next month, and the tooltips don't render.

To see the bug on more than one FC view, remove dayGridPlugin from the plugins list, and make sure you have two events happening on two different days for the resourceTimelinePlugin to show the issue correctly.

Expected behavior
Tooltips render on every hovered event. Instead, they only show up for events rendered in the first view.

Desktop (please complete the following information if possible or delete this section):

• OS: Mac OS 12
• Browser: Firefox v143
• Frameworks: React v18, FullCalendar v6.1.18

[danielbarion]

@thely I also realized when we move to a few months forward and we back using the arrows, sometimes the second month with events starts to render it and the current month stops, @gabrieljablonski do you have any thoughts about that behavior?

[gabrieljablonski]

I tried figuring out the exact cause for the issue, but could not pin-point it. But very likely the way the FullCalendar component re-renders the month view is interacting poorly with the document observer we use internally to detect tooltip anchors being added/removed on the DOM.

A quick workaround (which I don't think will have any severely negative side-effects) is to re-render the tooltip component when the view changes, using key prop on the tooltip.

https://codesandbox.io/p/sandbox/interesting-leavitt-xfty67

The example uses the simplest key updating logic (increase counter on dates change), but extracting the date start/end range from the datesSet callback object and using that as the key is probably the "proper" way to do it.

---

That being said, we should probably leave this issue open, as it might be due to a bug in how we're using document observer.