mirror of
https://github.com/servo/servo.git
synced 2025-06-10 01:23:13 +00:00
954b5177f0
This change also improves support for creating animations with negative delays, as that is necessary to test support for fractional iteration lengths. This change also adjusts existing Servo animation tests which assumed that advancing to the exact moment of the end of the animation would be considered "before the end." With this change, this moment is "after the end." Fixes: #14858
46 lines
1.6 KiB
HTML
46 lines
1.6 KiB
HTML
<!doctype html>
|
|
<meta charset=utf-8>
|
|
<title>CSS Animation Test: fractional animation-iteration-count</title>
|
|
<link rel="help" href="https://drafts.csswg.org/css-animations/#animation-iteration-count">
|
|
<link rel="author" title="Martin Robinson" href="mailto:mrobinson@igalia.com">
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<script src="support/testcommon.js"></script>
|
|
<style>
|
|
@keyframes margin-animation {
|
|
from {
|
|
margin-left: 0px;
|
|
}
|
|
to {
|
|
margin-left: 100px;
|
|
}
|
|
}
|
|
</style>
|
|
<div id="log"></div>
|
|
<script>
|
|
'use strict';
|
|
|
|
promise_test(async t => {
|
|
const div = addDiv(t);
|
|
div.style.animation = 'margin-animation 1s -10s linear 1.5 normal forwards paused';
|
|
assert_equals(getComputedStyle(div).marginLeft, '50px');
|
|
}, 'Basic floating point iteration count');
|
|
|
|
promise_test(async t => {
|
|
const div = addDiv(t);
|
|
div.style.animation = 'margin-animation 1s -10s linear 3.25 normal forwards paused';
|
|
assert_equals(getComputedStyle(div).marginLeft, '25px');
|
|
}, 'Floating point iteration count after multiple iterations');
|
|
|
|
promise_test(async t => {
|
|
const div = addDiv(t);
|
|
div.style.animation = 'margin-animation 1s -10s linear 0.75 normal forwards paused';
|
|
assert_equals(getComputedStyle(div).marginLeft, '75px');
|
|
}, 'Floating point iteration count during first iteration');
|
|
|
|
promise_test(async t => {
|
|
const div = addDiv(t);
|
|
div.style.animation = 'margin-animation 1s -10s linear 1.75 alternate forwards paused';
|
|
assert_equals(getComputedStyle(div).marginLeft, '25px');
|
|
}, 'Floating point iteration count with alternating directions');
|
|
</script>
|