Issue #2808789 by hanoii, nod_, heddn, geerlingguy, lokapujya, David_Rothstein, mangy.fox, xurizaemon, timfernihough, jibran, effulgentsia, j0rd, joelpittet, temkin, slashrsm, maxi Todorov, leewillis77, droplet, showrx, orbiteleven, opdavies, rooby, yechuah, shabana.navas, nikunjkotecha, ehj-52n, jhedstrom, sah62, edutrul, rfay, seutje, drupalshrek: Drupal alerts "An AJAX HTTP request terminated abnormally" during normal site operation, confusing site visitors/editors

CHANGELOG.txt

@@ -8,6 +8,9 @@ Drupal 7.51, xxxx-xx-xx (development version)
 - Log messages are now XSS filtered on display.
 - Draggable tables do now work on touch screen devices.
 - Added setting for allowing double underscores in CSS identifiers.
+- If a user navigates away from a page while an AJAX request is running they
+  will no longer get an error message saying "An AJAX HTTP request terminated
+  abnormally"
 - Numerous performance improvements.
 - Numerous small bugfixes.
 - Numerous API documentation improvements.

misc/ajax.js

@@ -476,7 +476,7 @@ Drupal.ajax.prototype.getEffect = function (response) {
  * Handler for the form redirection error.
  */
 Drupal.ajax.prototype.error = function (xmlhttprequest, uri, customMessage) {
-  alert(Drupal.ajaxError(xmlhttprequest, uri, customMessage));
+  Drupal.displayAjaxError(Drupal.ajaxError(xmlhttprequest, uri, customMessage));
   // Remove the progress element.
   if (this.progress.element) {
     $(this.progress.element).remove();

misc/autocomplete.js

@@ -310,7 +310,7 @@ Drupal.ACDB.prototype.search = function (searchString) {
         }
       },
       error: function (xmlhttp) {
-        alert(Drupal.ajaxError(xmlhttp, db.uri));
+        Drupal.displayAjaxError(Drupal.ajaxError(xmlhttp, db.uri));
       }
     });
   }, this.delay);

misc/drupal.js

@@ -413,6 +413,29 @@ Drupal.getSelection = function (element) {
   return { 'start': element.selectionStart, 'end': element.selectionEnd };
 };
 
+/**
+ * Add a global variable which determines if the window is being unloaded.
+ *
+ * This is primarily used by Drupal.displayAjaxError().
+ */
+Drupal.beforeUnloadCalled = false;
+$(window).bind('beforeunload pagehide', function () {
+    Drupal.beforeUnloadCalled = true;
+});
+
+/**
+ * Displays a JavaScript error from an Ajax response when appropriate to do so.
+ */
+Drupal.displayAjaxError = function (message) {
+  // Skip displaying the message if the user deliberately aborted (for example,
+  // by reloading the page or navigating to a different page) while the Ajax
+  // request was still ongoing. See, for example, the discussion at
+  // http://stackoverflow.com/questions/699941/handle-ajax-error-when-a-user-clicks-refresh.
+  if (!Drupal.beforeUnloadCalled) {
+    alert(message);
+  }
+};
+
 /**
  * Build an error message from an Ajax response.
  */