Background changes to black when changing to fullscreen mode

[irsital]

Steps to reproduce:

• Using Chrome (Version 72.0.3626.121 (Official Build) (64-bit)) on a Mac
• Goto: https://slides.codestar.nl/
• Pick a presentation
• Press Space and let the animation play
• Press F to go in to fullscreen mode

Problem:
The screen expands to fullscreen, but also changes the background to black.

When you press Esc to exit fullscreen the background color changes back. You can't go to full screen when the animation hasn't played yet. If you press space and quickly F the presentation will go into fullscreen and the background will be normal, but at the end of the animation the screen will quickly fade to black.

[Tenchi2xh]

So weird, when you use F to go full-screen (and not Ctrl+⌘+F), Chrome adds a pseudo ::after element with a black background. It doesn't come from any reveal or showcase css, but from the browser itself ("user agent stylesheet"):

[Tenchi2xh]

Chrome wanted to do some "smart" stuff between when we first made this program and now.

Reveal.js added a fix in the latest versions, hakimel/reveal.js@5e763bc

We should just update reveal and hope nothing else breaks... or add those few lines?

[irsital]

Ah nice find! I think we should update. Seems like a nice project for R&D day :)

[irsital]

or add those few lines?

We already have those lines?

[Tenchi2xh]

The plot thickens 🤔

[Tenchi2xh]

For now, an easy workaround is to use the browser's real full-screen mode (Ctrl+⌘+F and Shift+⌘+F to hide the top bars) instead of pressing F to let reveal use the full-screen API.

It's explicitly the javascript full-screen API that adds this pseudo element somehow

(Advantage is that it also works before the animation starts)