Tabs does not load pages

I’m getting a strange behavior that occurs randomly, after sign in I cant change the tab, but the router changes the url.

When the router changes the URL its not even calling ngOnInit, but if I refresh the page everything back to work normally.

I would like some help on how to debug this or any clue where to look for this bug.

I have 2 routes one for authenticated users and other for non authenticated users with guards in each route.
Most of the time this occurs after authentication, I’m using angular fire 6.0

Ionic:

   Ionic CLI                     : 5.4.16
   Ionic Framework               : @ionic/angular 5.1.1
   @angular-devkit/build-angular : 0.803.26
   @angular-devkit/schematics    : 8.3.26
   @angular/cli                  : 8.3.26
   @ionic/angular-toolkit        : 2.2.0

Capacitor:

   Capacitor CLI   : 2.0.1
   @capacitor/core : 2.0.1

Utility:

   cordova-res : not installed
   native-run  : not installed

System:

   NodeJS : v14.2.0 (/usr/bin/node)
   npm    : 6.14.5
   OS     : Linux 5.6

{
  "name": "Project",
  "version": "0.0.1",
  "author": "Joao Pasqualini Costa",
  "homepage": "https://ionicframework.com/",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"


  },
  "private": true,
  "dependencies": {
    "@angular/common": "~8.2.14",
    "@angular/core": "~8.2.14",
    "@angular/fire": "^6.0.0",
    "@angular/forms": "~8.2.14",
    "@angular/platform-browser": "~8.2.14",
    "@angular/platform-browser-dynamic": "~8.2.14",
    "@angular/router": "~8.2.14",
    "@capacitor/core": "2.0.1",
    "@ionic-native/core": "^5.26.0",
    "@ionic-native/splash-screen": "^5.26.0",
    "@ionic-native/status-bar": "^5.26.0",
    "@ionic/angular": "^5.1.1",
    "@ionic/storage": "^2.2.0",
    "@ngx-translate/core": "^12.1.2",
    "@ngx-translate/http-loader": "^4.0.0",
    "core-js": "^2.5.4",
    "firebase": "^7.14.5",
    "ionic": "^5.4.16",
    "opensheetmusicdisplay": "^0.7.6",
    "rxjs": "~6.5.1",
    "tslib": "^1.13.0",
    "zone.js": "~0.9.1"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.803.20",
    "@angular/cli": "~8.3.23",
    "@angular/compiler": "~8.2.14",
    "@angular/compiler-cli": "~8.2.14",
    "@angular/language-service": "~8.2.14",
    "@capacitor/cli": "2.0.1",
    "@ionic/angular-toolkit": "^2.1.1",
    "@ionic/lab": "3.1.3",
    "@types/jasmine": "~3.3.8",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~8.9.4",
    "codelyzer": "^5.0.0",
    "jasmine-core": "~3.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "^5.0.9",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.5.4",
    "protractor": "^7.0.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.15.0",
    "typescript": "~3.4.3"
  },
  "description": "An Ionic project"
}

Captura de tela de 2020-05-24 12-45-56803×683 37.2 KB

<ion-content>
  <ion-tabs>
    <ion-tab-bar slot="bottom">
      <ion-tab-button tab="musics">
        <ion-label [translate]="'HOME.musics'"></ion-label>
      </ion-tab-button>

      <ion-tab-button tab="profile">
        <ion-label [translate]="'HOME.profile'"></ion-label>
      </ion-tab-button>

      <ion-tab-button tab="tab3">
        <ion-label>My Song</ion-label>
      </ion-tab-button>

      <ion-tab-button tab="courses">
        <ion-label [translate]="'HOME.courses'"></ion-label>
      </ion-tab-button>
    </ion-tab-bar>
  </ion-tabs>
</ion-content>

1 post - 1 participant

Read full topic