Changing child route query params and willTransition

1

Hi, I’m still relatively new to Ember dev but I’ve recently got stuck with an issue that causes a Maximum call stack exceeded error. Here’s my routes:

  1. /parent/
  2. /parent/childA/:id
  3. /parent/childA/:id/childB?selectionA=X

On route #1 the user selects which childA object they want to modify. This loads the child route into it’s outlet. On route #2, the user selects from a few dropdowns options which childB object they would like to modify. This loads the child route into it’s outlet. On route #3 the selected childB object is displayed for modification

Route #3 contains a willTransition that checks if there is a dirty model, preventing the user from leaving the page unless they choose to roll back the changes.

The issue arises when the user is currently viewing a childB object, and then changes the dropdown parameters on route#2, to select a different childB object to modify. This changes the route from say /parent/childA/1/childB?selectionA=100 to /parent/childA/1/childB?selectionA=200. This fires the willTransition function, detects unsaved changes in the model and the transition is aborted. However, ember will keep firing this event and the same willTransition code will be run until it hits the maximum call stack error.

Is this an issue in the way I’ve designed the route/child routes?

2

This suggests that there’s an error in your code somewhere but it’s not possible to say where without seeing it.

Try reproducing the problem in a twiddle and post it here or on slack