Fix for Ionic 4 Side Menu Freezing
After upgrading our Ionic application to Ionic 4, testers started reporting that the side menu randomly froze in place when an item inside it was clicked. The problem could only be resolved by restarting the application.
We tracked it down to the following two lines of code executing in ionViewWillLeave after a page navigation was triggered from the side menu:
await this.menuCtrl.close();
await this.menuCtrl.enable(false);
Unfortunately, we didn't have a reliable way to reproduce the issue and the code seemed perfectly valid. Finally, we managed to correlate the problem with the following log entry:
Error: ASSERT: _before() should be called while animating
This made it possible to identify the originating part of the code in Ionic's GitHub repository. Not long after that we also determined how to reliably reproduce the issue. The menu item had to be clicked before the menu opening animation ended.
Finding the fix didn't take long either. We added a guard to the menu item click handler, ignoring the action if the menu opening animation was still in progress:
if (await this.menuCtrl.isOpen()) {
// perform the requested page navigation
}
Although I still consider this to be a bug in Ionic (which I reported), I'm glad we at least have the source code available. It helped a lot in pinpointing the cause of the issue and then resolving it.
