How to bubble up a rejected promise when using Ember.PromiseProxyMixin

Question

I am using Ember's PromiseProxyMixin with AJAX data calls and Ember RSVP Promises. Rather than incorporating error-handling in each route/template, I would like to bubble a rejected promise up to an error handler in the Application route as follows:

export default Ember.Route.extend({
    actions: {
        error: function(error, transition) {
            return this.transitionTo('error');
            return false;
        }
    }
});

Currently, if a promise is rejected, the rejected promise doesn't appear bubble up to the Application route (is this because the PromiseProxyMixin attaches to a promise's .fail() function and prevents further bubbling? If so, is there any way of continuing the bubbling?)

Is it possible to use the PromiseProxyMixin and also allow the rejected promise to bubble up to the Application route?

Severus

It depends where you are using the promise proxy, if you aren't using it as part of the routing and as part of a computed property or some other functionality then the error won't be raised in the routes error action. That is specifically used by transitions and routing. You can hook up to other application errors/Promise errors via the mechanisms located on this page guides.emberjs.com/v1.10.0/understanding-ember/debugging. As a side note the promise proxy still does throw exceptions when encountered. – Transcendent

I believe that's exactly the reason - I create several PromiseProxyMixins in the Route's model, but as there are several requests and I want to display each result as soon as it has completed, I return a map of PromiseProxyMixins from the model function (so the model function returns straightaway) and use the {{#if model.somePromise.isPending}} to update each part of the template accordingly. I think that's the way it should be done anyway! Will check out the link. Thanks! – Severus

Answer 1

I'm not sure that it will solve your problem, but we did encounter differences in Es6 promises and jQuery promises, therefore we convert all jQuery promises to Es6 by default using the following initializer. We also convert other "thennables" using the when method below:

import Ember from 'ember';

function initialize() {
  var $ajax = Ember.$.ajax;
  Ember.RSVP.when = function(promise, label) {
    return new Ember.RSVP.Promise(promise.then.bind(promise), label);
  };
  return Ember.$.ajax = function() {
    return Ember.RSVP.when($ajax.apply(Ember.$, arguments), '$.ajax');
  };
};

var PromiseAdapterInitializer = {
  name: 'promise-adapter',
  initialize: initialize
};

export {initialize};
export default PromiseAdapterInitializer;

Waldon

Thanks for the post. I already take a similar approach to convert to RSVP promises, so I think there's something else causing issues. – Severus