[Bug] "Maximum call stack size exceeded" error when abort transitions with query params only
- Dominant language
- TypeScript
- Stars
- 22.6k
- Forks
- 4.2k
- Avg merge
- 3d 12h
- Merged PRs (30d)
- 15
Description
### 🐞 Describe the Bug
We have a `willTransition` action handler in the route class:
routes/application.js
```javascript
import Route from '@ember/routing/route';
import { action } from '@ember/object';
export default Route.extend({
queryParams: {
foo: {
refreshModel: true,
}
},
@action
willTransition(transition) {
// This causes the stackoverflow
transition.abort();
}
});
```
The template only has a simple button:
application.hbs:
```hbs
Update Query Params
```
Calling `router.transitionTo` with query params from the controller causes a "Maximum call stack size exceeded" error
controllers/application.js
```javascript
import Controller from '@ember/controller';
import { action } from '@ember/object';
import { inject as service } from '@ember/service';
export default class ApplicationController extends Controller {
@service('router') router;
@action
updateQueryParam() {
this.router.transitionTo({
queryParams: {
foo: 'bar'
}
});
}
}
```
### 🔬 Minimal Reproduction
Above is the code for minimal reproduction. Ember Twiddle no longer allows me to save my code, but pasting it in there and clicking the button with the console open reveals the stackoverflow issue.
### 😕 Actual Behavior
The `willTransition` hook gets called repeatedly until the stackoverflow occurs.
### 🤔 Expected Behavior
It should not exceed call stack size.
### 🌍 Environment
- Ember: 3.28.11
- Node.js/npm: 16.19.0
- OS: Reproducible on window and mac
- Browser: Reproducible on all major browsers
Contributor guide
Assessment
This issue has not been assessed yet.