How to prevent an Ajax form from submitting

Question

The below code blocks any non-ajax form from submitting.

$(this.form)
  .on('submit', function(event) {
    if (/* Some condition */) {
      event.preventDefault();
    }
  });

In Drupal 8, how can we block an Ajax form from being submitted?

Ajax forms do not trigger a form submit handler and I have not been able to block the click event on an Ajaxified form's submit buttons.

For reference, I am trying to fix Issue #3010084: Form submission finishes before file upload is complete

Answer 1

I found the solution here.

// Add submit handler to form.beforeSend.
// Update Drupal.Ajax.prototype.beforeSend only once.
if (typeof Drupal.Ajax !== 'undefined' && typeof Drupal.Ajax.prototype.beforeSubmitOriginal === 'undefined') {
  Drupal.Ajax.prototype.beforeSubmitOriginal = Drupal.Ajax.prototype.beforeSubmit;
  Drupal.Ajax.prototype.beforeSubmit = function (form_values, element_settings, options) {
    if (/* Custom condition */) {
      this.ajaxing = false;
      return false;
    }
    return this.beforeSubmitOriginal();
  };
}