close

[Solved] Uncaught (in promise) DOMException: play() failed because the user didn’t interact with the document first

Hello Guys, How are you all? Hope You all Are Fine. Today I am trying to play video on desktop using Chrome version 66 I get the following error Uncaught (in promise) DOMException: play() failed because the user didn’t interact with the document first in javascript. So Here I am Explain to you all the possible solutions here.

Without wasting your time, Let’s start This Article to Solve This Error.

How To Solve Uncaught (in promise) DOMException: play() failed because the user didn’t interact with the document first Error ?

  1. How To Solve Uncaught (in promise) DOMException: play() failed because the user didn't interact with the document first Error?

    To Solve Uncaught (in promise) DOMException: play() failed because the user didn't interact with the document first Error To make the autoplay on HTML 5 elements work after the chrome 66 update you just need to add the muted property to the video element. Just needs muted=”muted”

  2. Uncaught (in promise) DOMException: play() failed because the user didn't interact with the document first

    To Solve Uncaught (in promise) DOMException: play() failed because the user didn't interact with the document first Error To make the autoplay on HTML 5 elements work after the chrome 66 update you just need to add the muted property to the video element. Just needs muted=”muted”

Solution 1

To make the autoplay on HTML 5 elements work after the chrome 66 update you just need to add the muted property to the video element.

Just needs muted="muted"

<video
    title="Advertisement"
    style="background-color: rgb(0, 0, 0); position: absolute; width: 640px; height: 360px;"
    src="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4"
    autoplay="true"
    muted="muted"></video>

I believe the chrome 66 update is trying to stop tabs from creating random noise on the user’s tabs. That’s why the muted property makes the autoplay work again.

Solution 2

For me (in the Angular project) this code helped. In HTML you should add autoplay muted. In JS/TS

playVideo() {
    const media = this.videoplayer.nativeElement;
    media.muted = true; // without this line it's not working although I have "muted" in HTML
    media.play();
}

Summery

It’s all About this issue. Hope all solution helped you a lot. Comment below Your thoughts and your queries. Also, Comment below which solution worked for you? Thank You.

Also, Read

Leave a Comment