When maximizing a Firefox window, the full-screen button disappears

[NathanLovato]

@Xananax may I let you look into this? It happens only on Firefox. When the browser window is maximized, the fullscreen toggle button disappears. It reappears as soon as it's not maximized.

Tested on Linux.

https://gdquest.github.io/learn-gdscript/staging/

[Dinock]

Maybe this is related to the bug:

When I switch to fullscreen on my external monitor the fullscreen toggle button gets pushed to the upper right corner. Screenshot:

This happens with the staging-version at 1920x1200 (16:10) on Ubuntu 21.10 with Firefox 97.0.

Edit: When I open a different tab in Firefox, press the F11-key to change to fullscreen and then switch to the already opened staging-version (in another tab), then the fullscreen toggle button also disappears. Screenshot:

[Xananax]

Explanation of the different issues:

1 - button disappearing when maximized:

The button disappears in fullscreen mode. That is because we cannot control the Browser's fullscreen, so we better bail out.

Browsers give you no way to know if they are fullscreen or not. The only way to check is through a series of hacks. One of the ideas I've had was to check for window width, and compare with document width. If they were close, within 2 pixels, I considered this "full screen". It worked well for me, but I guess it depends on your theme/browser/desktop.

I removed this. Only one hack remains now to check fullscreen status.

2 - button in the top right corner

This was expected, because the button is overlaid on top of the Godot app. The reason is that fullscreen from inside Godot was messing up, so we had to use a different method.

I now made it so the button tracks the position of the Godot game, giving the illusion of being part of the game (with some de-syncing during resizes)

3 - button disappearing if browser in fullscreen in another tab

As I said earlier, Godot cannot control browser fullscreen. They're two different modes. So if the browser goes to fullscreen, we hide the button as to not mislead the user into thinking the button can have an effect.

[NathanLovato]

Tested in Chrome, Brave, and Firefox, it's now working for me. Thanks!

[Dinock]

As I remember Xananax writing in another GitHub-issue that there is almost zero documentation about the buggy fullscreen-mode in browsers, wouldn't it make sense to reach out to the devs of Firefox and Godot to heighten their awareness of this issue? The GDQuest-App will most likely not be the last project which will encounter these kind of problems.

[Xananax]

I expressed myself in a misleading manner. It isn't "a bug"; it's "working as intended". You're not supposed to allow random sites to:

1. access parameters that is external to the page's sandbox (i.e, browser state such as fullscreen)
2. control the browser

This would be a security breach.

Therefore, it's normal that elements inside the page do not control or access the browser's fullscreen. This is the expected and wanted result. When I referred to "undocumented", I didn't mean in the official documentation; I meant the problem is uncommon, and no one (that I could find) has written an article about how to approach it.

If you go to Youtube, press F11 (which will set the entire page as fullscreen), then press the video fullscreen (which will set the browser's fullscreen), you will see they're different fullscreens that stack.

Our issue comes from the fact that the app occupies the entire span of the page, and therefore, the two fullscreen methods unintuitively stack. If our Godot app was a window in a larger page, such as a youtube video, or a game on itch.io, then there'd be no perceived issue.

There's no solution to this, but it's not a bug.

[Dinock]

Thank you very much for your in-depth explanation. I really appreciate the hard work and passion you, Nathan and the rest of the GDQuest-Team are putting into this app and course! And I am glad I backed the Kickstarter-Project so that this app can be open source and free to everyone.