Update web-platform-tests to revision 78eae724c61bb01d858a01a324363e997ac66851

This commit is contained in:
WPT Sync Bot 2020-04-25 08:18:23 +00:00
parent 537e575d3d
commit 55139554ba
366 changed files with 10291 additions and 2008 deletions

View file

@ -0,0 +1,36 @@
<!doctype html>
<html>
<link rel="author" title="Chris Harrelson" href="mailto:chrishtr@chromium.org">
<link rel="help" href="https://drafts.csswg.org/css-transforms-2/#propdef-backface-visibility">
<style>
#flip {
height: 100px;
width: 100px;
transform: rotateY(180deg);
transform-style: preserve-3d;
}
#back {
background: lightblue;
transform: rotateY(180deg);
position: absolute;
top: 0;
left: 0;
width: 200px;
height: 200px;
backface-visibility: hidden;
}
#posabs {
position: absolute;
bottom: 0;
right: 0;
background: yellow;
}
</style>
<div id="flip">
<div id="back">
<i id="posabs">Text</i>
</div>
</div>
</html>

View file

@ -0,0 +1,51 @@
<!doctype html>
<html class=reftest-wait>
<link rel="author" title="Chris Harrelson" href="mailto:chrishtr@chromium.org">
<link rel="help" href="https://drafts.csswg.org/css-transforms-2/#propdef-backface-visibility">
<link rel="match" href="backface-visibility-hidden-animated-ref.html">
<style>
@keyframes show-backface {
0% { transform: rotateY(60deg); }
0.01% { transform: rotateY(180deg); }
100% { transform: rotateY(180deg); }
}
.flip {
animation: 10s linear 0s infinite forwards show-backface;
height: 100px;
width: 100px;
transform: rotateY(60deg);
transform-style: preserve-3d;
}
#back {
background: lightblue;
transform: rotateY(180deg);
position: absolute;
top: 0;
left: 0;
width: 200px;
height: 200px;
backface-visibility: hidden;
}
#posabs {
position: absolute;
bottom: 0;
right: 0;
background: yellow;
}
</style>
<div id="flip">
<div id="back">
<i id="posabs">Text</i>
</div>
</div>
<script>
onload = () => requestAnimationFrame(() => requestAnimationFrame(() => {
flip.classList.add("flip");
requestAnimationFrame(() => requestAnimationFrame(() =>
document.documentElement.classList.remove("reftest-wait")));
}));
</script>
</html>

View file

@ -0,0 +1,18 @@
<!DOCTYPE html>
<title>transform-box: fill-box on an SVG container element</title>
<link rel="help" href="https://drafts.csswg.org/css-transforms/#transform-box">
<link rel="match" href="reference/greensquare200x200.html">
<style>
#container {
transform-box: fill-box;
transform-origin: center;
transform: scale(2);
}
</style>
<p>There should be a green 200x200 rectangle below, and no red.</p>
<svg width="200" height="200">
<rect width="200" height="200" fill="red"/>
<g id="container">
<rect x="50" y="50" width="100" height="100" fill="green"/>
</g>
</svg>

View file

@ -0,0 +1,28 @@
<!doctype html>
<html class="reftest-wait">
<title>CSS Transforms: 'transform' resolved percentage values in SVG after mutation</title>
<link rel="help" href="https://drafts.csswg.org/css-transforms/#transform-property">
<link rel="match" href="transform-box/reference/greensquare200x200.html">
<script src="/common/reftest-wait.js"></script>
<script src="/common/rendering-utils.js"></script>
<style>
#container {
width: 400px;
height: 200px;
}
</style>
<p>There should be a green 200x200 rectangle below, and no red.</p>
<div id="container">
<svg width="100%" height="100%">
<rect width="200" height="200" fill="red"/>
<g id="target" style="transform: translate(50%, 50%)">
<rect x="-100" y="-100" width="100%" height="100%" fill="green"/>
</g>
</svg>
</div>
<script>
waitForAtLeastOneFrame().then(() => {
document.getElementById('container').style.width = '200px';
takeScreenshot();
});
</script>