diff options
Diffstat (limited to 'testing/web-platform/tests/scroll-animations/css/animation-duration-auto.tentative.html')
-rw-r--r-- | testing/web-platform/tests/scroll-animations/css/animation-duration-auto.tentative.html | 56 |
1 files changed, 56 insertions, 0 deletions
diff --git a/testing/web-platform/tests/scroll-animations/css/animation-duration-auto.tentative.html b/testing/web-platform/tests/scroll-animations/css/animation-duration-auto.tentative.html new file mode 100644 index 0000000000..f44a682890 --- /dev/null +++ b/testing/web-platform/tests/scroll-animations/css/animation-duration-auto.tentative.html @@ -0,0 +1,56 @@ +<!DOCTYPE html> +<title>animation-duration: auto</title> +<link rel="help" src="https://github.com/w3c/csswg-drafts/issues/6530"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/web-animations/testcommon.js"></script> +<script src="./support/testcommon.js"></script> +<script src="/css/support/parsing-testcommon.js"></script> +<script src="/css/support/computed-testcommon.js"></script> +<style> + #scroller { + overflow: hidden; + width: 100px; + height: 100px; + } + #scroller > div { + height: 200px; + width: 200px; + } + + @keyframes anim { + from { z-index: 0; } + to { z-index: 100; } + } + + #scroller { + scroll-timeline: timeline; + } + + #element { + z-index: -1; + animation-name: anim; + animation-duration: auto; + animation-timeline: timeline; + } +</style> +<main> + <div id=scroller> + <div></div> + </div> + <div id=element></div> +</main> +<script> + promise_test(async (t) => { + await waitForCSSScrollTimelineStyle(); + assert_equals(getComputedStyle(element).zIndex, '0'); + }, 'A value of auto can be specified for animation-duration'); +</script> + +<div id="target"></div> +<script> + test_valid_value('animation-duration', 'auto'); + test_computed_value('animation-duration', 'auto'); + test_valid_value('animation', 'auto cubic-bezier(0, -2, 1, 3) -3s 4 reverse both paused anim'); + test_computed_value('animation', 'auto cubic-bezier(0, -2, 1, 3) -3s 4 reverse both paused anim'); +</script> |