Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-16 19:05:33 +01:00
Code Issues Projects Releases Packages Wiki Activity

Update web-platform-tests to revision fa41b43ac93bc2fdc2427a4378dc3754d483cdda

Browse source
This commit is contained in:
WPT Sync Bot 2019-12-10 08:24:07 +00:00
parent 03a47c803c
commit 20d165ac2c
474 changed files with 6971 additions and 1378 deletions
Download patch file Download diff file Expand all files Collapse all files

19
tests/wpt/web-platform-tests/web-animations/timing-model/animations/reverse-running-animation-ref.html
View file

@ -1,17 +1,18 @@
<!DOCTYPE html>
<title>Reference for reverse running animation</title>
<style>
#box {
background: blue;
height: 40px;
width: 40px;
transform: translateX(100px);
will-change: transform;
#notes {
position: absolute;
left: 0px;
top: 100px;
}
body {
backgrond: white;
}
</style>
<body>
<div id="box"></div>
<p>This test reverses the animation shortly after the box starts moving. If
the box doesn't move back to its original position, the test has failed.
<p id="notes">
This test reverses the animation shortly after the box starts moving. If
any blue pixels are visible the test has failed.
</p>
</body>

65
tests/wpt/web-platform-tests/web-animations/timing-model/animations/reverse-running-animation.html
View file

@ -6,36 +6,63 @@
<link rel="match" href="reverse-running-animation-ref.html">
<script src="/common/reftest-wait.js"></script>
<style>
#box, #overlay {
/* Add a border to ensure that anti-aliasing does not leak blue pixels
outside of the element's bounds. */
border: 1px solid white;
height: 40px;
position: absolute;
top: 40px;
width: 40px;
}
#box {
background: blue;
height: 40px;
width: 40px;
left: 40px;
z-index: 1;
}
#overlay {
background: white;
left: 140px;
z-index: 2;
}
#notes {
position: absolute;
left: 0px;
top: 100px;
}
body {
backgrond: white;
}
</style>
<body>
<div id="box"></div>
<p>This test reverses the animation shortly after the box starts moving. If
the box doesn't move back to its original position, the test has failed.
</p>
<div id="overlay"></div>
<p id="notes">
This test reverses the animation shortly after the box starts moving. If
any blue pixels are visible the test has failed.
</p>
</body>
<script>
onload = function() {
const elem = document.getElementById('box');
const anim = elem.animate([
{ transform: 'translateX(100px)' },
{ transform: 'translateX(100px)' },
{ transform: 'translateX(200px)' },
{ transform: 'translateX(200px)' }
], {
duration: 1000
// Double rAF to ensure that we are not bogged down during initialization
// and the compositor is ready.
requestAnimationFrame(() => {
requestAnimationFrame(() => {
const elem = document.getElementById('box');
const anim = elem.animate([
{ transform: 'translateX(100px)' },
{ transform: 'translateX(100px)' },
{ transform: 'translateX(200px)' },
{ transform: 'translateX(200px)' }
], {
duration: 1000
});
setTimeout(() => {
anim.reverse();
}, 500);
takeScreenshotDelayed(900);
});
anim.ready.then(() => {
setTimeout(() => {
anim.reverse();
}, 500);
takeScreenshotDelayed(900);
});
};
</script>

69
tests/wpt/web-platform-tests/web-animations/timing-model/animations/setting-the-current-time-of-an-animation.html
View file

@ -67,5 +67,74 @@ promise_test(async t => {
}, 'Setting the current time of a pausing animation applies a pending playback'
+ ' rate');
// The following tests verify that currentTime can be set outside of the normal
// bounds of an animation.
promise_test(async t => {
const anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
await anim.ready;
anim.currentTime = 200 * MS_PER_SEC;
assert_equals(anim.playState, 'finished');
assert_time_equals_literal(anim.currentTime, 200 * MS_PER_SEC);
}, 'Setting the current time after the end with a positive playback rate');
promise_test(async t => {
const anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
await anim.ready;
anim.currentTime = -100 * MS_PER_SEC;
assert_equals(anim.playState, 'running');
assert_time_equals_literal(anim.currentTime, -100 * MS_PER_SEC);
await waitForAnimationFrames(2);
assert_greater_than(anim.currentTime, -100 * MS_PER_SEC);
}, 'Setting a negative current time with a positive playback rate');
promise_test(async t => {
const anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
anim.updatePlaybackRate(-1);
await anim.ready;
anim.currentTime = 200 * MS_PER_SEC;
assert_equals(anim.playState, 'running');
assert_time_equals_literal(anim.currentTime, 200 * MS_PER_SEC);
await waitForAnimationFrames(2);
assert_less_than(anim.currentTime, 200 * MS_PER_SEC);
}, 'Setting the current time after the end with a negative playback rate');
promise_test(async t => {
const anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
anim.updatePlaybackRate(-1);
await anim.ready;
anim.currentTime = -100 * MS_PER_SEC;
assert_equals(anim.playState, 'finished');
assert_time_equals_literal(anim.currentTime, -100 * MS_PER_SEC);
}, 'Setting a negative current time with a negative playback rate');
promise_test(async t => {
const anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
anim.updatePlaybackRate(0);
await anim.ready;
// An animation with a playback rate of zero is never in the finished state
// even if currentTime is outside the normal range of [0, effect end].
anim.currentTime = 200 * MS_PER_SEC;
assert_equals(anim.playState, 'running');
assert_time_equals_literal(anim.currentTime, 200 * MS_PER_SEC);
await waitForAnimationFrames(2);
assert_time_equals_literal(anim.currentTime, 200 * MS_PER_SEC);
anim.currentTime = -200 * MS_PER_SEC;
assert_equals(anim.playState, 'running');
assert_time_equals_literal(anim.currentTime, -200 * MS_PER_SEC);
await waitForAnimationFrames(2);
assert_time_equals_literal(anim.currentTime, -200 * MS_PER_SEC);
}, 'Setting the current time on an animation with a zero playback rate');
</script>
</body>

49
tests/wpt/web-platform-tests/web-animations/timing-model/animations/setting-the-playback-rate-of-an-animation.html
View file

@ -57,5 +57,54 @@ promise_test(async t => {
assert_equals(animation.playbackRate, 1);
}, 'Setting the playback rate should clear any pending playback rate');
promise_test(async t => {
const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
animation.currentTime = 50 * MS_PER_SEC;
animation.pause();
await animation.ready;
animation.playbackRate = 2;
// Ensure that the animation remains paused and current time is preserved.
assert_equals(animation.playState, 'paused');
assert_time_equals_literal(animation.currentTime, 50 * MS_PER_SEC);
}, 'Setting the playback rate while paused preserves the current time and '
+ 'state');
promise_test(async t => {
const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
animation.currentTime = 150 * MS_PER_SEC;
await animation.ready;
animation.playbackRate = 2;
// Ensure that current time is preserved and does not snap to the effect end
// time.
assert_equals(animation.playState, 'finished');
assert_time_equals_literal(animation.currentTime, 150 * MS_PER_SEC);
}, 'Setting the playback rate while finished preserves the current time');
promise_test(async t => {
const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
animation.currentTime = 150 * MS_PER_SEC;
await animation.ready;
assert_equals(animation.playState, 'finished');
animation.playbackRate = -1;
// Ensure that current time does not snap to the effect end time and that the
// animation resumes playing.
assert_equals(animation.playState, 'running');
assert_time_equals_literal(animation.currentTime, 150 * MS_PER_SEC);
await waitForAnimationFrames(2);
assert_less_than(animation.currentTime, 150 * MS_PER_SEC);
}, 'Reversing the playback rate while finished restarts the animation');
promise_test(async t => {
const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
animation.currentTime = 50 * MS_PER_SEC;
await animation.ready;
animation.playbackRate = 0;
// Ensure that current time does not drift.
assert_equals(animation.playState, 'running');
await waitForAnimationFrames(2);
assert_time_equals_literal(animation.currentTime, 50 * MS_PER_SEC);
}, 'Setting a zero playback rate while running preserves the current time');
</script>
</body>

31
tests/wpt/web-platform-tests/web-animations/timing-model/animations/setting-the-start-time-of-an-animation.html
View file

@ -266,5 +266,36 @@ promise_test(async t => {
assert_time_equals_literal(parseInt(anim.currentTime.toPrecision(5), 10), 50 * MS_PER_SEC);
}, 'Setting the start time of a playing animation applies a pending playback rate');
promise_test(async t => {
const anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
await anim.ready;
assert_equals(anim.playState, 'running');
// Setting the start time updates the finished state. The hold time is not
// constrained by the effect end time.
anim.startTime = -200 * MS_PER_SEC;
assert_equals(anim.playState, 'finished');
assert_times_equal(anim.currentTime,
document.timeline.currentTime + 200 * MS_PER_SEC);
}, 'Setting the start time on a running animation updates the play state');
promise_test(async t => {
const anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
await anim.ready;
// Setting the start time updates the finished state. The hold time is not
// constrained by the normal range of the animation time.
anim.currentTime = 100 * MS_PER_SEC;
assert_equals(anim.playState, 'finished');
anim.playbackRate = -1;
assert_equals(anim.playState, 'running');
anim.startTime = -200 * MS_PER_SEC;
assert_equals(anim.playState, 'finished');
assert_times_equal(anim.currentTime,
-document.timeline.currentTime - 200 * MS_PER_SEC);
}, 'Setting the start time on a reverse running animation updates the play '
+ 'state');
</script>
</body>