Ion menu issue

I have build my Ionic 5 app and have a sidemenu on my home page . When I swipe to open my side menu immediately after the app loaded, the app freezes. Here is the error stack. What is the possible solution for this issue ?

ion-menu_3.entry.js:215 Uncaught (in promise) TypeError: Cannot read property ‘offsetWidth’ of undefined
at Menu.loadAnimation (ion-menu_3.entry.js:215)
at Menu._setOpen (ion-menu_3.entry.js:207)
at Object._setOpen (index-0d58a5bf.js:239)
loadAnimation @ ion-menu_3.entry.js:215
_setOpen @ ion-menu_3.entry.js:207
_setOpen @ index-0d58a5bf.js:239
Promise.then (async)
scheduleMicroTask @ zone-evergreen.js:552
scheduleTask @ zone-evergreen.js:388
scheduleTask @ zone-evergreen.js:210
scheduleMicroTask @ zone-evergreen.js:230
scheduleResolveOrReject @ zone-evergreen.js:847
resolvePromise @ zone-evergreen.js:785
(anonymous) @ zone-evergreen.js:705
Promise.then (async)
(anonymous) @ zone-evergreen.js:1060
ZoneAwarePromise @ zone-evergreen.js:960
Ctor.then @ zone-evergreen.js:1060

I have this same error with Ionic 5/6 with Capacitor running production build (at least) in Android device. It doesn’t have to happen immediately after the app is loaded but after menu has been worked once then there’s no problem. But if menu can’t be opened for the first time then app freezes and it has to be reopened.

I have tried different parameters for ion-menu and ion-menu-button and to set platform.ready, ngIfs, timeouts etc. to make sure app has been fully loaded before menu can be opened but with no luck. It doesn’t matter if you open menu via ion-menu-button, with MenuController or by swiping. All of these randomly cause this same exception.

This exception doesn’t end up to global error handler and that’s why the whole application crashes. Is there anything that can be done to menu problem and/or to error handling (freeze) problem?

Exception is:
01-19 15:29:06.338 20987 20987 E Capacitor/Console: File: http://localhost/polyfills.47b98325b16126ba.js - Line 1 - Msg: Unhandled Promise rejection: Cannot read properties of undefined (reading ‘offsetWidth’) ; Zone: ; Task: Promise.then ; Value: TypeError: Cannot read properties of undefined (reading ‘offsetWidth’) TypeError: Cannot read properties of undefined (reading ‘offsetWidth’)
01-19 15:29:06.338 20987 20987 E Capacitor/Console: at http://localhost/8136.43bb46f625a91af7.js:1:4254
01-19 15:29:06.338 20987 20987 E Capacitor/Console: at Generator.next ()
01-19 15:29:06.338 20987 20987 E Capacitor/Console: at r (http://localhost/main.0e9715f0709f4b99.js:1:1193278)
01-19 15:29:06.338 20987 20987 E Capacitor/Console: at E (http://localhost/main.0e9715f0709f4b99.js:1:1193482)
01-19 15:29:06.338 20987 20987 E Capacitor/Console: at http://localhost/main.0e9715f0709f4b99.js:1:1193541
01-19 15:29:06.338 20987 20987 E Capacitor/Console: at new t (http://localhost/polyfills.47b98325b16126ba.js:1:18578)
01-19 15:29:06.338 20987 20987 E Capacitor/Console: at http://localhost/main.0e9715f0709f4b99.js:1:1193423
01-19 15:29:06.338 20987 20987 E Capacitor/Console: at x.loadAnimation (http://localhost/8136.43bb46f625a91af7.js:1:4499)
01-19 15:29:06.338 20987 20987 E Capacitor/Console: at http://localhost/8136.43bb46f625a91af7.js:1:4107
01-19 15:29:06.338 20987 20987 E Capacitor/Console: at Generator.next ()

Same problem with iPhone. Sucks when everything works when developing but now can’t publish new version of app because of this :frowning:

Only way I could do to round this issue was to add [disabled]=“loading” to ion-menu and use setTimeout to set loading = false. *ngIf on ion-menu didn’t do the trick. Only unpleasant thing is that icon that ion-menu-button creates doesn’t get rendered immediately but after timeout has passed.