Ionic 4 side menu does not close on some Android devices

Ionic Framework ionic-v3
1

Hello, I recently released an app using ionic 4. We have had a few Android user state that the side menu does NOT close after a selection has been made.

I have checked it on a number of Android devices we have and have not been able to duplicate it.

In my app.component.html I have the following.

<ion-menu side="start" menuId="first" [disabled]="onConnectionPage === true" [swipeGesture]="false">
    <ion-header>
      <ion-toolbar>
        <ion-title (click)="defaultSettings()" style="font-size:16px;">ChargerConnect</ion-title>
      </ion-toolbar>
    </ion-header>
    <ion-content>
      <ion-list lines="none">
        <ion-menu-toggle>
          <ion-button (click)="disconnect()" color="primary" expand="full">
            {{ 'Disconnect' | translate }}
          </ion-button>
    
          <ion-button (click)="openPage(pages[0])" style="--background:var(--dashboard)" expand="full">
            {{ dashboardString }}
          </ion-button>
  
          <ion-button (click)="openPage(pages[1])" style="--background:var(--diagnostic)" expand="full">
            {{ diagnosticsString }}
          </ion-button>

          <ion-button (click)="openPage(pages[2])" [disabled]="disableMenuOptions" style="--background:var(--history)" expand="full">
            {{ historyString }}
          </ion-button>
  
          <ion-button (click)="openPage(pages[3])" style="--background:var(--system-information)" expand="full">
            {{ systemInformationString }}
          </ion-button>

          <ion-button (click)="openPage(pages[4])" [disabled]="disableMenuOptions" style="--background:var(--system-profile)" expand="full">
            {{ systemProfileString }}
          </ion-button>

          <ion-button (click)="openPage(pages[5])" [disabled]="disableMenuOptions" style="--background:var(--battery-profile)"  expand="full">
            {{ batteryProfileString }}
          </ion-button>

          <ion-button (click)="openHelp()" expand="full">
            {{ 'Help' | translate }}
          </ion-button>
        </ion-menu-toggle>
      </ion-list>
    </ion-content>
  </ion-menu>

I am using ion-menu-toggle and by default auto-hide is set to true.

Is there someone in my html that could be causing this?

Thanks

2

I have also just had this problem on one particular device (Samsung Tab A). Did you get to the bottom of this?

3

Please update to the latest version of Ionic. That issue has already been fixed.

npm i @ionic/angular

4

See this link. Somebody tried updating to 4.11.2 and it did not help.

This did fix the problem:
<ion-menu-toggle menu="first" autoHide="false">

5

I have updated to 4.11.2 and some customers are still seeing the issue. I have also seen people with the issue try:

<ion-menu-toggle menu="first" autoHide="false">

This did not help either.

Any other thoughts on how to resolve the issue?

6

Updated to 4.11.8 from 4.11.5.
This seems to solve the issue for me on Samsung Galaxy Tab Active 2.