Update web-platform-tests to revision b'2703c75d5e889bb7c6a918de44841bf9de8d63a7'

2025-08-08 15:05:35 +01:00 · 2023-03-25 01:51:50 +00:00 · 2023-03-25 01:51:50 +00:00 · 7bf23c63b3
commit 7bf23c63b3
parent d8e886a792
338 changed files with 9438 additions and 933 deletions
--- a/tests/wpt/web-platform-tests/css/css-animations/animation-canceled-by-parent-details-element-being-closed.html
+++ b/tests/wpt/web-platform-tests/css/css-animations/animation-canceled-by-parent-details-element-being-closed.html
@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Animations: animation should be canceled when a parent details element is closed</title>
+<link rel="help" href="https://drafts.csswg.org/css-animations/">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="support/testcommon.js"></script>
+<style>
+
+@keyframes anim {
+    to { margin-left: 100px }
+}
+
+</style>
+<div id="log"></div>
+<script>
+
+promise_test(async t => {
+  // create a <div> contained within a <details> element
+  const details = addElement(t, "details", { "open": "open" });
+  const div = addDiv(t);
+  details.appendChild(div);
+
+  // start an animation on the <div>
+  div.style.animation = 'anim 1s';
+  const animation = div.getAnimations()[0];
+  await animation.ready;
+
+  // ensure the animation running on the <div> is canceled as a result of closing the <details>
+  const canceled = new Promise(resolve => animation.addEventListener("cancel", resolve));
+  details.removeAttribute("open");
+  await canceled;
+}, 'A CSS Animation running on an element within a <details> element is canceled after the <details> element is closed.');
+
+</script>
--- a/tests/wpt/web-platform-tests/css/css-animations/display-interpolation.html
+++ b/tests/wpt/web-platform-tests/css/css-animations/display-interpolation.html
@ -0,0 +1,77 @@
+<!DOCTYPE html>
+<link rel=author href="mailto:jarhar@chromium.org">
+<link rel=help href="https://github.com/w3c/csswg-drafts/issues/6429">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/css/support/interpolation-testcommon.js"></script>
+
+<body>
+<script>
+const alwaysBlock = [
+  {at: -1, expect: 'block'},
+  {at: 0, expect: 'block'},
+  {at: 0.1, expect: 'block'},
+  {at: 0.9, expect: 'block'},
+  {at: 1, expect: 'block'},
+  {at: 1.5, expect: 'block'},
+];
+const alwaysNone = [
+  {at: -1, expect: 'none'},
+  {at: 0, expect: 'none'},
+  {at: 0.1, expect: 'none'},
+  {at: 0.9, expect: 'none'},
+  {at: 1, expect: 'none'},
+  {at: 1.5, expect: 'none'},
+];
+
+test_interpolation({
+  property: 'display',
+  from: 'block',
+  to: 'none',
+  // transition:all is not supposed to allow display to be transitioned.
+  'CSS Transitions with transition: all': alwaysNone
+}, [
+  {at: -1, expect: 'block'},
+  {at: 0, expect: 'block'},
+  {at: 0.1, expect: 'block'},
+  {at: 0.9, expect: 'block'},
+  {at: 1, expect: 'none'},
+  {at: 1.5, expect: 'none'},
+]);
+
+// This transitions tests expect 'block' at every point because transitioning
+// from display:none does not provide an initial style. This is expected and
+// can be worked around by using @initial.
+test_interpolation({
+  property: 'display',
+  from: 'none',
+  to: 'block',
+  'CSS Transitions with transition: all': alwaysBlock,
+  'CSS Transitions': alwaysBlock
+}, [
+  {at: -1, expect: 'none'},
+  {at: 0, expect: 'none'},
+  {at: 0.1, expect: 'block'},
+  {at: 0.9, expect: 'block'},
+  {at: 1, expect: 'block'},
+  {at: 1.5, expect: 'block'},
+]);
+
+test_no_interpolation({
+  property: 'display',
+  from: 'inline',
+  to: 'block'
+});
+
+test_interpolation({
+  property: 'display',
+  from: 'block',
+  to: 'block'
+}, alwaysBlock);
+
+test_interpolation({
+  property: 'display',
+  from: 'none',
+  to: 'none'
+}, alwaysNone);
+</script>
--- a/tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-end-computed.html
+++ b/tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-end-computed.html
@ -5,11 +5,12 @@
 <script src="/css/support/computed-testcommon.js"></script>
 <div id="target" style="font-size:10px;"></div>
 <script>
-test_computed_value("animation-range-end", "initial", "auto");
-test_computed_value("animation-range-end", "auto");
+test_computed_value("animation-range-end", "initial", "normal");
+test_computed_value("animation-range-end", "normal");
 test_computed_value("animation-range-end", "cover 0%");
+test_computed_value("animation-range-end", "cover 100%", "cover");
 test_computed_value("animation-range-end", "COVER 0%", "cover 0%");
-test_computed_value("animation-range-end", "cover 100%");
+test_computed_value("animation-range-end", "COVER 100%", "cover");
 test_computed_value("animation-range-end", "cover 120%");
 test_computed_value("animation-range-end", "cover 42%");
 test_computed_value("animation-range-end", "cover -42%");
@ -17,11 +18,16 @@ test_computed_value("animation-range-end", "contain 42%");
 test_computed_value("animation-range-end", "exit 42%");
 test_computed_value("animation-range-end", "exit calc(41% + 1%)", "exit 42%");
 test_computed_value("animation-range-end", "exit-crossing 42%");
-test_computed_value("animation-range-end", "exit 1%, cover 2%, contain 100%");
+test_computed_value("animation-range-end", "exit 1%, cover 2%, contain 0%");
+test_computed_value("animation-range-end", "exit 1%, cover 2%, contain 100%", "exit 1%, cover 2%, contain");
 test_computed_value("animation-range-end", "entry 42px");
 test_computed_value("animation-range-end", "entry-crossing 42px");

 test_computed_value("animation-range-end", "contain calc(10% + 10px)");
 test_computed_value("animation-range-end", "entry 1em", "entry 10px");
 test_computed_value("animation-range-end", "exit calc(1em + 10px)", "exit 20px");
+test_computed_value("animation-range-end", "cover");
+test_computed_value("animation-range-end", "contain");
+test_computed_value("animation-range-end", "entry");
+test_computed_value("animation-range-end", "exit");
 </script>
--- a/tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-end-invalid.html
+++ b/tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-end-invalid.html
@ -20,8 +20,4 @@ test_invalid_value("animation-range-end", "50% exit");
 test_invalid_value("animation-range-end", "contain contain");
 test_invalid_value("animation-range-end", "none");
 test_invalid_value("animation-range-end", "cover 50% enter 50%");
-test_invalid_value("animation-range-end", "cover");
-test_invalid_value("animation-range-end", "contain");
-test_invalid_value("animation-range-end", "enter");
-test_invalid_value("animation-range-end", "exit");
 </script>
--- a/tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-end-valid.html
+++ b/tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-end-valid.html
@ -5,15 +5,16 @@
 <script src="/css/support/parsing-testcommon.js"></script>
 <script>
 // https://drafts.csswg.org/scroll-animations-1/#view-timelines-ranges
-test_valid_value("animation-range-end", "auto");
+test_valid_value("animation-range-end", "normal");
 test_valid_value("animation-range-end", "cover 0%");
-test_valid_value("animation-range-end", "cover 100%");
+test_valid_value("animation-range-end", "cover 100%", "cover");
 test_valid_value("animation-range-end", "cover 120%");
 test_valid_value("animation-range-end", "cover 42%");
 test_valid_value("animation-range-end", "cover -42%");
 test_valid_value("animation-range-end", "contain 42%");
 test_valid_value("animation-range-end", "exit 42%");
-test_valid_value("animation-range-end", "exit 1%, cover 2%, contain 100%");
+test_valid_value("animation-range-end", "exit 1%, cover 2%, contain 0%");
+test_valid_value("animation-range-end", "exit 1%, cover 2%, contain 100%", "exit 1%, cover 2%, contain");
 test_valid_value("animation-range-end", "exit-crossing 42%");
 test_valid_value("animation-range-end", "entry 42px");
 test_valid_value("animation-range-end", "entry-crossing 42px");
@ -21,4 +22,8 @@ test_valid_value("animation-range-end", "contain calc(10px + 10%)");
 test_valid_value("animation-range-end", "entry 1em");
 test_valid_value("animation-range-end", "exit calc(1em + 10px)");
 test_valid_value("animation-range-end", "entry 42%");
+test_valid_value("animation-range-end", "cover");
+test_valid_value("animation-range-end", "contain");
+test_valid_value("animation-range-end", "entry");
+test_valid_value("animation-range-end", "exit");
 </script>
--- a/tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-shorthand.html
+++ b/tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-shorthand.html
@ -5,7 +5,11 @@
 <script src="/resources/testharnessreport.js"></script>
 <script src="/css/support/shorthand-testcommon.js"></script>
 <script src="/css/support/parsing-testcommon.js"></script>
+<script src="/css/support/computed-testcommon.js"></script>
+<div id="target" style="font-size:10px"></div>
 <script>
+test_valid_value("animation-range", "normal");
+test_valid_value("animation-range", "normal normal", "normal");
 test_valid_value("animation-range", "cover");
 test_valid_value("animation-range", "contain");
 test_valid_value("animation-range", "entry");
@ -37,6 +41,41 @@ test_valid_value("animation-range", "entry 50% exit 50%");
 test_valid_value("animation-range",
                 "cover 50% entry 50%, contain 50% exit 50%");

+test_computed_value("animation-range", "normal");
+test_computed_value("animation-range", "normal normal", "normal");
+test_computed_value("animation-range", "cover");
+test_computed_value("animation-range", "contain");
+test_computed_value("animation-range", "entry");
+test_computed_value("animation-range", "entry-crossing");
+test_computed_value("animation-range", "exit");
+test_computed_value("animation-range", "exit-crossing");
+test_computed_value("animation-range", "entry, exit");
+
+test_computed_value("animation-range", "entry 0% entry 100%", "entry");
+test_computed_value("animation-range", "entry-crossing 0% entry-crossing 100%",
+                 "entry-crossing");
+test_computed_value("animation-range", "exit 0% exit 100%", "exit");
+test_computed_value("animation-range", "exit-crossing 0% exit-crossing 100%",
+                 "exit-crossing");
+test_computed_value("animation-range", "cover 0% cover 100%", "cover");
+test_computed_value("animation-range", "contain 0% contain 100%", "contain");
+test_computed_value("animation-range",
+                 "entry calc(10% - 10%) entry calc(50% + 50%)", "entry");
+test_computed_value("animation-range", "cover 50%");
+test_computed_value("animation-range", "contain 50%");
+test_computed_value("animation-range", "entry 50%");
+test_computed_value("animation-range", "entry-crossing 50%");
+test_computed_value("animation-range", "exit 50%");
+test_computed_value("animation-range", "exit-crossing 50%");
+test_computed_value("animation-range", "entry 50px exit 100px");
+test_computed_value("animation-range", "exit calc(10% + 50px)");
+
+test_computed_value("animation-range", "entry 50% exit 50%");
+test_computed_value("animation-range",
+                 "cover 50% entry 50%, contain 50% exit 50%");
+
+test_computed_value("animation-range", "entry 10em exit 20em", "entry 100px exit 200px");
+
 test_invalid_value("animation-range", "entry 50% 0s", "entry 50%");
 test_invalid_value("animation-range", "0s entry 50%");
 test_invalid_value("animation-range", "1s");
@ -59,14 +98,39 @@ test_invalid_value("animation-range", "thing 100%");
 test_invalid_value("animation-range", "thing 100px");
 test_invalid_value("animation-range", "100% thing");

+test_shorthand_value('animation-range', 'normal', {
+  'animation-range-start': 'normal',
+  'animation-range-end': 'normal',
+});
+
+test_shorthand_value('animation-range', 'normal normal', {
+  'animation-range-start': 'normal',
+  'animation-range-end': 'normal',
+});
+
+test_shorthand_value('animation-range', 'normal entry 100%', {
+  'animation-range-start': 'normal',
+  'animation-range-end': 'entry',
+});
+
+test_shorthand_value('animation-range', 'normal entry 10%', {
+  'animation-range-start': 'normal',
+  'animation-range-end': 'entry 10%',
+});
+
 test_shorthand_value('animation-range', 'cover', {
-  'animation-range-start': 'cover 0%',
-  'animation-range-end': 'cover 100%',
+  'animation-range-start': 'cover',
+  'animation-range-end': 'cover',
 });

 test_shorthand_value('animation-range', 'contain', {
-  'animation-range-start': 'contain 0%',
-  'animation-range-end': 'contain 100%',
+  'animation-range-start': 'contain',
+  'animation-range-end': 'contain',
+});
+
+test_shorthand_value('animation-range', 'contain 100% contain 0%', {
+  'animation-range-start': 'contain 100%',
+  'animation-range-end': 'contain 0%',
 });

 test_shorthand_value('animation-range', 'entry 10% exit 20%', {
@ -80,12 +144,17 @@ test_shorthand_value('animation-range', 'entry calc(10% + 10px) exit 20px', {
 });

 test_shorthand_value('animation-range', 'entry, exit', {
-  'animation-range-start': 'entry 0%, exit 0%',
-  'animation-range-end': 'entry 100%, exit 100%',
+  'animation-range-start': 'entry, exit',
+  'animation-range-end': 'entry, exit',
 });

 test_shorthand_value('animation-range', 'entry 0%, exit', {
-  'animation-range-start': 'entry 0%, exit 0%',
-  'animation-range-end': 'auto, exit 100%',
+  'animation-range-start': 'entry, exit',
+  'animation-range-end': 'entry, exit',
+});
+
+test_shorthand_value('animation-range', 'exit calc(10% + 50px)', {
+  'animation-range-start': 'exit calc(10% + 50px)',
+  'animation-range-end': 'exit',
 });
 </script>
--- a/tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-start-computed.html
+++ b/tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-start-computed.html
@ -5,17 +5,19 @@
 <script src="/css/support/computed-testcommon.js"></script>
 <div id="target" style="font-size:10px;"></div>
 <script>
-test_computed_value("animation-range-start", "initial", "auto");
-test_computed_value("animation-range-start", "auto");
-test_computed_value("animation-range-start", "cover 0%");
-test_computed_value("animation-range-start", "COVER 0%", "cover 0%");
+test_computed_value("animation-range-start", "initial", "normal");
+test_computed_value("animation-range-start", "normal");
+test_computed_value("animation-range-start", "cover 0%", "cover");
 test_computed_value("animation-range-start", "cover 100%");
+test_computed_value("animation-range-start", "COVER 0%", "cover");
+test_computed_value("animation-range-start", "COVER 100%", "cover 100%");
 test_computed_value("animation-range-start", "cover 120%");
 test_computed_value("animation-range-start", "cover 42%");
 test_computed_value("animation-range-start", "cover -42%");
 test_computed_value("animation-range-start", "contain 42%");
 test_computed_value("animation-range-start", "exit 42%");
 test_computed_value("animation-range-start", "exit calc(41% + 1%)", "exit 42%");
+test_computed_value("animation-range-start", "exit 1%, cover 2%, contain 0%", "exit 1%, cover 2%, contain");
 test_computed_value("animation-range-start", "exit 1%, cover 2%, contain 100%");
 test_computed_value("animation-range-start", "exit-crossing 42%");
 test_computed_value("animation-range-start", "entry 42px");
@ -23,4 +25,8 @@ test_computed_value("animation-range-start", "entry-crossing 42px");
 test_computed_value("animation-range-start", "contain calc(10% + 10px)");
 test_computed_value("animation-range-start", "entry 1em", "entry 10px");
 test_computed_value("animation-range-start", "exit calc(1em + 10px)", "exit 20px");
+test_computed_value("animation-range-start", "cover");
+test_computed_value("animation-range-start", "contain");
+test_computed_value("animation-range-start", "entry");
+test_computed_value("animation-range-start", "exit");
 </script>
--- a/tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-start-invalid.html
+++ b/tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-start-invalid.html
@ -13,8 +13,4 @@ test_invalid_value("animation-range-start", "50% exit");
 test_invalid_value("animation-range-start", "contain contain");
 test_invalid_value("animation-range-start", "none");
 test_invalid_value("animation-range-start", "cover 50% enter 50%");
-test_invalid_value("animation-range-start", "cover");
-test_invalid_value("animation-range-start", "contain");
-test_invalid_value("animation-range-start", "enter");
-test_invalid_value("animation-range-start", "exit");
 </script>
--- a/tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-start-valid.html
+++ b/tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-start-valid.html
@ -5,14 +5,15 @@
 <script src="/css/support/parsing-testcommon.js"></script>
 <script>
 // https://drafts.csswg.org/scroll-animations-1/#view-timelines-ranges
-test_valid_value("animation-range-start", "auto");
-test_valid_value("animation-range-start", "cover 0%");
+test_valid_value("animation-range-start", "normal");
+test_valid_value("animation-range-start", "cover 0%", "cover");
 test_valid_value("animation-range-start", "cover 100%");
 test_valid_value("animation-range-start", "cover 120%");
 test_valid_value("animation-range-start", "cover 42%");
 test_valid_value("animation-range-start", "cover -42%");
 test_valid_value("animation-range-start", "contain 42%");
 test_valid_value("animation-range-start", "exit 42%");
+test_valid_value("animation-range-start", "exit 1%, cover 2%, contain 0%", "exit 1%, cover 2%, contain");
 test_valid_value("animation-range-start", "exit 1%, cover 2%, contain 100%");
 test_valid_value("animation-range-start", "exit-crossing 42%");
 test_valid_value("animation-range-start", "entry 42px");
@ -21,4 +22,8 @@ test_valid_value("animation-range-start", "contain calc(10px + 10%)");
 test_valid_value("animation-range-start", "entry 1em");
 test_valid_value("animation-range-start", "exit calc(1em + 10px)");
 test_valid_value("animation-range-start", "entry 42%");
+test_valid_value("animation-range-start", "cover");
+test_valid_value("animation-range-start", "contain");
+test_valid_value("animation-range-start", "entry");
+test_valid_value("animation-range-start", "exit");
 </script>
--- a/tests/wpt/web-platform-tests/css/css-animations/transition-properties-not-animatable.html
+++ b/tests/wpt/web-platform-tests/css/css-animations/transition-properties-not-animatable.html
@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<link rel=author href="mailto:jarhar@chromium.org">
+<link rel="help" href="https://www.w3.org/TR/css-transitions-1/#transition-duration-property">
+<link rel="help" href="https://www.w3.org/TR/css-transitions-1/#transition-delay-property">
+<link rel="help" href="https://www.w3.org/TR/css-transitions-1/#transition-property-property">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/css/support/interpolation-testcommon.js"></script>
+
+<body>
+<script>
+test_not_animatable({
+  property: 'transition-duration',
+  from: '1s',
+  to: '2s',
+  underlying: '0s',
+});
+
+test_not_animatable({
+  property: 'transition-delay',
+  from: '1s',
+  to: '2s',
+  underlying: '0s',
+});
+
+test_not_animatable({
+  property: 'transition-property',
+  from: 'color',
+  to: 'background-color',
+  underlying: 'all',
+});
+</script>