ember.js: Router Service transitionTo breaks with Query Params on nested transition

Calling transitionTo on a service in the context of an existing transition causes an assertion error to be thrown.

Example Twiddle here

Minimal logic from the reproduction above is: index route’s beforeModel calls the auth service’s ensureSignedIn method which uses the router’s transitionTo method and includes a query param.

Calling it results in:

Assertion Failed: You passed the `login:security_key` query parameter during a transition into login, please update to security_key

About this issue

Original URL
State: open
Created 5 years ago
Reactions: 10
Comments: 17 (8 by maintainers)

Most upvoted comments

We were able to temporarily fix this using RouterService#urlFor method:

Controller.extend({
  router: service(),

  actions: {
    moveUser() {
      // before:
      this.get('router').transitionTo(routeName, routeParamOne, routeParamTwo);

      // after:
      this.customTransition(routeName, routeParamOne, routeParamTwo);
    }
  },

  customTransition(...params) {
    const url = this.get('router').urlFor(...params); // build url first

    this.get('router').transitionTo(url); // and make transition

    // And if you need to preserve query params, I guess you can use `window.location.search` and add this to url like:
    this.get('router').transitionTo(url + window.location.search);
  }
})

Feels like a hack, but works like a charm. Good enough for me until version update

michelvermeer on Feb 26, 2020

We were able to temporarily fix this using RouterService#urlFor method:

Controller.extend({
  router: service(),

  actions: {
    moveUser() {
      // before:
      this.get('router').transitionTo(routeName, routeParamOne, routeParamTwo);

      // after:
      this.customTransition(routeName, routeParamOne, routeParamTwo);
    }
  },

  customTransition(...params) {
    const url = this.get('router').urlFor(...params); // build url first

    this.get('router').transitionTo(url); // and make transition

    // And if you need to preserve query params, I guess you can use `window.location.search` and add this to url like:
    this.get('router').transitionTo(url + window.location.search);
  }
})

kbiedrzycki on Dec 3, 2019