Display route error handler and update URL to the failed page

I’m developing an offline first web application using a service worker. When offline if a user clicks a link then here is what currently happens…

The route model hook fires. The service worker has nothing in cache and returns a 503 response. The json API adapter returns an error which bubbles up to the application route and my global error handler displays an error message saying that the user is offline.

The problem: The url has not been updated. Because my route threw an error the transition was aborted and the URL never updated.

What I want: If a route model hook errors out then I want the URL to be updated and show an appropriate error message. With the URL updated the user could reload the page when back online and get the content they expected.

In my application route I have the following action

error(error, transition) {}

Is it possible to find the URL the transition was attempting to go to?

1 Like

Sorry for resurrecting this, but did you find a solution? We are having the same problem in a project at the moment.

I’m not sure if this is the “right” way to fix it, but you can return an EmberPromise that always resolves successfully, rather than directly returning the API promise response. You can still handle the success and error states separately by resolving either the correct response or redirecting to the error page via the API promise response .then(success, error) handler.

Something like the following:

    return EmberPromise(resolve => {
      this.store.findAll('modelName').then(
        data => resolve(data),
        err => {
          resolve();
          this.transitionTo('errorPage', err);
        }
      );
    });