[Bug]: When changing [type] of <input> @capacitor/keyboard doesn't recalculate height of keyboard

[bezegora]

Bug Report

Plugin(s)

@capacitor/keyboard: 6.0.3

Capacitor Version

Latest Dependencies:

@capacitor/cli: 6.2.0
@capacitor/core: 6.2.0
@capacitor/android: 6.2.0
@capacitor/ios: 6.2.0

Installed Dependencies:

@capacitor/ios: not installed
@capacitor/cli: 6.1.1
@capacitor/core: 6.1.1
@capacitor/android: 6.1.1

Platform(s)

Android

Current Behavior

When i change [type] of <input> element to 'tel', while the keyboard is showing, the google keyboard changes its type to numeric but plugin doesn't recalculate its height and doesn't emit events keyboardWillShow and keyboardDidShow, so there is black or white (depending on system settings) bar above it

Expected Behavior

In previous versions (4.x.x) it will emit both events keyboardWillShow and keyboardDidShow, when [type] is changed and keyboard is open, and the height is recalculated - black/white bar is not showing

Code Reproduction

https://github.com/bezegora/bar-above-keyboard

Other Technical Details

reproduces on android emulator with API 33

Additional Context

When debugging i found that it just doesnt recalculate hight when type of keyboard changes

[MarcosBertolotti]

I'm experiencing the same issue on a real device running Android 14, with edge-to-edge mode enabled programmatically.
If I disable edge-to-edge mode or change adjustMarginsForEdgeToEdge to 'disabled', then the issue is solved, but I need to keep edge-to-edge mode and adjustMarginsForEdgeToEdge enabled.
I suspect that bar is the navigation bar margin at the bottom of the device.

Plugin(s)

@capacitor/keyboard: 7.0.1

Capacitor Version

Installed Dependencies:
@capacitor/cli: 7.2.0
@capacitor/core: 7.2.0
@capacitor/android: 7.2.0
@capacitor/ios: 7.2.0

capacitor.config.json

{
	"appName": "xxx",
	"appId": "xxx",
	"webDir": "dist/xxx",
	"ios": {
		"contentInset": "always"
	},
	"android": {
		"adjustMarginsForEdgeToEdge": "force",
		"flavor": "local"
	},
	"plugins": {
		"Keyboard": {
			"resizeOnFullScreen": true
		}
	}
}

[alexgerardojacinto]

Hi there!

@bezegora and @MarcosBertolotti could either of you provide a video recording of the issue happening so we can better understand? I was trying to replicate it in one of our sample apps but so far I wasn't able to.

[MarcosBertolotti]

Hi @alexgerardojacinto, thanks for responding.

2025-04-17.18-58-44.mp4

I've created a project where my keyboard issue can be replicated. I also noticed that if I uninstall the @capacitor/status-bar plugin, the height of the status bar doubles.
https://github.com/Bertolottim98/capacitor-keyboard-issue

[bezegora]

Hi @alexgerardojacinto,

Here is a video recording from an emulator (API 35):

Screen_recording_20250419_114246.webm

This is an example from my Code Reproduction repository. Basically, 3 seconds after clicking on the input, its type changes from "text" to "tel". As you can see, on the second attempt, the height of the keyboard does not recalculate, resulting in a white bar that can block the input.

This issue can be reproduced in my repository. Please take a look and let me know if you need more details.

[sduenasg]

when using gboard on android and open the emoji keyboard from it, the keyboard layout changes to a quite bigger keyboard, and the app does not readjust... I haven't found a way to fix it other than leaving a huge gap to account for this, which is not an ideal solution at all.