How to set AppFullscreen at pageload?

[MusicForMellons]

How can I set AppFullscreen at pageload? I tried:

import { AppFullscreen } from 'quasar'

export default {
  mounted () {
    this.toggleFullscreen()
  },
  methods: {
    toggleFullscreen () {
      AppFullscreen.toggle()
    }
}

But does not work…

[rstoenescu]

AppFullscreen is just a wrapper over the Fullscreen API (https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API). Some platforms do not support it well (like iOS or Android on Samsung S4 are just one examples I stumbled upon). If you target those platforms, it’s better to use a Cordova plugin (example, not tested it myself: https://github.com/mesmotronic/cordova-plugin-fullscreen) for this rather than relying on the Web Fullscreen API.

[MusicForMellons]

I am a bit puzzled. I am building a webapp, not a hybrid (Cordova) app. Would the cordova plugin you mention still be of use in my case?

[rstoenescu]

AppFullscreen does not use Cordova fullscreen plugin. It uses the Web Fullscreen API, so yes you can use it for a webapp.

[MusicForMellons]

Ok…, I was referring to the Cordova Plugin you mentioned, but I think your answer implies that is not for webapps then. Thanks.

[rstoenescu]

Cordova plugins are for Cordova apps only. And Web APIs are usable in both webapps and Cordova and Electron.

[krsyoung]

@MusicForMellons curious what you ended up doing here? I’m finding that if I use mounted() or created() for AppFullscreen.request() it doesn’t work. However, if I put it into a button it does work.

[MusicForMellons]

@krsyoung Looking into things I found it really is a browser thing (i.e. you can not have the screen always open at fullscreen and need the user interaction, or you have to go nuts hacking to every version etc.). I ended up ‘working around’ the problem. So no ‘real’ solution I’m afraid.

[krsyoung]

Ok, thanks for the feedback @MusicForMellons! It is definitely pretty spotty based on the browser implementation.