Subscribe on changes!

useWakeLock partially broken on IOS device

avatar
Oct 19th 2023

Vue version

3.3.4

Link to minimal reproduction

https://vueuse.org/core/useWakeLock/

Steps to reproduce

I'm testing over an IPad (IOS 16.5) and as you can see the "wakeLock" feature should be supported on that version: https://developer.mozilla.org/en-US/docs/Web/API/WakeLock#browser_compatibility

You can directly test it with the demo of the composable and as you can see the feature seems to work just fine except when you leave the page and you come back (loosing and getting back the visibility).

What is expected?

The feature should be reactivated

What is actually happening?

The feature isn't reactivated and we can get the next error "NotAllowedError: Permission was denied"

System Info

No response

Any additional comments?

While looking into the "useWakeLock" composable source code I saw that:

  • The composable manually intercepts the "document visibility" event. Whay don't you use the actual "useDocumentVisibility" composable?
  • The event listener gets called correctly with no issues by itself
  • I saw that the line of code that generates the error is the one containing wakeLock.value = await navCopy.wakeLock.request("screen"); inside the onVisibilityChange function
  • Not really sure if it's related to a race condition or something handled differently from IOS. The error happens when reassigning "wakeLock" and not by just calling the "request()"
  • Same happens both with safari and chrome
avatar
Oct 19th 2023

Sorry just noticed that this is the wrong repo. Closing the issue. Link to the issue on "vueUse" repo: https://github.com/vueuse/vueuse/issues/3484