Display Ionic modal inside browsers fullscreen mode

Ionic Framework
1

Hello!

I am using Ionic Angular together with @videogular/ngx-videogular - npm in order to display video in my app. The video player can be opened in fullscreen mode with the help of the browsers fullscreen API.

However, Ionic modals and Ionic toasts does not show up inside the browser fullscreen mode by default.

What do I need to do to make the modals and toasts show up inside fullscreen mode?

Cheers!

2

I have found out that I can take the HTMLIonModalElement generated via ModalController.create and insert it manually into the view but that feels like a hack.

Any other solutions out there?

3

EDIT: realized the actual question is not about the modal.

In this case, I would try to avoid showing any toasts/modals while the video is fullscreen. If you really need to show an overlay, I would suggest exiting the fullscreen video using the document.exitFullscreen() method.