mirari / vue-fullscreen

A simple Vue.js component for fullscreen
MIT License
439 stars 50 forks source link

Retain fullscreen on redirect #45

Closed jordib123 closed 2 years ago

jordib123 commented 2 years ago

Hi,

I am using vue-fullscreen for a form I created. Once a customer submits the form, he gets redirected to a new page (non vue application outside of the form). When redirecting, the browser automatically exits fullscreen. The only way I can achieve this is by going fullscreen manually by pressing F11 but the "F11 fullscreen" seems to be different from the Javascript fullscreen API.

I am pretty certain this is not a library bug or anything but rather some security feature inside the Javascript Fullscreen API. Anyone an idea on how to retain fullscreen between different pages? I am afraid this is not possible using Javascript Fullscreen API...

Regards, Jordi

mirari commented 2 years ago

Note: Navigating to another page, changing tabs, or switching to another application using any application switcher (or Alt-Tab) will likewise exit full-screen mode.

https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API

If you do want to jump to a new page, then this will force you to exit full screen.

Or you can consider wrapping the entire page in an iframe, refer to this example:

https://codepen.io/mirari/pen/VwjyKPL

Note that the codepen example itself is in an iframe, so neither of the two ways in the example will exit full screen.

jordib123 commented 2 years ago

Thanks @mirari, did not see the note in the Fullscreen API docs. I guess wrapping inside an iframe is the only option I have :(