Auto merge of #20755 - CYBAI:unhandled-rejection, r=jdm

Implement unhandledrejection event

---
- [x] `./mach build -d` does not report any errors
- [x] `./mach test-tidy` does not report any errors
- [x] These changes fix #15412
- [x] There are tests for these changes

<!-- Reviewable:start -->
---
This change is [<img src="https://reviewable.io/review_button.svg" height="34" align="absmiddle" alt="Reviewable"/>](https://reviewable.io/reviews/servo/servo/20755)
<!-- Reviewable:end -->

tests/wpt/web-platform-tests/html/semantics/embedded-content/media-elements/event_pause_noautoplay.html

@@ -14,26 +14,28 @@
   </video>
   <div id="log"></div>
   <script>
-test(function() {
-  var t = async_test("calling play() then pause() on non-autoplay audio should trigger pause event", {timeout:5000});
+promise_test(function(t) {
+  var async_t = async_test("calling play() then pause() on non-autoplay audio should trigger pause event", {timeout:5000});
   var a = document.getElementById("a");
   a.addEventListener("pause", function() {
-    t.done();
+    async_t.done();
   }, false);
   a.src = getAudioURI("/media/sound_5") + "?" + new Date() + Math.random();
-  a.play();
+  var play_promise = a.play();
   a.pause();
+  return promise_rejects(t, "AbortError", play_promise, "pause() should reject all pending play Promises");
 }, "audio events - pause");
 
-test(function() {
-  var t = async_test("calling play() then pause() on non-autoplay video should trigger pause event", {timeout:5000});
+promise_test(function(t) {
+  var async_t = async_test("calling play() then pause() on non-autoplay video should trigger pause event", {timeout:5000});
   var v = document.getElementById("v");
   v.addEventListener("pause", function() {
-    t.done();
+    async_t.done();
   }, false);
   v.src = getVideoURI("/media/movie_5") + "?" + new Date() + Math.random();
-  v.play();
+  var play_promise = v.play()
   v.pause();
+  return promise_rejects(t, "AbortError", play_promise, "pause() should reject all pending play Promises");
 }, "video events - pause");
   </script>
  </body>

tests/wpt/web-platform-tests/html/semantics/embedded-content/media-elements/event_play_noautoplay.html

@@ -14,26 +14,26 @@
   </video>
   <div id="log"></div>
   <script>
-test(function() {
-  var t = async_test("calling play() on audio should trigger play event", {timeout:5000});
+promise_test(function(t) {
+  var async_t = async_test("calling play() on audio should trigger play event", {timeout:5000});
   var a = document.getElementById("a");
-  a.addEventListener("play", function() {
-    t.done();
+  a.addEventListener("play", async_t.step_func(function() {
     a.pause();
-  }, false);
+    async_t.done();
+  }), false);
   a.src = getAudioURI("/media/sound_5") + "?" + new Date() + Math.random();
-  a.play();
+  return promise_rejects(t, "AbortError", a.play(), "pause() should reject all pending play Promises");
 }, "audio events - play");
 
-test(function() {
-  var t = async_test("calling play() on video should trigger play event", {timeout:5000});
+promise_test(function(t) {
+  var async_t = async_test("calling play() on video should trigger play event", {timeout:5000});
   var v = document.getElementById("v");
-  v.addEventListener("play", function() {
-    t.done();
+  v.addEventListener("play", async_t.step_func(function() {
     v.pause();
-  }, false);
+    async_t.done();
+  }), false);
   v.src = getVideoURI("/media/movie_5") + "?" + new Date() + Math.random();
-  v.play();
+  return promise_rejects(t, "AbortError", v.play(), "pause() should reject all pending play Promises");
 }, "video events - play");
   </script>
  </body>

tests/wpt/web-platform-tests/html/semantics/embedded-content/media-elements/loading-the-media-resource/resource-selection-invoke-set-src-networkState.html

@@ -6,7 +6,7 @@
 <script>
 test(function(t) {
   var v = document.createElement('video');
-  v.play(); // invokes resource selection and sets .paused to false
+  v.play().catch(() => {}); // invokes resource selection and sets .paused to false
   assert_equals(v.networkState, v.NETWORK_NO_SOURCE, 'networkState');
   assert_false(v.paused, 'paused');
   v.setAttribute('src', ''); // invokes media load which sets .paused to true

tests/wpt/web-platform-tests/html/semantics/embedded-content/media-elements/paused_true_during_pause.html

@@ -21,10 +21,11 @@ test(function() {
     t.step(function() {
      assert_true(a.paused);
     });
+
     t.done();
   }, false);
   a.src = getAudioURI("/media/sound_5") + "?" + new Date() + Math.random();
-  a.play();
+  a.play().catch(() => {});
   a.pause();
 }, "audio events - paused property");
 
@@ -35,10 +36,11 @@ test(function() {
     t.step(function() {
      assert_true(v.paused);
     });
+
     t.done();
   }, false);
   v.src = getVideoURI("/media/movie_5") + "?" + new Date() + Math.random();
-  v.play();
+  v.play().catch(() => {});
   v.pause();
 }, "video events - paused property");
   </script>

tests/wpt/web-platform-tests/html/semantics/embedded-content/media-elements/playing-the-media-resource/play-in-detached-document.html

@@ -12,7 +12,8 @@ async_test(function(t)
   var v = doc.createElement("video");
   doc.body.appendChild(v);
   v.src = getVideoURI("/media/movie_5");
-  v.play();
+  v.play().catch(() => {});
+
   v.addEventListener("timeupdate", t.step_func(function() {
     assert_false(v.paused);
     if (v.currentTime > 0) {