Detect fullscreen mode with JavaScript

window.addEventListener('resize', (evt) => { 
    if (window.innerHeight == screen.height) {
        console.log('FULL SCREEN');
    } else {
        console.log('NORMAL SCREEN');
    }
});

Even if there is a fullscreen API in all modern desktop browsers to handle fullscreen mode, unfortunately, it is not always giving correct results. If the user uses the keyboard shortcut F11 then the fullscreenchange event is not triggered.

However, the resize event is triggered in both cases. So detecting full screen mode with window and screen sizes gives a better result.

If you only care with the cases triggered by your code then you can use the following code:

document.addEventListener('fullscreenchange', ()=>{
    if (document.fullscreenElement) {
        console.log('Fullscreen');
    } else {
        console.log('Normal');
    }
});