router.navigate does not work in mozilla firefox

[DimitarDimitrov123]

• [ X ] Bug Report
• [ ] Feature Request
• [ ] General Query

My version of UI-Router is: "@angular/router": "^5.0.0", "@angular/core": "^5.0.0",

Bug Report

Current Behavior:

Here is my code:

Current link is /app/masterdashboard

this is component.ts method

public onSelectedObject(object: any): void { StorageUtils.setObjectId(object.id); this.selectedObject = this.currentObject(); this.router.navigate(['/app/dashboard']); this.broadcaster.broadcast(events.ObjectIdChanged); }

I'm in Object id = -1 where the name of dashboard is masterdashboard

When click on some Object id !== -1 from lists of Ids in DOM, for example ObjectId = 2, the link will be changed from '/app/masterdashboard' to '/app/dashboard' but this is not happen in firefox, the link stay '/app/masterdashboard'.

This work correctly with chrome.

[joeJazdzewski]

I am having a similar problem but with "angular/router": "^6.1.8." when I try to use this.router.navigate(['/somelink']) the url will change to "http://localhost:4200/" to "http://localhost:4200/#" then back to "http://localhost:4200/". This will only happen in firefox.

[DimitarDimitrov123]

I fixed with settimeout, because firefox fetch event not like chrome.

[manyos-robert]

I do have the same problem. @DimitarDimitrov123 can you please describe how you solved it with settimeout? Thanks!

[DimitarDimitrov123]

myFunction() { this.router.navigate(['/somewhere']); setTimeout(function () { // your code }, 300); }

[manyos-robert]

This seems to work. Thank you!

[gekkedev]

I've had to route dynamically from a constructor. Somehow the component to route to never got initialized in FF, even though the code was reached and the promise got fully & successfully executed. The command to navigate was already placed at the end of the constructor; so there was no additional code to delay.
Setting a symbolic timeout around the routing did solve it for me:

setTimeout(() => {
    this.router.navigateByUrl("/route_to_component")
}, 1);

Dynamically re-routing is sometimes necessary e.g. when you can only determine the index component at runtime. Not the best framework-based routing I've dealt with so far.

[houssemFat]

@gekkedev thank you for the help. We tried to add some delay as you did but unfortunately it doesn't work, neither with ngzone. We have some third party sdks that we call at this time (google analytics and others), when we remove these sdk everything works fine without the async workaround. I think that is related to zone changes detection and it still an issue for us. Any updates from your side ?

[gekkedev]

@houssemFat since this is almost a year ago so I don't quite remember the context and don't have access anymore to that code where it was used because it is corporate property. Your guess on a possible ngZone bug sounds like a step in the right direction. Browser-related problems can be really troublesome every once in a while.