keyboard_backspace wifi_off

Screen Wake Lock

Your device may not fully support this feature

This feature works in Safari on iOS but not (yet) for installed web apps.

The Screen Wake Lock API enables web apps to prevent devices from dimming or locking the screen when the app needs to keep running.

Demo

const wakeLockSwitch = document.querySelector('#wake-lock'); let wakeLock = null; const requestWakeLock = async () => { try { wakeLock = await navigator.wakeLock.request('screen'); wakeLock.addEventListener('release', () => { console.log('Wake Lock was released'); }); console.log('Wake Lock is active'); } catch(err) { console.error(\`$\{err.name\}, $\{err.message\}\`); } }; const releaseWakeLock = () => { console.log('releasing wakeLock'); wakeLock.release(); wakeLock = null; }; wakeLockSwitch.addEventListener('change', ({detail}) => { const {checked} = detail; checked ? requestWakeLock() : releaseWakeLock(); });

Documentation

Screen Wake Lock API on web.dev

Browser support

The Screen Wake Lock API is available from Chrome 84.

What PWA Can Do Today A showcase of what is possible with Progressive Web Apps today