Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

DOMException: play() failed because the user didn't interact with the document first #145

Open
MuhammadRahman-awin opened this issue Apr 20, 2022 · 4 comments

Comments

@MuhammadRahman-awin
Copy link

  • Device Name: Linux OS
  • Device Version: 20 LTS
  • Browser Name: chrome browser
  • Browser Version: Version 100.0.4896.75 (Official Build) (64-bit)
  • NoSleep.js Version: 0.12

Expected Behavior

It should run the video muted so it does not throw a js error.

Actual Behavior

It throws a Js error "DOMException: play() failed because the user didn't interact with the document first"

Code

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

How Do We Reproduce?

Use it on a blank page and check the console, please.

@MuhammadRahman-awin
Copy link
Author

The error also has this helper link, hope that will be helpful.
https://developer.chrome.com/blog/autoplay/

@MuhammadRahman-awin
Copy link
Author

and I found this from SO where it says, the fix is to make the video Muted
https://stackoverflow.com/questions/49930680/how-to-handle-uncaught-in-promise-domexception-play-failed-because-the-use

Appreciate your help.

@CorentinChauvin
Copy link

I believe I had the same issue (Firefox 108.1.0, Android 6).

Warning: Autoplay is only allowed when approved by the user, the site is activated by the user, or media is muted.
Error: Uncaught (in promise) DOMException: The play method is not allowed by the user agent or the platform in the current context, possibly because the user denied permission.

Solved it by adding this.noSleepVideo.muted = true; to have something like:

var NoSleep = function () {
  function NoSleep() {
    ...
    if (nativeWakeLock()) {
      ...
    } else if (oldIOS()) {
      this.noSleepTimer = null;
    } else {
      // Set up no sleep video element
      this.noSleepVideo = document.createElement("video");

      this.noSleepVideo.setAttribute("title", "No Sleep");
      this.noSleepVideo.setAttribute("playsinline", "");
      this.noSleepVideo.muted = true;  // <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<

      this._addSourceToVideo(this.noSleepVideo, "webm", webm);
      ...
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants