w3c / virtual-keyboard

VirtualKeyboard API
https://w3c.github.io/virtual-keyboard/
Other
16 stars 3 forks source link

`overlayContent=false` is misleading in fullscreen mode -- potential solution: `boundingRect` should be available regardless of `overlayContent` value? #22

Open josephrocca opened 7 months ago

josephrocca commented 7 months ago

In fullscreen mode on mobile (in Chrome and Firefox), the keyboard is always overlayed on the content. I'm guessing this is expected behavior, but this leads to a strange situation with respect to the Virtual Keyboard API:

Since boundingRect is (strangely?) only available when overlayContent==true, I'm unable to adapt my content to prevent the keyboard obstructing content (like the textarea being typed into) when in fullscreen.

So it seems that I'd need to do something like this:

document.addEventListener("fullscreenchange", function() {
  if(document.fullscreenElement) {
    navigator.virtualKeyboard.overlayContent = true; // switch to overlay mode to match "reality" when in fullscreen - this makes boundingRect available which is needed to adapt content
  } else {
    navigator.virtualKeyboard.overlayContent = false; // change it back when leaving fullscreen
  }
});

A simple fix for this would be to expose boundingRect when overlayContent is false too (whereas currently all properties of boundingRect are 0), since I'm guessing it's not possible to change the default "overlay" behavior of the virtual keyboard in fullscreen mode.