title: FullCalendar 5 - eventDrop fails to edit event prop the first time?
body: <p>i have a popover that shows when hovering over an event on my calendar, i was trying to make it so it shows &quot;Unsaved Changes&quot; on it whenever i moved the event to another date, in order to do that i added an extra prop to my events called <code>unsavedChanges</code> and defaulted it to <code>false</code>, and whenever o drag and dropped an event anywhere it would be set to <code>true</code>, like this</p>
  <pre><code>eventDrop: function (info) {
                  info.event.setExtendedProp('unsavedChanges', true);
              }
  </code></pre>
  <p>if the unsavedChanges was true, the popover would have an extra string on the tittle like i wanted.</p>
  <p>This is kinda working, the first time i drag and drop an event nothing changes, but when i do it again it works, and i have no idea why, it seems when eventDrop sets unsavedChanges to true the first time it gets  reverted for some reason, but the second time it works, what am i doing wrong?</p>
  <p>Here's my entire script</p>
  <pre><code> &lt;script&gt;
    document.addEventListener('DOMContentLoaded', function() {
      var calendarEl = document.getElementById('calendar');
  
      var calendar = new FullCalendar.Calendar(calendarEl, {
          initialView: 'dayGridMonth',
          editable: true,
          eventClick: function (info) {
              var endDate = new Date();
              endDate.setDate(info.event.end.getDate() - 1);
              alert('Doodle Id: ' + info.event.id);
              alert('Event: ' + info.event.start.toLocaleDateString(&quot;en-GB&quot;) + ' - ' + endDate.toLocaleDateString(&quot;en-GB&quot;));
          },
          eventMouseEnter: function (info) {
              info.el.style.borderColor = 'black';
          },
          eventMouseLeave: function (info) {
              info.el.style.borderColor = null;
          },
          eventDidMount: function (info) {
              info.el.style.borderWidth = '2px';
              $(info.el).popover({
                  title: function () {
                      if (info.event.extendedProps.unsavedChanges == true) return (info.event.title + ' *Unsaved Changes*');
                      return info.event.title;
                  },
                  placement: 'top',
                  trigger: 'hover',
                  html:true,
                  content: function () {
                      var endDate = new Date();
                      endDate.setDate(info.event.end.getDate() - 1);
                      var imageHtml = '&lt;div class=&quot;img-thumbnail&quot;&gt; &lt;img src=&quot;data:image/png;base64,' + info.event.extendedProps.imageB64 + '&quot; class=&quot;img-thumbnail&quot;/&gt;&lt;/div&gt;';
                      var dateHtml = '&lt;div&gt; Data:' + info.event.start.toLocaleDateString(&quot;en-GB&quot;) + ' - ' + endDate.toLocaleDateString(&quot;en-GB&quot;) + '&lt;/div&gt;';
                      var infoHtml = '&lt;div&gt; Publico: ' + info.event.extendedProps.target +'&lt;/div&gt;';
                      popoverHtml = dateHtml+infoHtml+ imageHtml;
                      return popoverHtml; 
                  },
                  container: 'body'
              });
          },
          eventDrop: function (info) {
              info.event.setExtendedProp('unsavedChanges', true);
          }
        });
  
        @foreach (var doodle in Model.List)
        {
     &lt;text&gt;
        calendar.addEvent({
            id:'@doodle.BannerId',
            title: '@doodle.Name',
            imageB64: '@doodle.Base64File',
            target: '@doodle.TbTargets.First().Name',
            start: '@doodle.DateStart.ToString(&quot;yyyy-MM-dd&quot;)',
            end: '@doodle.DateEnd.AddDays(1).ToString(&quot;yyyy-MM-dd&quot;)',
            unsavedChanges:false,
            allDay:true
        });
     &lt;/text&gt;
        }
        calendar.render();
  
      });
  
  
  
  &lt;/script&gt;
  </code></pre>