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

Update web-platform-tests to revision b'468d01bbd84da2babf265c6af46947be68713440'

Browse source
This commit is contained in:
WPT Sync Bot 2021-09-07 11:16:33 +00:00 • committed by cybai
parent 35e95f55a1
commit 58e8ee674b
9438 changed files with 266112 additions and 106976 deletions
Download patch file Download diff file Expand all files Collapse all files

11
tests/wpt/web-platform-tests/css/css-backgrounds/animations/invalidation/background-color-animation-with-zero-alpha-ref.html Normal file
View file

@ -0,0 +1,11 @@
<!DOCTYPE html>
<style>
.box {
width: 100px;
height: 100px;
background-color: rgba(100, 100, 0, 0);
}
</style>
<body>
<div class='box'></div>
</body>

24
tests/wpt/web-platform-tests/css/css-backgrounds/animations/invalidation/background-color-animation-with-zero-alpha.html Normal file
View file

@ -0,0 +1,24 @@
<!DOCTYPE html>
<link rel="help" href="https://drafts.csswg.org/css-backgrounds-3/#background-color">
<link rel="match" href="background-color-animation-with-zero-alpha-ref.html">
<style>
.container {
width: 100px;
height: 100px;
/* Use a long animation that start at 50% progress where the slope of the
selected timing function is zero. By setting up the animation in this way,
we accommodate lengthy delays in running the test without a potential drift
in the animated property value. This is important for avoiding flakes,
especially on debug builds. The screenshots are taken as soon as the
animation is ready, thus the long animation duration has no bearing on
the actual duration of the test. */
animation: bgcolor 1000000s cubic-bezier(0,1,1,0) -500000s;
}
@keyframes bgcolor {
0% { background-color: rgb(0, 200, 0, 0); }
100% { background-color: rgb(200, 0, 0, 0); }
}
</style>
<body>
<div class="container"></div>
</body>

18
tests/wpt/web-platform-tests/css/css-backgrounds/animations/invalidation/background-color-transition-obscured-ref.html Normal file
View file

@ -0,0 +1,18 @@
<!DOCTYPE html>
<style>
.parent {
width: 100px;
height: 100px;
background-color: rgb(100, 100, 0);
}
.container {
width: 100px;
height: 100px;
background-color: rgb(100, 0, 100);
}
</style>
<body>
<div class='parent'>
<div class='container'></div>
</div>
</body>

44
tests/wpt/web-platform-tests/css/css-backgrounds/animations/invalidation/background-color-transition-obscured.html Normal file
View file

@ -0,0 +1,44 @@
<!DOCTYPE html>
<html class="reftest-wait">
<link rel="help" href="https://drafts.csswg.org/css-backgrounds-3/#background-color">
<link rel="match" href="background-color-transition-obscured-ref.html">
<style>
.parent {
width: 100px;
height: 100px;
background-color: rgb(0, 200, 0);
transition: background-color 200000ms steps(2) -99999.9ms;
}
.container {
width: 100px;
height: 100px;
background-color: rgb(0, 0, 200);
transition: background-color 200000ms steps(2) -99999.9ms;
}
</style>
<script src="/common/reftest-wait.js"></script>
<body>
<div class="parent" id="pa">
<div class="container" id="target"></div>
</div>
<script>
function startTransition() {
requestAnimationFrame(() => {
document.getElementById('target').style.backgroundColor = "rgb(200, 0, 0)";
document.getElementById('pa').style.backgroundColor = "rgb(200, 0, 0)";
const animations = document.getAnimations();
Promise.all([animations[0].ready, animations[1].ready]).then(() => {
requestAnimationFrame(() => {
requestAnimationFrame(() => {
takeScreenshot();
});
});
});
});
}
requestAnimationFrame(startTransition);
</script>
</body>
</html>

10
tests/wpt/web-platform-tests/css/css-backgrounds/animations/invalidation/background-color-transition-with-delay-ref.html Normal file
View file

@ -0,0 +1,10 @@
<!DOCTYPE html>
<body>
<canvas id="canvas" width="100" height="100"></canvas>
</body>
<script>
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
ctx.fillStyle = 'rgb(100, 100, 0)';
ctx.fillRect(0, 0, 100, 100);
</script>

42
tests/wpt/web-platform-tests/css/css-backgrounds/animations/invalidation/background-color-transition-with-delay.html Normal file
View file

@ -0,0 +1,42 @@
<!DOCTYPE html>
<html class="reftest-wait">
<link rel="help" href="https://drafts.csswg.org/css-backgrounds-3/#background-color">
<link rel="match" href="background-color-transition-with-delay-ref.html">
<style>
.container {
width: 100px;
height: 100px;
background-color: rgb(0, 200, 0);
transition: background-color 200000ms steps(2) -99999.9ms;
}
</style>
<script src="/common/reftest-wait.js"></script>
<body>
<div class="container" id="target"></div>
<script>
// This test differs from "background-color-transition.html" because it runs the
// transition starting from the set background color, rather than using a
// delay to start in the middle of the transition. This tests a new codepath
// where the first frame of the transition has the original background color,
// which is why we need the transition fully running. Since we are using the
// step(2) in the animation, so it is enough to wait for two frames and the
// animation should be in its mid-point, that's the time we should take
// screenshot.
function startTransition() {
requestAnimationFrame(() => {
document.getElementById('target').style.backgroundColor = "rgb(200, 0, 0)";
document.getAnimations()[0].ready.then(() => {
requestAnimationFrame(() => {
requestAnimationFrame(() => {
takeScreenshot();
});
});
});
});
}
requestAnimationFrame(startTransition);
</script>
</body>
</html>

11
tests/wpt/web-platform-tests/css/css-backgrounds/animations/invalidation/background-color-transition-with-initially-transparent-ref.html Normal file
View file

@ -0,0 +1,11 @@
<!DOCTYPE html>
<style>
.box {
width: 100px;
height: 100px;
background-color: rgba(200, 0, 0, 0.4);
}
</style>
<body>
<div class='box'></div>
</body>

33
tests/wpt/web-platform-tests/css/css-backgrounds/animations/invalidation/background-color-transition-with-initially-transparent.html Normal file
View file

@ -0,0 +1,33 @@
<!DOCTYPE html>
<html class="reftest-wait">
<link rel="help" href="https://drafts.csswg.org/css-backgrounds-3/#background-color">
<link rel="match" href="background-color-transition-with-initially-transparent-ref.html">
<style>
.container {
width: 100px;
height: 100px;
transition: background-color 200000ms steps(2) -99999.9ms;
}
</style>
<script src="/common/reftest-wait.js"></script>
<body>
<div class="container" id="target"></div>
<script>
function startTransition() {
requestAnimationFrame(() => {
document.getElementById('target').style.backgroundColor = "rgb(200, 0, 0, 0.8)";
document.getAnimations()[0].ready.then(() => {
requestAnimationFrame(() => {
requestAnimationFrame(() => {
takeScreenshot();
});
});
});
});
}
requestAnimationFrame(startTransition);
</script>
</body>
</html>