bug(MatDialog): Immediate navigation to a route after MatDialog is closed, crashes the Angular App / browser
- Langage dominant
- TypeScript
- Étoiles
- 25k
- Forks
- 6.8k
- Merge moyen
- 1 j 8 h
- PR mergées (30 j)
- 91
Description
### Is this a regression?
- [X] Yes, this behavior used to work in the previous version
### The previous version in which this bug was not present was
_No response_
### Description
I am loading a dialog to ask user to verify email. On the dialog there's also a link which can be clicked in case user wants to update their email. As soon as the user click Update Email link and dialog is closed the browser tab crashes and Chrome display `Aw, Snap! error`
### Reproduction
I am loading a dialog to ask user to verify email. On the dialog there's also a link which can be clicked in case user wants to update their email.
```
import('./verify-email-dialog.component').then((c) => {
let config = new MatDialogConfig();
config.viewContainerRef = this.viewContainerRef;
config.disableClose = true;
config.panelClass = "header-pattern";
this.dialogRef = this.dialog.open(c.VerifyEmailDialog, config);
this.dialogRef.afterClosed().subscribe(result => {
if (result == 'updateEmail') {
this._router.navigate(['/account/manage/profile']);
return;
}
if (result === true) {
this.emailConfirmed = true;
}
});
});
```
Below is how I am closing dialog in case user click Update Email link in `VerifyEmailDialog`:
```
updateEmail() {
this.dialogRef.close('updateEmail');
}
```
As soon as the user click Update Email link and dialog is closed the browser tab crashes and Chrome display `Aw, Snap! error`
### Expected Behavior
it should work smoothly
### Actual Behavior
The browser crashes
### Environment
Angular CLI: 17.0.0-rc.4
Node: 18.18.2
Package Manager: npm 9.8.1
OS: win32 x64
Angular: 17.0.0-rc.3
... animations, cdk, common, compiler, compiler-cli, core, forms
... google-maps, material, platform-browser
... platform-browser-dynamic, platform-server, router
... service-worker
Package Version
---------------------------------------------------------
@angular-devkit/architect 0.1700.0-rc.4
@angular-devkit/build-angular 17.0.0-rc.4
@angular-devkit/core 17.0.0-rc.4
@angular-devkit/schematics 17.0.0-rc.4
@angular/cli 17.0.0-rc.4
@angular/fire 16.0.0
@angular/pwa 17.0.0-rc.4
@schematics/angular 17.0.0-rc.4
rxjs 7.8.1
typescript 5.2.2
zone.js 0.14.0
Guide de contribution
Ouvrir le guide de contribution
Piste de recherche
Commencez par le flux MatDialog présenté dans la reproduction : dialog.open, afterClosed, dialogRef.close('updateEmail') et l’appel router.navigate qui suit. Reproduisez la séquence de navigation immédiate dans l’environnement Angular 17 ; le travail est terminé lorsque la fermeture de la boîte de dialogue et la navigation vers /account/manage/profile ne font plus planter le navigateur.
Rédigé par le modèle d'indexation à partir du texte de l'issue.
Évaluation
- Stack technique
- angular, typescript
- Domaine
- frontend
- Type d'issue
- Bug
- Difficulté
- 4/5
- Temps estimé
- 3-5 jours
- Activité
- À l'abandon
- Clarté
- À clarifier
- Accessibilité débutants
- 35/100