Handling AJAX errors

We have built the happy path of our application. But in the real world an error can occur during communication with the server. To manage this there are two ways:

• The fail method of the AJAX promise:

  ProductResource.remove()
  .done(function(){...})
  .fail(function(response){
    console.error(response);
    alert("Error in the communication. Check the console!");
  });

• A global AJAX error handler:

  $(document).ajaxError(function(event,response) {
    console.error(response);
    alert("Error in the communication. Check the console!");
  });

If you have a consistent error format, the global handler is a very good choice to handle errors.

To test an error, update the status attribute of one mock from 200 to 404 or 501:

$.mockjax({
  url: /^\/products\/([\d]+)$/,
  type:"DELETE",
  dataType: "json",
  responseTime: 750,
  status:404,
  responseText: {
    "data": {
      text: "Product deleted"
    }
  }
});