Bug 1467344 - Update corresponding tests for CSS animations to make them consistent; r=hiro
authorBrian Birtles <birtles@gmail.com>
Thu, 16 Aug 2018 14:41:06 +0900
changeset 487369 877cdf25b483aaccf75c0ef6821194523dcce259
parent 487368 0394a44b3955e4230a79cd8226a5cd779cf068ee
child 487370 cbbc0e765e5e0d41dfbfaf647f6500da6cbecb3f
push id9719
push userffxbld-merge
push dateFri, 24 Aug 2018 17:49:46 +0000
treeherdermozilla-beta@719ec98fba77 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewershiro
bugs1467344
milestone63.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1467344 - Update corresponding tests for CSS animations to make them consistent; r=hiro This is a collection of fix-ups to the corresponding tests for CSS animations to apply the same sort of naming etc. that we have now applied to CSS transitions tests.
testing/web-platform/meta/MANIFEST.json
testing/web-platform/tests/css/css-animations/AnimationEffect-getComputedTiming.tentative.html
testing/web-platform/tests/css/css-animations/CSSAnimation-animationName.tentative.html
testing/web-platform/tests/css/css-animations/CSSAnimation-canceling.tentative.html
testing/web-platform/tests/css/css-animations/CSSAnimation-effect.tentative.html
testing/web-platform/tests/css/css-animations/CSSAnimation-finished.tentative.html
testing/web-platform/tests/css/css-animations/CSSAnimation-getComputedTiming.tentative.html
testing/web-platform/tests/css/css-animations/CSSAnimation-getCurrentTime.tentative.html
testing/web-platform/tests/css/css-animations/CSSAnimation-id.tentative.html
testing/web-platform/tests/css/css-animations/CSSAnimation-pausing.tentative.html
testing/web-platform/tests/css/css-animations/CSSAnimation-playState.tentative.html
testing/web-platform/tests/css/css-animations/CSSAnimation-ready.tentative.html
testing/web-platform/tests/css/css-animations/CSSAnimation-startTime.tentative.html
testing/web-platform/tests/css/css-animations/CSSPseudoElement-getAnimations.tentative.html
testing/web-platform/tests/css/css-animations/Document-getAnimations.tentative.html
testing/web-platform/tests/css/css-animations/Element-getAnimations-dynamic-changes.tentative.html
testing/web-platform/tests/css/css-animations/Element-getAnimations.tentative.html
testing/web-platform/tests/css/css-animations/KeyframeEffect-target.tentative.html
testing/web-platform/tests/css/css-animations/event-dispatch.tentative.html
testing/web-platform/tests/css/css-animations/event-order.tentative.html
--- a/testing/web-platform/meta/MANIFEST.json
+++ b/testing/web-platform/meta/MANIFEST.json
@@ -328005,16 +328005,22 @@
     ]
    ],
    "css/css-align/self-alignment/place-self-shorthand-006.html": [
     [
      "/css/css-align/self-alignment/place-self-shorthand-006.html",
      {}
     ]
    ],
+   "css/css-animations/AnimationEffect-getComputedTiming.tentative.html": [
+    [
+     "/css/css-animations/AnimationEffect-getComputedTiming.tentative.html",
+     {}
+    ]
+   ],
    "css/css-animations/CSSAnimation-animationName.tentative.html": [
     [
      "/css/css-animations/CSSAnimation-animationName.tentative.html",
      {}
     ]
    ],
    "css/css-animations/CSSAnimation-canceling.tentative.html": [
     [
@@ -328029,22 +328035,16 @@
     ]
    ],
    "css/css-animations/CSSAnimation-finished.tentative.html": [
     [
      "/css/css-animations/CSSAnimation-finished.tentative.html",
      {}
     ]
    ],
-   "css/css-animations/CSSAnimation-getComputedTiming.tentative.html": [
-    [
-     "/css/css-animations/CSSAnimation-getComputedTiming.tentative.html",
-     {}
-    ]
-   ],
    "css/css-animations/CSSAnimation-getCurrentTime.tentative.html": [
     [
      "/css/css-animations/CSSAnimation-getCurrentTime.tentative.html",
      {}
     ]
    ],
    "css/css-animations/CSSAnimation-id.tentative.html": [
     [
@@ -514656,82 +514656,82 @@
   "css/css-align/self-alignment/place-self-shorthand-006.html": [
    "fb5dce1b13428e5887a66b8a2a378cc540d99c47",
    "testharness"
   ],
   "css/css-align/ttwf-reftest-alignContent.html": [
    "d5737057284a603673e588a61997cf89d001cd6f",
    "visual"
   ],
+  "css/css-animations/AnimationEffect-getComputedTiming.tentative.html": [
+   "fd2197fcace453760d8ef7613139a978ab8ba0e6",
+   "testharness"
+  ],
   "css/css-animations/CSSAnimation-animationName.tentative.html": [
-   "49bd0afb4721882aaf434e4469f52a7efbef6b06",
+   "370d5ef85e27c2e83deb54522a31da9deb8b556c",
    "testharness"
   ],
   "css/css-animations/CSSAnimation-canceling.tentative.html": [
-   "a9e165417ee8ddb10d809eec3fcb13c22469e2c8",
+   "b76af2c24ac636bf3ea73050eb64555d6b0e2100",
    "testharness"
   ],
   "css/css-animations/CSSAnimation-effect.tentative.html": [
-   "6597547f8468990da2424de7bde331e361a84c5d",
+   "d288f47c60f5360161bdcc14bf2c1399654caa1a",
    "testharness"
   ],
   "css/css-animations/CSSAnimation-finished.tentative.html": [
-   "0003286de4ab6291dc5d935553569019606b38b9",
-   "testharness"
-  ],
-  "css/css-animations/CSSAnimation-getComputedTiming.tentative.html": [
-   "fb13f7abbdf5af4df4824cd0de8b7f1ff289f972",
+   "57dd0d5020c9d6a4bc30dbe9570bd3eb8cbba9ae",
    "testharness"
   ],
   "css/css-animations/CSSAnimation-getCurrentTime.tentative.html": [
-   "fbe51f6df3fae988956c92b19c278b98475a5e6d",
+   "4a0b9bdce744d9f452f4989b41025bd94931dc4b",
    "testharness"
   ],
   "css/css-animations/CSSAnimation-id.tentative.html": [
-   "79651c2d650896c2420ab7548426de07d98ee053",
+   "623e01d2354aad5dc746558dbc40821d09173472",
    "testharness"
   ],
   "css/css-animations/CSSAnimation-pausing.tentative.html": [
-   "34dd06b0da647548c10a1731049ba195be17eef3",
+   "2b6e6853b4178f90e820a16a74a5d63524123d32",
    "testharness"
   ],
   "css/css-animations/CSSAnimation-playState.tentative.html": [
-   "be95b4fc31cd41c629c15ac4e46e1184d8e4b62c",
+   "acfdc1348fb0acbcb2670cfb55cace589ac93fd4",
    "testharness"
   ],
   "css/css-animations/CSSAnimation-ready.tentative.html": [
-   "99fa0856ce370f67fef56942e8f77a9a884d9cbb",
+   "f70ebd17003988d641a7ce5645d92b1c968dac3e",
    "testharness"
   ],
   "css/css-animations/CSSAnimation-startTime.tentative.html": [
-   "9c8c57b406e11be16e79adcd4fbb96c17c545600",
+   "edef3b239e8a6c2f10b82017a448b0a2dfdd8b9d",
    "testharness"
   ],
   "css/css-animations/CSSPseudoElement-getAnimations.tentative.html": [
-   "f1257fe481fbe6d6dd6cb045e27d8d6b664dd942",
+   "8fcdf3879dc032c615a18898f701a05e10cd2b06",
    "testharness"
   ],
   "css/css-animations/Document-getAnimations.tentative.html": [
-   "1ebf4657fa011b1d92ae17cc2d18e1219197287d",
+   "c11b0a908760f4a365fb6f82e92b98341e94fb4c",
    "testharness"
   ],
   "css/css-animations/Element-getAnimations-dynamic-changes.tentative.html": [
-   "ca6a23c13b0e2552fe60506e4ca9ad5e98b91330",
+   "a5e22884271cf301c728c26eec32fe399d08f0d1",
    "testharness"
   ],
   "css/css-animations/Element-getAnimations.tentative.html": [
-   "ee80cacf15b8741c8cebbcaf46b113fcf20fa308",
+   "23f9ec8e3841535fe4c1c089c7dd6d976a14daab",
    "testharness"
   ],
   "css/css-animations/KeyframeEffect-getKeyframes.tentative.html": [
    "280f32a4852abaeb847092032fa49c9a6cb9797d",
    "testharness"
   ],
   "css/css-animations/KeyframeEffect-target.tentative.html": [
-   "cc066b4ec19fb80c93e531faba754a07a98efe73",
+   "4991762099d4fac96f56a8839651bd8368cef11c",
    "testharness"
   ],
   "css/css-animations/META.yml": [
    "3ef19970007d4bb6a889f9601bc7c910f619f841",
    "support"
   ],
   "css/css-animations/animation-common-ref.html": [
    "ddc7da67ddf5fed83e653d1130a65f5c1e3a6dec",
@@ -515033,21 +515033,21 @@
    "77f514a297bfd271abb488f086723af7ed0c9ff6",
    "testharness"
   ],
   "css/css-animations/animationstart-and-animationend-events-manual.html": [
    "4ca5eb736e76274eee9883121970fee0ab8280ca",
    "manual"
   ],
   "css/css-animations/event-dispatch.tentative.html": [
-   "6211cbff0e182dc2f9c8dd3828868d5ef6218b24",
+   "54bc9499a535dba81f302e4c40eb20193bee0da6",
    "testharness"
   ],
   "css/css-animations/event-order.tentative.html": [
-   "91d3851c015e10512b99c6b3038dc3873db1aaf5",
+   "93d452ace07163b10af18245d6799d9823448e1e",
    "testharness"
   ],
   "css/css-animations/idlharness.html": [
    "1d3ed2b9b806792c7efaeeee9ab264101dd222bc",
    "testharness"
   ],
   "css/css-animations/pending-style-changes-001.html": [
    "fb74d7fa7d062d60153d47913df9eb2b0c7267c8",
rename from testing/web-platform/tests/css/css-animations/CSSAnimation-getComputedTiming.tentative.html
rename to testing/web-platform/tests/css/css-animations/AnimationEffect-getComputedTiming.tentative.html
--- a/testing/web-platform/tests/css/css-animations/CSSAnimation-getComputedTiming.tentative.html
+++ b/testing/web-platform/tests/css/css-animations/AnimationEffect-getComputedTiming.tentative.html
@@ -1,11 +1,11 @@
 <!doctype html>
 <meta charset=utf-8>
-<title>CSSAnimation.getComputedTiming()</title>
+<title>AnimationEffect.getComputedTiming() for CSS animations</title>
 <!-- TODO: Add a more specific link for this once it is specified. -->
 <link rel="help" href="https://drafts.csswg.org/css-animations-2/#cssanimation">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="support/testcommon.js"></script>
 <style>
 @keyframes moveAnimation {
   from { margin-left: 100px }
--- a/testing/web-platform/tests/css/css-animations/CSSAnimation-animationName.tentative.html
+++ b/testing/web-platform/tests/css/css-animations/CSSAnimation-animationName.tentative.html
@@ -6,17 +6,16 @@
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="support/testcommon.js"></script>
 <style>
 @keyframes xyz {
   to { left: 100px }
 }
 </style>
-<body>
 <div id="log"></div>
 <script>
 'use strict';
 
 test(t => {
   const div = addDiv(t);
   div.style.animation = 'xyz 100s';
   assert_equals(div.getAnimations()[0].animationName, 'xyz',
@@ -34,9 +33,8 @@ test(t => {
   const div = addDiv(t);
   div.style.animation = 'x\\79 z 100s';
   assert_equals(div.getAnimations()[0].animationName, 'xyz',
                 'Hex-escaped animation name matches keyframes rule'
                 + ' name');
 }, 'Animation name with hex-escape');
 
 </script>
-</body>
--- a/testing/web-platform/tests/css/css-animations/CSSAnimation-canceling.tentative.html
+++ b/testing/web-platform/tests/css/css-animations/CSSAnimation-canceling.tentative.html
@@ -13,17 +13,16 @@
 @keyframes marginLeftAnim {
   to { margin-left: 100px }
 }
 @keyframes marginLeftAnim100To200 {
   from { margin-left: 100px }
   to { margin-left: 200px }
 }
 </style>
-<body>
 <div id="log"></div>
 <script>
 'use strict';
 
 promise_test(async t => {
   const div = addDiv(t, { style: 'animation: translateAnim 100s' });
   const animation = div.getAnimations()[0];
 
@@ -190,10 +189,8 @@ promise_test(async t => {
   await waitForFrame();
 
   assert_equals(animation.playState, 'idle');
   assert_equals(getComputedStyle(childDiv).marginLeft, '0px');
 }, 'Setting display:none on an ancestor element cancels animations on ' +
    'descendants');
 
 </script>
-</body>
-</html>
--- a/testing/web-platform/tests/css/css-animations/CSSAnimation-effect.tentative.html
+++ b/testing/web-platform/tests/css/css-animations/CSSAnimation-effect.tentative.html
@@ -11,17 +11,16 @@
   from {
     margin-left: 0px;
   }
   to {
     margin-left: 100px;
   }
 }
 </style>
-<body>
 <div id="log"></div>
 <script>
 'use strict';
 
 promise_test(async t => {
   const div = addDiv(t);
   div.style.animation = 'anim 100s';
 
@@ -124,9 +123,8 @@ promise_test(async t => {
   animation.effect = new KeyframeEffect(div,
                                         { left: [ '0px', '100px' ] },
                                         200 * MS_PER_SEC);
   await watcher.wait_for('animationstart');
 }, 'After replacing a finished animation\'s effect with a longer one ' +
    'it fires an animationstart event');
 
 </script>
-</body>
--- a/testing/web-platform/tests/css/css-animations/CSSAnimation-finished.tentative.html
+++ b/testing/web-platform/tests/css/css-animations/CSSAnimation-finished.tentative.html
@@ -7,17 +7,16 @@
 <script src="/resources/testharnessreport.js"></script>
 <script src="support/testcommon.js"></script>
 <style>
 @keyframes abc {
   to { transform: translate(10px) }
 }
 @keyframes def {}
 </style>
-<body>
 <div id="log"></div>
 <script>
 'use strict';
 
 const ANIM_PROP_VAL = 'abc 100s';
 const ANIM_DURATION = 100 * MS_PER_SEC;
 
 promise_test(async t => {
@@ -79,9 +78,8 @@ promise_test(async t => {
 
   assert_equals(animation.finished, originalFinishedPromise,
                 'The finished promise should NOT be reset');
   assert_equals(animation.currentTime, ANIM_DURATION,
                 'Sanity check: the current time should not change');
 }, 'finished promise is not reset when animationPlayState is set to running');
 
 </script>
-</body>
--- a/testing/web-platform/tests/css/css-animations/CSSAnimation-getCurrentTime.tentative.html
+++ b/testing/web-platform/tests/css/css-animations/CSSAnimation-getCurrentTime.tentative.html
@@ -1,34 +1,30 @@
 <!doctype html>
-<html>
-<head>
 <meta charset=utf-8>
 <title>CSSAnimation.currentTime</title>
 <!-- TODO: Add a more specific link for this once it is specified. -->
 <link rel="help" href="https://drafts.csswg.org/css-animations-2/#cssanimation">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="support/testcommon.js"></script>
 <style>
 
 .animated-div {
   margin-left: 10px;
   /* Make it easier to calculate expected values: */
   animation-timing-function: linear ! important;
 }
 
 @keyframes anim {
   from { margin-left: 100px; }
   to { margin-left: 200px; }
 }
 
 </style>
-<script src="/resources/testharness.js"></script>
-<script src="/resources/testharnessreport.js"></script>
-<script src="support/testcommon.js"></script>
-</head>
-<body>
 <div id="log"></div>
 <script type="text/javascript">
 
 'use strict';
 
 promise_test(async t => {
   const div = addDiv(t, { class: 'animated-div' });
   div.style.animation = 'anim 100s';
@@ -65,10 +61,8 @@ promise_test(async t => {
     () => {
       animation.currentTime = null;
     },
     'Expect TypeError exception on trying to set Animation.currentTime to null'
   );
 }, 'Setting currentTime to null on a CSS animation throws');
 
 </script>
-</body>
-</html>
--- a/testing/web-platform/tests/css/css-animations/CSSAnimation-id.tentative.html
+++ b/testing/web-platform/tests/css/css-animations/CSSAnimation-id.tentative.html
@@ -4,26 +4,24 @@
 <!-- TODO: Add a more specific link for this once it is specified. -->
 <link rel="help" href="https://drafts.csswg.org/css-animations-2/#cssanimation">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="support/testcommon.js"></script>
 <style>
 @keyframes abc { }
 </style>
-<body>
 <div id="log"></div>
 <script>
 'use strict';
 
 test(t => {
   const div = addDiv(t);
   div.style.animation = 'abc 100s';
   const animation = div.getAnimations()[0];
   assert_equals(animation.id, '', 'id for CSS Animation is initially empty');
 
   animation.id = 'anim'
   assert_equals(animation.id, 'anim', 'animation.id reflects the value set');
 }, 'Animation.id for CSS Animations');
 
 </script>
-</body>
 </html>
--- a/testing/web-platform/tests/css/css-animations/CSSAnimation-pausing.tentative.html
+++ b/testing/web-platform/tests/css/css-animations/CSSAnimation-pausing.tentative.html
@@ -7,17 +7,16 @@
 <script src="/resources/testharnessreport.js"></script>
 <script src="support/testcommon.js"></script>
 <style>
 @keyframes anim {
   0% { margin-left: 0px }
   100% { margin-left: 10000px }
 }
 </style>
-<body>
 <div id="log"></div>
 <script>
 'use strict';
 
 const getMarginLeft = cs => parseFloat(cs.marginLeft);
 
 promise_test(async t => {
   const div = addDiv(t);
@@ -164,9 +163,8 @@ promise_test(async t => {
                 'pause operation to complete');
 
   // The ready promise should now be resolved. If it's not then test will
   // probably time out before anything else happens that causes it to resolve.
   await animation.ready;
 }, 'Setting the current time completes a pending pause');
 
 </script>
-</body>
--- a/testing/web-platform/tests/css/css-animations/CSSAnimation-playState.tentative.html
+++ b/testing/web-platform/tests/css/css-animations/CSSAnimation-playState.tentative.html
@@ -4,17 +4,16 @@
 <!-- TODO: Add a more specific link for this once it is specified. -->
 <link rel="help" href="https://drafts.csswg.org/css-animations-2/#cssanimation">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="support/testcommon.js"></script>
 <style>
 @keyframes anim { }
 </style>
-<body>
 <div id="log"></div>
 <script>
 'use strict';
 
 test(t => {
   const div = addDiv(t, { 'style': 'animation: anim 100s' });
   const animation = div.getAnimations()[0];
   assert_true(animation.pending);
@@ -49,9 +48,8 @@ test(t => {
 test(t => {
   const div = addDiv(t, { 'style': 'animation: anim 1000s' });
   const animation = div.getAnimations()[0];
   animation.cancel();
   assert_equals(animation.playState, 'idle');
 }, 'Animation returns correct playState when canceled');
 
 </script>
-</body>
--- a/testing/web-platform/tests/css/css-animations/CSSAnimation-ready.tentative.html
+++ b/testing/web-platform/tests/css/css-animations/CSSAnimation-ready.tentative.html
@@ -6,17 +6,16 @@
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="support/testcommon.js"></script>
 <style>
 @keyframes abc {
   to { transform: translate(10px) }
 }
 </style>
-<body>
 <div id="log"></div>
 <script>
 'use strict';
 
 promise_test(async t => {
   const div = addDiv(t);
   div.style.animation = 'abc 100s paused';
   const animation = div.getAnimations()[0];
@@ -92,9 +91,8 @@ promise_test(async t => {
   div.style.animationPlayState = 'paused';
   const firstReadyPromise = animation.ready;
   animation.pause();
   assert_equals(animation.ready, firstReadyPromise,
                 'Ready promise objects are identical after redundant pause');
 }, 'Pausing twice re-uses the same Promise');
 
 </script>
-</body>
--- a/testing/web-platform/tests/css/css-animations/CSSAnimation-startTime.tentative.html
+++ b/testing/web-platform/tests/css/css-animations/CSSAnimation-startTime.tentative.html
@@ -1,34 +1,30 @@
 <!doctype html>
-<html>
-<head>
 <meta charset=utf-8>
 <title>CSSAnimation.startTime</title>
 <!-- TODO: Add a more specific link for this once it is specified. -->
 <link rel="help" href="https://drafts.csswg.org/css-animations-2/#cssanimation">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="support/testcommon.js"></script>
 <style>
 
 .animated-div {
   margin-left: 10px;
   /* Make it easier to calculate expected values: */
   animation-timing-function: linear ! important;
 }
 
 @keyframes anim {
   from { margin-left: 100px; }
   to { margin-left: 200px; }
 }
 
 </style>
-<script src="/resources/testharness.js"></script>
-<script src="/resources/testharnessreport.js"></script>
-<script src="support/testcommon.js"></script>
-</head>
-<body>
 <div id="log"></div>
 <script type="text/javascript">
 
 'use strict';
 
 test(t => {
   const div = addDiv(t, { 'class': 'animated-div' });
   div.style.animation = 'anim 100s 100s';
@@ -66,10 +62,8 @@ promise_test(async t => {
   animation.startTime = animation.timeline.currentTime - 100 * MS_PER_SEC;
   await eventWatcher.wait_for('animationstart');
 
   animation.startTime = animation.timeline.currentTime - 200 * MS_PER_SEC;
   await eventWatcher.wait_for('animationend');
 }, 'Seeking a CSS animation using the start time dispatches animation events');
 
 </script>
-</body>
-</html>
--- a/testing/web-platform/tests/css/css-animations/CSSPseudoElement-getAnimations.tentative.html
+++ b/testing/web-platform/tests/css/css-animations/CSSPseudoElement-getAnimations.tentative.html
@@ -21,17 +21,16 @@
   transition: all 100s;
 }
 .after-change::after {
   width: 100px;
   height: 100px;
   content: '';
 }
 </style>
-<body>
 <div id="log"></div>
 <script>
 'use strict';
 
 test(t => {
   const div = addDiv(t, { class: 'before' });
   const pseudoTarget = document.getAnimations()[0].effect.target;
   assert_equals(pseudoTarget.getAnimations().length, 1,
@@ -69,9 +68,8 @@ test(t => {
   assert_equals(anims[3].animationName, 'anim2',
                 '4rd animation is the 2nd animation in animation-name list');
   assert_equals(anims[4].id, 'scripted-anim',
                 'Animation added by script appears last');
 }, 'getAnimations returns CSS transitions/animations, and script-generated ' +
    'animations in the expected order');
 
 </script>
-</body>
--- a/testing/web-platform/tests/css/css-animations/Document-getAnimations.tentative.html
+++ b/testing/web-platform/tests/css/css-animations/Document-getAnimations.tentative.html
@@ -20,17 +20,16 @@
 }
 ::before {
   content: ''
 }
 ::after {
   content: ''
 }
 </style>
-<body>
 <div id="log"></div>
 <script>
 'use strict';
 
 test(t => {
   assert_equals(document.getAnimations().length, 0,
     'getAnimations returns an empty sequence for a document'
     + ' with no animations');
@@ -278,9 +277,8 @@ test(t => {
   assert_equals(anims[2].effect.target.type, '::after',
                 'The animation targeting the ::after element comes third');
   assert_equals(anims[3].effect.target, child,
                 'The animation targeting the child element comes last');
 }, 'CSS Animations targetting (pseudo-)elements should have correct order ' +
    'after sorting');
 
 </script>
-</body>
--- a/testing/web-platform/tests/css/css-animations/Element-getAnimations-dynamic-changes.tentative.html
+++ b/testing/web-platform/tests/css/css-animations/Element-getAnimations-dynamic-changes.tentative.html
@@ -9,17 +9,16 @@ Element.getAnimations() - Dynamic change
 <script src="/resources/testharnessreport.js"></script>
 <script src="support/testcommon.js"></script>
 <style>
 @keyframes anim1 {
   to { left: 100px }
 }
 @keyframes anim2 { }
 </style>
-<body>
 <div id="log"></div>
 <script>
 'use strict';
 
 promise_test(async t => {
   const div = addDiv(t);
   div.style.animation = 'anim1 100s';
   const originalAnimation = div.getAnimations()[0];
@@ -157,9 +156,8 @@ promise_test(async t => {
   assert_greater_than(animations[1].startTime, animations[0].startTime,
                       'Interleaved animation starts later than existing ' +
                       'animations');
   assert_greater_than(animations[0].startTime, animations[2].startTime,
                       'Original animations retain their start time');
 }, 'Animation state is preserved when interleaving animations in list');
 
 </script>
-</body>
--- a/testing/web-platform/tests/css/css-animations/Element-getAnimations.tentative.html
+++ b/testing/web-platform/tests/css/css-animations/Element-getAnimations.tentative.html
@@ -19,17 +19,16 @@
 ::before {
   content: ''
 }
 ::after {
   content: ''
 }
 @keyframes empty { }
 </style>
-<body>
 <div id="log"></div>
 <script>
 'use strict';
 
 test(t => {
   const div = addDiv(t);
   assert_equals(div.getAnimations().length, 0,
     'getAnimations returns an empty sequence for an element'
@@ -441,9 +440,8 @@ test(t => {
   assert_equals(animations[4].effect.target, child2,
                 'The animation targeting the child2 element ' +
                 'should be returned last');
 
 }, '{ subtree: true } on an element with many descendants returns animations'
    + ' from all the descendants');
 
 </script>
-</body>
--- a/testing/web-platform/tests/css/css-animations/KeyframeEffect-target.tentative.html
+++ b/testing/web-platform/tests/css/css-animations/KeyframeEffect-target.tentative.html
@@ -10,17 +10,16 @@
 @keyframes anim { }
 ::before {
   content: ''
 }
 ::after {
   content: ''
 }
 </style>
-<body>
 <div id="log"></div>
 <script>
 'use strict';
 
 test(t => {
   const div = addDiv(t);
   div.style.animation = 'anim 100s';
   const animation = div.getAnimations()[0];
@@ -57,9 +56,8 @@ test(t => {
                 'the same as the one from the argument of ' +
                 'KeyframeEffect constructor');
   assert_equals(anims[0].effect.target, newAnim.effect.target,
                 'Both animations return the same target object');
 }, 'effect.target from the script-generated animation should return the same ' +
    'CSSPseudoElement object as that from the CSS generated animation');
 
 </script>
-</body>
--- a/testing/web-platform/tests/css/css-animations/event-dispatch.tentative.html
+++ b/testing/web-platform/tests/css/css-animations/event-dispatch.tentative.html
@@ -6,17 +6,16 @@
 <script src="/resources/testharnessreport.js"></script>
 <script src="support/testcommon.js"></script>
 <style>
 @keyframes anim {
   from { margin-left: 0px; }
   to { margin-left: 100px; }
 }
 </style>
-<body>
 <div id="log"></div>
 <script>
 'use strict';
 
 const setupAnimation = (t, animationStyle) => {
   const div = addDiv(t, { style: 'animation: ' + animationStyle });
   const watcher = new EventWatcher(t, div, [ 'animationstart',
                                              'animationiteration',
@@ -414,10 +413,8 @@ promise_test(async t => {
   await watcher.wait_for('animationend');
 
   animation.cancel();
   // Then wait a couple of frames and check that no event was dispatched.
   await waitForAnimationFrames(2);
 }, 'Cancel the animation after clearing the target effect.');
 
 </script>
-</body>
-</html>
--- a/testing/web-platform/tests/css/css-animations/event-order.tentative.html
+++ b/testing/web-platform/tests/css/css-animations/event-order.tentative.html
@@ -6,17 +6,16 @@
 <script src="/resources/testharnessreport.js"></script>
 <script src="support/testcommon.js"></script>
 <style>
   @keyframes anim {
     from { margin-left: 0px; }
     to { margin-left: 100px; }
   }
 </style>
-<body>
 <div id="log"></div>
 <script type='text/javascript'>
 'use strict';
 
 /**
  * Asserts that the set of actual and received events match.
  * @param actualEvents   An array of the received AnimationEvent objects.
  * @param expectedEvents A series of array objects representing the expected
@@ -155,10 +154,8 @@ promise_test(async t => {
 
   checkEvents(events, ['animationstart', div2, 0],
                       ['animationstart', div1, 0],
                       ['animationend',   div1, 100],
                       ['animationend',   div2, 200]);
 }, 'Test start and end events are sorted correctly when fired simultaneously');
 
 </script>
-</body>
-</html>