Wrap jQuery Ajax in real Promise

wrap-jquery-ajax-promise.js

(function() {
  function AjaxError(jqXHR, textStatus, errorThrown) {
    this.name = 'AjaxError';
    this.message = textStatus;
    this.jqXHR = jqXHR;
    this.errorThrown = errorThrown;
  }
  AjaxError.prototype = new Error();
  AjaxError.prototype.constructor = AjaxError;

  function wrapAjax(jqPromise) {
    return new Promise(function(resolve, reject) {
      jqPromise.then(function(data, textStatus, jqXHR) {
        resolve(data);
      }, function(jqXHR, textStatus, errorThrown) {
        reject(new AjaxError(jqXHR, textStatus, errorThrown));
      });
    });
  }

  Promise.wrapAjax = wrapAjax;
})();

If you want access to the metadata on success, just do:

resolve({ data: data, textStatus: textStatus, jqXHR: jqXHR });

and in the consumer code, something like:

request.then((response) => render(response.data));