search

richtr / NoSleep.js

Prevent display sleep and enable wake lock in any Android or iOS web browser.
MIT License
2.22k stars 379 forks source link

Does the iOS file dialog interfere with NoSleep? #57

Open weavermedia opened 5 years ago

weavermedia commented 5 years ago

I'm trying to implement this to prevent the screen locking while my users wait for files to upload.

I can't get it to work consistently in my web app yet the demo page works perfectly on the same test device (iPhone X).

Could it be something to do with the fact that my web app is accessing the users' photos and videos after NoSleep is enabled? I'm enabling on the 'Choose File' button press then disabling when the upload is complete.

I should also maybe mention I"m using the Uploadcare widget for picking files.

Any ideas? 🤔

richtr commented 5 years ago

Hmm. There is a possibility that the switch from the browser to the file picker pauses the NoSleep process and therefore interferes with it. Typically, if you leave the browser and come back (which is effectively what happens when you upload files on iOS) then I would say that wake lock should be disabled and the current behavior is correct.

Having said that I understand that you have an issue and see a useful workaround being that once the user returns to the web browser on iOS, you could present a "Confirm upload" button with a presentation of the selected files. When the user clicks this button, the upload could be started and using that same click event you could enable NoSleep.js at the same time.

It may also be beneficial to explain to the user that they should keep their web browser open on the screen while the upload is in progress. That is important for both completing the upload process successfully and keeping the screen lock enabled for the duration of that upload.

I hope this helps a little and if there is a fix that allows us to keep screen lock enabled after a user has left the browser and comes back (e.g. picked files to upload) then please let us know.

henrydawson commented 5 years ago

I ran into this issue as well (tested on iOS 12). The FilePicker does indeed break NoSleep. I found the solution was to listen to the visibilitychange event, and then recreate the NoSleep object once the page is visible again. See the code example from this comment https://github.com/richtr/NoSleep.js/issues/61#issuecomment-448355247 .

I also implemented @richtr's suggestion to show a dialogue telling users not to switch apps or tabs during upload. In my testing iOS kills any upload immediately if you leave the tab - ironically this includes showing the File Picker dialogue for a user to add more files to the upload queue!

mnelson4 commented 3 years ago

I worked around this by instead only showing a button to disable sleeping AFTER the file upload has started. Eg "Click here to prevent your device from going to sleep during the upload." When it was clicked I did 

var nosleep = new NoSleep();
nosleep.enable();

and showed a different message saying "We are keeping your file awake during the upload." I then waited until the upload was finished to do nosleep.disable(); and remove the notice.

I found this worked and I think is probably inline with what the device manufacturers intended: only keep the device awake when the user explicitly requested it.