title: The mediaElement.play() method returns a promise that is rejected
body: <p>I can't play my video on mobile Browsers. When using Safari Remote Debugging, i get the following issue:</p>
  
  <p><code>Unhandled Promise Rejection: AbortError: The operation was aborted.</code></p>
  
  <p>I find this solution: <a href="https://developers.google.com/web/updates/2017/06/play-request-was-interrupted" rel="noreferrer">https://developers.google.com/web/updates/2017/06/play-request-was-interrupted</a></p>
  
  <p>But i don't know, how can i use it in my code to fix the problem.</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;video muted id="video" class="absolute right-0 bottom-0 min-w-full min-h-full w-auto" controls&gt;
      &lt;source src="/path/to/video.mp4" type="video/mp4"&gt;
  &lt;/video&gt;
  </code></pre>
  
  <pre class="lang-js prettyprint-override"><code>let video = document.getElementbyId('video');
  let video_cta = document.getElementbyId('video_cta');
  
  //this doesn't fix my problem
  var videoPromise = video.play();
  
  if (videoPromise != undefined) {
      videoPromise.then(function(_) {
        video.pause();
        video.currentTime = 0;
    });
  }
  
  //start video after click the button
  video_cta.addEventListener('click' function() {
      video.play()
  })
  </code></pre>