Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-08 15:05:35 +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

29
tests/wpt/web-platform-tests/css/css-animations/keyframes-unrelated-custom-property.html Normal file
View file

@ -0,0 +1,29 @@
<!DOCTYPE html>
<title>Unrelated custom properties do not conflict with each other</title>
<link rel="help" href="https://drafts.csswg.org/css-animations/">
<link rel="help" href="https://crbug.com/1236043">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
@keyframes test {
0% { --x: green; }
100% { --x: green; }
/* This should not affect the background-color of #div: */
0% { --unused: yellow; }
}
#div {
animation: test 10s linear paused;
background-color: var(--x, red);
width: 100px;
height: 100px;
}
</style>
<div id=div></div>
<script>
test(() => {
assert_equals(getComputedStyle(div).backgroundColor, 'rgb(0, 128, 0)');
}, 'Unrelated custom properties do not conflict with each other');
</script>

4
tests/wpt/web-platform-tests/css/css-animations/nested-scale-animations-ref.html
View file

@ -1,4 +1,4 @@
<!DOCTYPE html>
<div style="width: 200px; height: 95px; background: blue"></div>
<div style="width: 100px; height: 45px; background: blue"></div>
<div style="height: 10px"></div>
<div style="width: 200px; height: 95px; background: green"></div>
<div style="width: 100px; height: 45px; background: green"></div>

31
tests/wpt/web-platform-tests/css/css-animations/nested-scale-animations.html
View file

@ -10,28 +10,33 @@
@keyframes scale {
0% {transform: scale(1);}
1% {transform: scale(10);}
100% {transform: scale(20);}
100% {transform: scale(10);}
}
.animate {
animation: scale 1s infinite;
animation: scale 1s forwards;
position: relative;
top: 45%;
left: 45%;
width: 10%;
height: 10%;
top: 40%;
left: 40%;
width: 20%;
height: 20%;
}
</style>
<div style="width: 200px; height: 200px; overflow: hidden; position: relative">
<div class="animate">
<div class="animate">
<div style="width: 2px; height: 1px; background: blue"></div>
<div style="width: 2px; height: 1px; background: green"></div>
<div style="width: 100px; height: 100px; overflow: hidden; position: relative">
<div class="animate" onanimationstart="animationStarted()">
<div class="animate" onanimationstart="animationStarted()">
<div style="width: 4px; height: 2px; background: blue"></div>
<div style="width: 4px; height: 2px; background: green"></div>
</div>
</div>
<!-- To mask off the pixels that may be blurry/antialiased while the rendering
quality is acceptable. -->
<div style="position: absolute; top: 95px; left: 0; width: 200px; height: 10px; background: white"></div>
<div style="position: absolute; top: 45px; left: 0; width: 100px; height: 10px; background: white"></div>
</div>
<script>
takeScreenshotDelayed(200);
var startedCount = 0;
function animationStarted() {
startedCount++;
if (startedCount == 2)
takeScreenshotDelayed(900);
}
</script>

19
tests/wpt/web-platform-tests/css/css-animations/simultaneous-animations-crash.html Normal file
View file

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html class="test-wait">
<title>CSS animations test: No crash should occur when an animation ends while other animations continue</title>
<link rel="author" title="Philip Rogers" href="mailto:pdr@chromium.org">
<link rel="help" href="https://crbug.com/1213307">
<style>
@keyframes animationKeyframes {
from { opacity: 0.1; filter: blur(1px); }
to { opacity: 0.9; filter: blur(5px); }
}
</style>
<div id="longerAnimEl" style="animation: animationKeyframes 64ms;">a</div>
<div id="shorterAnimEl" style="animation: both animationKeyframes 32ms;">b</div>
<script>
longerAnimEl.addEventListener('animationend', () => {
document.documentElement.classList.remove('test-wait');
});
</script>
</html>