mirror of
https://github.com/servo/servo.git
synced 2025-08-06 14:10:11 +01:00
Update web-platform-tests to revision 82b73b315ce7ed1554e7a9b7bced66a5831e4ee5
This commit is contained in:
WPT Sync Bot
parent
00a9f30773
commit
76712d7d25
353 changed files with 6528 additions and 1307 deletions
|
|
@ -111,9 +111,10 @@ promise_test(async t => {
|
|||
|
||||
// The transition needs to have a non-zero currentTime for the interruption
|
||||
// reversal logic to apply.
|
||||
await singleFrame();
|
||||
while (getComputedStyle(div).left == '0px') {
|
||||
await singleFrame();
|
||||
}
|
||||
assert_not_equals(transition.currentTime, 0);
|
||||
assert_not_equals(getComputedStyle(div).left, '0px');
|
||||
|
||||
// Without yielding to the rendering loop, set the current transition's
|
||||
// effect to null and interrupt the transition. This should work correctly.
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@ promise_test(async t => {
|
|||
assert_equals(animations[0].startTime, animations[1].startTime,
|
||||
'CSS transitions started together have the same start time');
|
||||
|
||||
await waitForFrame();
|
||||
await waitForAnimationFrames(1);
|
||||
|
||||
div.style.backgroundColor = 'green';
|
||||
|
||||
|
|
|
|||
|
|
@ -59,7 +59,7 @@
|
|||
// tests = filterPropertyTests(tests, /^background-color/);
|
||||
|
||||
// general transition-duration
|
||||
var duration = '0.5s';
|
||||
var duration = '2s';
|
||||
|
||||
runParallelAsyncHarness({
|
||||
// array of test data
|
||||
|
|
|
|||
|
|
@ -61,7 +61,7 @@
|
|||
// tests = filterPropertyTests(tests, /^background-color/);
|
||||
|
||||
// general transition-duration
|
||||
var duration = '0.5s';
|
||||
var duration = '2s';
|
||||
|
||||
runParallelAsyncHarness({
|
||||
// array of test data
|
||||
|
|
|
|||
|
|
@ -63,7 +63,7 @@
|
|||
// tests = filterPropertyTests(tests, /^background-color/);
|
||||
|
||||
// general transition-duration
|
||||
var duration = '0.5s';
|
||||
var duration = '2s';
|
||||
|
||||
runParallelAsyncHarness({
|
||||
// array of test data
|
||||
|
|
|
|||
|
|
@ -61,7 +61,7 @@
|
|||
// tests = filterPropertyTests(tests, /^background-color/);
|
||||
|
||||
// general transition-duration
|
||||
var duration = '0.5s';
|
||||
var duration = '2s';
|
||||
|
||||
runParallelAsyncHarness({
|
||||
// array of test data
|
||||
|
|
@ -69,7 +69,7 @@
|
|||
// the number of tests to run in parallel
|
||||
testsPerSlice: 50,
|
||||
// milliseconds to wait before calling teardown and ending test
|
||||
duration: parseFloat(duration) * 1000,
|
||||
duration: parseFloat(duration) * 1200,
|
||||
// prepare individual test
|
||||
setup: function(data, options) {
|
||||
var styles = {
|
||||
|
|
|
|||
|
|
@ -62,7 +62,7 @@
|
|||
// tests = filterPropertyTests(tests, /^background-color/);
|
||||
|
||||
// general transition-duration
|
||||
var duration = '0.5s';
|
||||
var duration = '2s';
|
||||
|
||||
runParallelAsyncHarness({
|
||||
// array of test data
|
||||
|
|
|
|||
|
|
@ -62,7 +62,7 @@
|
|||
// tests = filterPropertyTests(tests, /^background-color/);
|
||||
|
||||
// general transition-duration
|
||||
var duration = '0.5s';
|
||||
var duration = '2s';
|
||||
|
||||
runParallelAsyncHarness({
|
||||
// array of test data
|
||||
|
|
|
|||
|
|
@ -63,7 +63,7 @@
|
|||
// tests = filterPropertyTests(tests, /^background-color/);
|
||||
|
||||
// general transition-duration
|
||||
var duration = '0.5s';
|
||||
var duration = '2s';
|
||||
|
||||
runParallelAsyncHarness({
|
||||
// array of test data
|
||||
|
|
|
|||
|
|
@ -62,7 +62,7 @@
|
|||
// tests = filterPropertyTests(tests, /^background-color/);
|
||||
|
||||
// general transition-duration
|
||||
var duration = '0.5s';
|
||||
var duration = '2s';
|
||||
|
||||
runParallelAsyncHarness({
|
||||
// array of test data
|
||||
|
|
|
|||
|
|
@ -84,7 +84,7 @@
|
|||
];
|
||||
|
||||
// general transition-duration
|
||||
var duration = '0.5s';
|
||||
var duration = '2s';
|
||||
|
||||
runParallelAsyncHarness({
|
||||
// array of test data
|
||||
|
|
|
|||
|
|
@ -113,8 +113,8 @@ root.runParallelAsyncHarness = function(options) {
|
|||
});
|
||||
});
|
||||
|
||||
// conclude test (possibly abort)
|
||||
setTimeout(function() {
|
||||
// conclude slice (possibly abort)
|
||||
var concludeSlice = function() {
|
||||
tests.forEach(function(data) {
|
||||
// perform individual "done" test-case
|
||||
cases.forEach(function(name) {
|
||||
|
|
@ -135,7 +135,10 @@ root.runParallelAsyncHarness = function(options) {
|
|||
|
||||
// next test please, give the browser 50ms to do catch its breath
|
||||
setTimeout(runLoop, 50);
|
||||
}, duration);
|
||||
}
|
||||
|
||||
// wait on RAF before cleanup to make sure all queued event handlers have run
|
||||
setTimeout(function() {requestAnimationFrame(concludeSlice)},duration);
|
||||
}
|
||||
|
||||
// allow DOMContentLoaded before actually doing something
|
||||
|
|
|
|||
|
|
@ -1,179 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<!-- Submitted from TestTWF Paris -->
|
||||
<head>
|
||||
<meta content="text/html;charset=ISO-8859-1" http-equiv="Content-Type">
|
||||
<title> CSS Transitions: Animatable CSS properties </title>
|
||||
<meta name="assert" content="Check that all animatable CSS properties are animatable and then accepted by the 'transition-property' property">
|
||||
<meta name="timeout" content="long">
|
||||
<link rel="author" title="Daniel Glazman" href="mailto:daniel.glazman@disruptive-innovations.com">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-transitions/#transitions">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-transitions/#animatable-properties">
|
||||
<link rel="reviewer" title="Alan Stearns" href="mailto:stearns@adobe.com">
|
||||
|
||||
<style type="text/css">
|
||||
|
||||
html, body { margin: 0px; padding: 0px; }
|
||||
|
||||
.w50vw { width: 50vw; )
|
||||
.h50vh { height: 50vh; }
|
||||
|
||||
.w50vm { width: 50vm; }
|
||||
.h50vm { height: 50vm; }
|
||||
</style>
|
||||
|
||||
<script src="/resources/testharness.js" type="text/javascript"></script>
|
||||
<script src="/resources/testharnessreport.js" type="text/javascript"></script>
|
||||
|
||||
<style type="text/css" id="newStyles"></style>
|
||||
</head>
|
||||
<body>
|
||||
<p>Check that all animatable CSS properties are animatable and
|
||||
then accepted by the 'transition-property' property.<br>
|
||||
</p>
|
||||
|
||||
<p id="testP">THIS PROSE NEEDED FOR TEST ITSELF</p>
|
||||
|
||||
<div id="log"></div><a href="transitions-animatable-properties-01.html" id="" title="transitions-animatable-properties-01">transitions-animatable-properties-01</a>
|
||||
|
||||
<script type="text/javascript">
|
||||
var kANIMATABLE_CSS_PROPERTIES = [
|
||||
["background-color", "white", "rgb(0, 128, 0)", "", false],
|
||||
["background-position", "0px 0px", "100% 100%", "", false],
|
||||
["border-color", "white", "rgb(0, 128, 0)", "", false],
|
||||
["border-bottom-color", "white", "rgb(0, 128, 0)", "", false],
|
||||
["border-bottom-width", "0px", "10px", "border-style: solid; border-color: black", false],
|
||||
["border-left-color", "white", "rgb(0, 128, 0)", "", false],
|
||||
["border-left-width", "0px", "10px", "border-style: solid; border-color: black", false],
|
||||
["border-right-color", "white", "rgb(0, 128, 0)", "", false],
|
||||
["border-right-width", "0px", "10px", "border-style: solid; border-color: black", false],
|
||||
["border-spacing", "0px", "10px 15px", "", false],
|
||||
["border-top-color", "white", "rgb(0, 128, 0)", "", false],
|
||||
["border-top-width", "0px", "10px", "border-style: solid; border-color: black", false],
|
||||
["bottom", "0px", "10px", "", false],
|
||||
["clip", "rect(0px, 0px, 10px, 10px)", "rect(10px, 10px, 20px, 20px)", "", false],
|
||||
["color", "white", "rgb(0, 128, 0)", "", false],
|
||||
["crop", "rect(0px, 0px, 10px, 10px)", "rect(10px 10px 20px 20px)", "", false],
|
||||
["font-size", "12pt", "32px", "", false],
|
||||
["font-weight", "400", "900", "", false],
|
||||
["height", "1em", "64px", "", false],
|
||||
["left", "0px", "10px", "", false],
|
||||
["letter-spacing", "1em", "64px", "", false],
|
||||
["line-height", "1em", "64px", "", false],
|
||||
["margin-bottom", "0px", "10px", "", false],
|
||||
["margin-left", "0px", "10px", "", false],
|
||||
["margin-right", "0px", "10px", "", false],
|
||||
["margin-top", "0px", "10px", "", false],
|
||||
["max-height", "0px", "10px", "", false],
|
||||
["max-width", "0px", "10px", "", false],
|
||||
["min-height", "0px", "10px", "", false],
|
||||
["min-width", "0px", "10px", "", false],
|
||||
["opacity", "0", "1", "", false],
|
||||
["outline-color", "white", "rgb(0, 128, 0)", "", false],
|
||||
["outline-offset", "0px", "10px", "", false],
|
||||
["outline-width", "0px", "10px", "outline-style: solid; outline-style: black", false],
|
||||
["padding-bottom", "0px", "10px", "", false],
|
||||
["padding-left", "0px", "10px", "", false],
|
||||
["padding-right", "0px", "10px", "", false],
|
||||
["padding-top", "0px", "10px", "", false],
|
||||
["right", "0px", "10px", "", false],
|
||||
["text-indent", "0px", "10px", "", false],
|
||||
["text-shadow", "orange 0 -2px", "rgb(0, 128, 0) 0px 2px 0px", "", false],
|
||||
["top", "0px", "10px", "", false],
|
||||
["vertical-align", "0px", "10px", "", false],
|
||||
["visibility", "visible", "hidden", "", true],
|
||||
["width", "0px", "10px", "", false],
|
||||
["word-spacing", "0px", "10px", "", false],
|
||||
["z-index", "1", "10", "", false]
|
||||
];
|
||||
|
||||
// page timeout
|
||||
var kTIMEOUT = 3000000;
|
||||
|
||||
var p = document.getElementById("testP");
|
||||
var style = document.getElementById("newStyles");
|
||||
|
||||
var testsIntermediate = [];
|
||||
var testsEnd = [];
|
||||
|
||||
setup({timeout: kTIMEOUT});
|
||||
|
||||
// create all the tests we need
|
||||
for (var i = 0; i < kANIMATABLE_CSS_PROPERTIES.length; i++) {
|
||||
testsIntermediate.push(async_test(kANIMATABLE_CSS_PROPERTIES[i][0] + " intermediate"));
|
||||
testsEnd.push(async_test(kANIMATABLE_CSS_PROPERTIES[i][0] + " end"));
|
||||
}
|
||||
|
||||
// getComputedStyle helper
|
||||
function gCS(aProperty)
|
||||
{
|
||||
return document.defaultView
|
||||
.getComputedStyle(p, "")
|
||||
.getPropertyValue(aProperty);
|
||||
}
|
||||
|
||||
function Scheduler(aIndex)
|
||||
{
|
||||
if (aIndex >= kANIMATABLE_CSS_PROPERTIES.length) // we're done here
|
||||
return;
|
||||
|
||||
var property = kANIMATABLE_CSS_PROPERTIES[aIndex][0];
|
||||
var startValue = kANIMATABLE_CSS_PROPERTIES[aIndex][1];
|
||||
var endValue = kANIMATABLE_CSS_PROPERTIES[aIndex][2];
|
||||
var extras = kANIMATABLE_CSS_PROPERTIES[aIndex][3];
|
||||
var discrete = kANIMATABLE_CSS_PROPERTIES[aIndex][4];
|
||||
|
||||
// create a style rule
|
||||
var s = "#testP { ";
|
||||
s += property + ": " + startValue + ";\n";
|
||||
s += "transition-property: " + property + ";\n";
|
||||
s += "transition-duration: 0.5s;\n";
|
||||
s += "transition-delay: 0s;\n";
|
||||
s += "transition-timing-function: linear;\n";
|
||||
s += extras;
|
||||
s += "}";
|
||||
style.textContent = s;
|
||||
|
||||
// flush styles
|
||||
gCS(property);
|
||||
|
||||
// set property to endValue
|
||||
p.setAttribute("style", property + ": " + endValue + "; ");
|
||||
|
||||
// test for intermediate value
|
||||
setTimeout(function()
|
||||
{
|
||||
testsIntermediate[aIndex].step(function()
|
||||
{
|
||||
var cs = gCS(property);
|
||||
if (discrete) {
|
||||
assert_equals(cs, startValue);
|
||||
}
|
||||
else {
|
||||
assert_true((cs != startValue) && (null != cs));
|
||||
}
|
||||
});
|
||||
testsIntermediate[aIndex].done();
|
||||
}, 250);
|
||||
|
||||
// test for final value
|
||||
setTimeout(function()
|
||||
{
|
||||
testsEnd[aIndex].step(function()
|
||||
{
|
||||
var cs = gCS(property);
|
||||
assert_equals(cs, endValue);
|
||||
}
|
||||
);
|
||||
testsEnd[aIndex].done();
|
||||
Scheduler(aIndex + 1);
|
||||
}, 600);
|
||||
|
||||
}
|
||||
|
||||
// let's start
|
||||
Scheduler(0);
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue