transition.abort doesn't stop the URL from updating
- Dominant language
- TypeScript
- Stars
- 22.6k
- Forks
- 4.2k
- Avg merge
- 3d 12h
- Merged PRs (30d)
- 15
Description
`transition.abort()` is not currently working as expected. In some circumstances, when the user hits the back button, we prompt the user for unsaved changes. We handle this scenario in a lot of places by doing something like the following (This is the suggested approach in the tutorial [here](https://guides.emberjs.com/release/routing/preventing-and-retrying-transitions/))
```js
if (!confirm("You have unsaved changes")) {
transition.abort();
}
```
The above doesn't appear to work 100% of the time. While the route has not changed, the browser URL points to something else.
**Code for the above example**
I created a test ember app to replicate this. The code in this repo follows ["Create your first ember app"](https://guides.emberjs.com/release/routing/preventing-and-retrying-transitions/) tutorial guidelines.
https://github.com/apoorvparijat/test-ember-app
**Steps to reproduce**
1. Pull the code from the repo and start ember server
2. Point your browser to http://localhost:4200/about route
3. Click on `Contact` link
4. You will see a confirmation dialog. The URL does NOT change at this point. Press OK here.
5. You have now landed on Contact page - http://localhost:4200/contact
6. Hit the browser back button now. You will see the confirmation dialog again.
**What I expect to happen:** The URL stays the same on `/contact`
**What does happen:** The URL has already changed to the `/about` page before accepting the dialog
7. If you press Cancel, the URL and Ember app ends up in an inconsistent state. The URL points to /about but Contact route is loaded.
**GIF demonstrating the same**

Contributor guide
Assessment
This issue has not been assessed yet.