ionic-team / ionic-framework

A powerful cross-platform UI toolkit for building native-quality iOS, Android, and Progressive Web Apps with HTML, CSS, and JavaScript.
https://ionicframework.com
MIT License
50.92k stars 13.52k forks source link

bug: ion-fab hidden under keyboard on Chrome Android but shows on top of keyboard on Firefox Android #29765

Open TermoZour opened 1 month ago

TermoZour commented 1 month ago

Prerequisites

Ionic Framework Version

v8.x

Current Behavior

ion-fab is hidden under the keyboard on Chrome Android but is shown on top of keyboard on Firefox Android.

Expected Behavior

Looking at older ion-fab issues, the expected behavior is for the FAB to always be visible even if the keyboard is opened.

Steps to Reproduce

N/A

Code Reproduction URL

https://stackblitz.com/edit/q7mwhz?file=src%2Fmain.tsx

Ionic Info

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

       Require stack:
       - /usr/lib/node_modules/@ionic/cli/lib/project/index.js
       - /usr/lib/node_modules/@ionic/cli/lib/index.js
       - /usr/lib/node_modules/@ionic/cli/index.js
       - /usr/lib/node_modules/@ionic/cli/bin/ionic

Ionic:

   Ionic CLI       : 7.2.0 (/usr/lib/node_modules/@ionic/cli)
   Ionic Framework : @ionic/react 8.2.5

Capacitor:

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

Utility:

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

System:

   NodeJS : v20.16.0 (/usr/bin/node)
   npm    : 10.8.1
   OS     : Linux 6.9

Additional Information

Chrome version: 127.0.6533.103 Firefox version: 129.0 Android version: 14 Issue happens in browser as well as PWA install.

Images with the bug | Firefox | Chrome | |---|---| |![image](https://github.com/user-attachments/assets/c444f825-8878-4525-9022-944c79c20b2c) |![image](https://github.com/user-attachments/assets/927ff5bc-6858-47e2-bef0-e2532efddf72) |
dev-charles15531 commented 1 month ago

What do you mean when you say visible? You want the FAB on the keyboard??

TermoZour commented 1 month ago

On top of the keyboard, as shown in the example image from Firefox