navigateByUrl is failing to route the application

I have a button on a tab page to reset the app for a user by removing a storage entry:

export class Tab1Page {

  constructor(private router: Router, private storage: Storage, private toastController: ToastController) { }

  async resetSettings() {
    await this.storage.remove('welcomeComplete');

    const toast = await this.toastController.create({
      message: 'Your settings have been reset.',
      duration: 2000
    });
    await toast.present();

    console.log('before');
    this.router.navigateByUrl('/');
    console.log('after');
  }
}

In the brower debugger, I can see that the entry is getting deleted from storage. I am also presented with the toast.

However, for some reason, the navigateByUrl method does not seem to be firing. The above pages sits at the url '/tabs/tab1'. Both console.log() statements are executed and there isn't an error in the console.

I'm pretty new to front end development, so apologies if this is a basic newbie question.

from navigateByUrl is failing to route the application