bug: IonMenu not working on Android / Capacitor

[nbardon]

Prerequisites

• [x] I have read the Contributing Guidelines.
• [X] I agree to follow the Code of Conduct.
• [X] I have searched for existing issues that already report this problem, without success.

Ionic Framework Version

v8.x

Current Behavior

Hello,

I built a mobile app that have a left side menu with recommended code. The menu works just fine in web live preview (with ionic serve) but stops working when I compile on android emulator. So, I created a new project from sidemenu template to be sure that I didn't break the code. But the issue persists...

I debugged with Chrome Dev Tools and I noticed that the menu-backdrop has opacity of 0.01 and seems to be not supported on Android WebView. The backdrop appears when I set the opacity to 0.1.

The side menu does not appear either. I do not understant exactly why but it appears when I remove the rule transform: translateX(-9999px) (and -webkit-transform of course).

Installed versions :

• Ionic CLI : 7.2.0
• Android Studio : 2024.1.1
• OpenJDK : 64 bits 17.0.10b1087.21-11609105 by JetBrains
• Graddle : 8.2.1
• Android 9, build number : PSR1.180720.117
• Pixel_Fold_API_35:5554
• Webview : 69.0.3497.100
• Google play services : 24.32.33 (100700-662265838)

Expected Behavior

I expected the menu appears 🙃

Steps to Reproduce

1. Create a new project with template code ionic start

Framework: React Name: test Starter template: sidemenu

2. Add Capacitor/Android ionic cap add android

3. Build ionic cap build android

4. Run on emulator (using Android Studio)

Code Reproduction URL

https://github.com/ionic-team/starters/tree/main/react/official/sidemenu

Ionic Info

[WARN] Error loading @capacitor/ios package.json: Error: Cannot find module '@capacitor/ios/package.json'

   Require stack:
   - /opt/node-v20.15.0-linux-x64/lib/node_modules/@ionic/cli/lib/project/index.js
   - /opt/node-v20.15.0-linux-x64/lib/node_modules/@ionic/cli/lib/index.js
   - /opt/node-v20.15.0-linux-x64/lib/node_modules/@ionic/cli/index.js
   - /opt/node-v20.15.0-linux-x64/lib/node_modules/@ionic/cli/bin/ionic

Ionic:

Ionic CLI : 7.2.0 (/opt/node-v20.15.0-linux-x64/lib/node_modules/@ionic/cli) Ionic Framework : @ionic/react 8.2.7

Capacitor:

Capacitor CLI : 6.1.2 @capacitor/android : 6.1.2 @capacitor/core : 6.1.2 @capacitor/ios : not installed

Utility:

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

System:

NodeJS : v20.15.0 (/opt/node-v20.15.0-linux-x64/bin/node) npm : 10.8.1 OS : Linux 6.8

Additional Information

No response