XWIKI-24270: Saving in the class editor sometimes shows a confirmation about unsaved changes

xwiki-platform-core/xwiki-platform-flamingo/xwiki-platform-flamingo-skin/xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/editclass.vm

@@ -165,7 +165,12 @@ $xwiki.jsfx.use('js/xwiki/editors/dataeditors.js', true)##
 #classSwitcher()
 ##
 ##
-<form id="$formname" method="post" action="$doc.getURL('preview')" class="withLock xform">
+## Mark this as a custom form so actionButtons.js still emits the standard save events (needed by the client-side
+## dirty-state handling) but doesn't replace the native Save & View submission with the generic AJAX save path.
+## The generic AJAX path currently submits action_save / action_saveandcontinue unless a custom submit value is
+## configured, while the class editor needs action_propupdate.
+## Further, PropUpdateAction doesn't return error/success messages in the format expected by the AJAX save path.
+<form id="$formname" method="post" action="$doc.getURL('preview')" class="withLock xform" data-custom-form="true">
 <div id="xwikieditcontent" class="clear">
 ##
 ##

xwiki-platform-core/xwiki-platform-web/xwiki-platform-web-war/src/main/webapp/resources/js/xwiki/actionbuttons/actionButtons.js

@@ -80,6 +80,11 @@ var XWiki = (function(XWiki) {
       $$('input[name=action_save]').each(function(item) {
         item.observe('click', this.onSubmit.bindAsEventListener(this, 'save'));
       }.bind(this));
+      // Bind also on propupdate which is used in the class editor. This is a custom form, but we still bind the
+      // button here to have the same save events.
+      $$('input[name=action_propupdate]').each(function(item) {
+        item.observe('click', this.onSubmit.bindAsEventListener(this, 'save'));
+      }.bind(this));
       $$('input[name=action_saveandcontinue]').each(function(item) {
         item.observe('click', this.onSubmit.bindAsEventListener(this, 'save', true));
       }.bind(this));

xwiki-platform-core/xwiki-platform-web/xwiki-platform-web-war/src/main/webapp/resources/js/xwiki/editors/dataeditors.js

@@ -60,6 +60,7 @@
           deletedXObjects: {} // objects deleted but not removed yet
         };
         this.editedDocument = XWiki.currentDocument;
+        this.submitInProgress = false;
         this.unsavedChanges = false;
 
         $('.xclass').each(function() {
@@ -99,18 +100,31 @@
           }
           self.editorStatus.addedXObjects = {};
           self.editorStatus.deletedXObjects = {};
+          self.submitInProgress = false;
           self.unsavedChanges = false;
         });
 
+        $(document).on('xwiki:document:saveFailed', function () {
+          self.submitInProgress = false;
+        });
+
         // in case of cancel we just clean everything so that we don't get any warnings for leaving the page without saving.
         $(document).on('xwiki:actions:cancel', function () {
           // Remove fields about deleted and added objects
           $('input[name=deletedObjects]').remove();
           $('input[name=addedObjects]').remove();
           self.editorStatus.addedXObjects = {};
           self.editorStatus.deletedXObjects = {};
+          self.submitInProgress = false;
           self.unsavedChanges = false;
         });
+        // Disable the leave confirmation during Save & View navigation while preserving the dirty state for Save &
+        // Continue until the save has actually completed.
+        $(document).on('xwiki:actions:save', function (event, data) {
+          if (!data?.continue) {
+            self.submitInProgress = true;
+          }
+        });
         // We want to listen on inputs related to an xclass or an xobject, but not the actual inputs allowing
         // to create a property or an object.
         let filterInputs = function () {
@@ -130,6 +144,10 @@
         // We cannot use jQuery style to listen on event for this one as apparently it's not working
         // See: https://stackoverflow.com/questions/4376596/jquery-unload-or-beforeunload
         window.onbeforeunload = function(event) {
+          if (self.submitInProgress) {
+            self.submitInProgress = false;
+            return;
+          }
           if (Object.keys(self.editorStatus.addedXObjects).length > 0
             || Object.keys(self.editorStatus.deletedXObjects).length > 0
             || self.unsavedChanges) {
@@ -806,4 +824,4 @@
   });
 
 // End JavaScript-only code.
-}).apply(']]#', $jsontool.serialize([$icons]));
+}).apply(']]#', $jsontool.serialize([$icons]));