emberjs / emberjs/ember.js

[Bug] "Maximum call stack size exceeded" error when abort transitions with query params only

Open
#20,459 2 comments 0 reactions 0 assignees View on GitHub
bug Routing
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.
Screenshot 2023-05-14 at 11 18 13 PM

### 🤔 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

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.