fix: Avoid wake lock request when document is hidden

Check document visibility before requesting a wake lock to prevent Firefox's DOMException ("The requesting document is hidden") error. The wake lock is only requested if the document is visible and released when it becomes hidden.
do0ori · Feb 18, 2025 · 7291694 · 7291694
1 parent 06c75ad
commit 7291694
Showing 1 changed file with 16 additions and 3 deletions.
diff --git a/src/hooks/useWakeLock.ts b/src/hooks/useWakeLock.ts
@@ -4,6 +4,11 @@ export const useWakeLock = (enabled = true) => {
     const wakeLockRef = useRef<WakeLockSentinel | null>(null);
 
     const requestWakeLock = async () => {
+        if (document.visibilityState !== 'visible') {
+            console.debug('Document is not visible; skipping wake lock request.');
+            return;
+        }
+
         if (!wakeLockRef.current) {
             try {
                 if ('wakeLock' in navigator) {
@@ -35,7 +40,7 @@ export const useWakeLock = (enabled = true) => {
         const manageWakeLock = async () => {
             console.debug('manageWakeLock');
             if (enabled) {
-                if (wakeLockRef.current === null) {
+                if (document.visibilityState === 'visible' && wakeLockRef.current === null) {
                     await requestWakeLock();
                 }
             } else {
@@ -46,11 +51,19 @@ export const useWakeLock = (enabled = true) => {
         const handleVisibilityChange = async () => {
             console.debug('handleVisibilityChange');
             if (document.visibilityState === 'visible' && enabled) {
-                await manageWakeLock(); // Restore Wake Lock if needed
+                await manageWakeLock();
+            } else if (document.visibilityState !== 'visible') {
+                await releaseWakeLock();
             }
         };
 
-        manageWakeLock(); // Initial setup
+        // Initial setup
+        if (document.visibilityState === 'visible') {
+            manageWakeLock();
+        } else {
+            console.debug('Document is hidden on mount. Not requesting wake lock.');
+        }
+
         document.addEventListener('visibilitychange', handleVisibilityChange);
 
         return () => {