[FIX] web: remove flickering in calendar popover

Before this commit, the calendar popover was opened before the popover
widget was ready.  This is not usually the way it is done in odoo.

closes odoo/odoo#31874

Signed-off-by: Géry Debongnie (ged) <ged@openerp.com>

addons/web/static/src/js/views/calendar/calendar_renderer.js

@@ -708,24 +708,27 @@ return AbstractRenderer.extend({
      */
     _renderEventPopover: function (eventData, $eventElement) {
         var self = this;
-        $eventElement.popover({
-            animation: false,
-            delay: {
-                show: 50,
-                hide: 100
-            },
-            trigger: 'manual',
-            html: true,
-            title: eventData.record.display_name,
-            template: qweb.render('CalendarView.event.popover.placeholder', {color: this.getColor(eventData.color_index)}),
-            container: eventData.allDay ? '.fc-view' : '.fc-scroller',
-        }).on('shown.bs.popover', function () {
-            var $popover = $($(this).data('bs.popover').tip);
-            $popover.find('.o_cw_popover_close').on('click', self._unselectEvent.bind(self));
-            // Initialize popover widget
-            var calendarPopover = new self.config.CalendarPopover(self, self._getPopoverContext(eventData));
-            calendarPopover.replace($popover.find('.o_cw_body'));
-        }).popover('show');
+
+        // Initialize popover widget
+        var calendarPopover = new self.config.CalendarPopover(self, self._getPopoverContext(eventData));
+        calendarPopover.appendTo($('<div>')).then(() => {
+            $eventElement.popover({
+                animation: false,
+                delay: {
+                    show: 50,
+                    hide: 100
+                },
+                trigger: 'manual',
+                html: true,
+                title: eventData.record.display_name,
+                template: qweb.render('CalendarView.event.popover.placeholder', {color: this.getColor(eventData.color_index)}),
+                container: eventData.allDay ? '.fc-view' : '.fc-scroller',
+            }).on('shown.bs.popover', function () {
+                var $popover = $($(this).data('bs.popover').tip);
+                $popover.find('.o_cw_popover_close').on('click', self._unselectEvent.bind(self));
+                $popover.find('.o_cw_body').replaceWith(calendarPopover.$el);
+            }).popover('show');
+        });
     },
 
     //--------------------------------------------------------------------------

addons/web/static/src/xml/web_calendar.xml

@@ -25,9 +25,6 @@
                 <span class="o_cw_popover_close ml-4"><i class="fa fa-close small"/></span>
             </div>
             <div class="o_cw_body">
-                <div class="py-4 text-center">
-                    <i class="fa fa-spinner fa-spin fa-2x"></i>
-                </div>
             </div>
         </div>
     </t>