Clean up WPT TestExpectations for CSS animations and transitions
external/wpt/css/css-animations/Element-getAnimations.tentative.html
external/wpt/css/css-transitions/AnimationEffect-getComputedTiming.tentative.html
(turned on and baselined, code appears to have been fixed earlier)
external/wpt/css/css-transitions/CSSTransition-startTime.tentative.html
(now has same behavior reargless of when in frame the test is started)
external/wpt/css/css-transitions/properties-value-*
(fix duration to allow for CPU stress and add RAF before checking event
handlers are called, using guideline in
https://web-platform-tests.org/writing-tests/testharness-api.html#timeouts-in-tests
"Note that timeouts generally need to be a few seconds long
in order to produce stable results in all test environments.")
external/wpt/css/css-transitions/no-transition-from-ua-to-blocking-stylesheet.html
(marked flaky instead of always-fail, test sometimes passes)
REMOVE external/wpt/css/css-transitions/transitions-animatable-properties-01.html
(old and flaky duplicate of properties-value-001.html)
(serial timeouts add to close to 60s, causing harness timeout in CI)
Bug: 849975, 849927, 922970, 825262, 332189, 626703,
Change-Id: Id03994b3017ac72858dca00ee71d9b89dacbd3c6
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1748116
Reviewed-by: Majid Valipour <majidvp@chromium.org>
Commit-Queue: Majid Valipour <majidvp@chromium.org>
Auto-Submit: George Steel <gtsteel@chromium.org>
Cr-Commit-Position: refs/heads/master@{#687422}
diff --git a/css/css-transitions/CSSTransition-startTime.tentative.html b/css/css-transitions/CSSTransition-startTime.tentative.html
index b6482f8..4dbe863 100644
--- a/css/css-transitions/CSSTransition-startTime.tentative.html
+++ b/css/css-transitions/CSSTransition-startTime.tentative.html
@@ -40,7 +40,7 @@
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';
diff --git a/css/css-transitions/properties-value-001.html b/css/css-transitions/properties-value-001.html
index a4d196a..1f6d498 100644
--- a/css/css-transitions/properties-value-001.html
+++ b/css/css-transitions/properties-value-001.html
@@ -59,7 +59,7 @@
// tests = filterPropertyTests(tests, /^background-color/);
// general transition-duration
- var duration = '0.5s';
+ var duration = '2s';
runParallelAsyncHarness({
// array of test data
diff --git a/css/css-transitions/properties-value-002.html b/css/css-transitions/properties-value-002.html
index a1f9168..9c5d9af 100644
--- a/css/css-transitions/properties-value-002.html
+++ b/css/css-transitions/properties-value-002.html
@@ -61,7 +61,7 @@
// tests = filterPropertyTests(tests, /^background-color/);
// general transition-duration
- var duration = '0.5s';
+ var duration = '2s';
runParallelAsyncHarness({
// array of test data
diff --git a/css/css-transitions/properties-value-003.html b/css/css-transitions/properties-value-003.html
index 49c8dfb..4f6bbda 100644
--- a/css/css-transitions/properties-value-003.html
+++ b/css/css-transitions/properties-value-003.html
@@ -63,7 +63,7 @@
// tests = filterPropertyTests(tests, /^background-color/);
// general transition-duration
- var duration = '0.5s';
+ var duration = '2s';
runParallelAsyncHarness({
// array of test data
diff --git a/css/css-transitions/properties-value-auto-001.html b/css/css-transitions/properties-value-auto-001.html
index dd077f0..6c932aa 100644
--- a/css/css-transitions/properties-value-auto-001.html
+++ b/css/css-transitions/properties-value-auto-001.html
@@ -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 = {
diff --git a/css/css-transitions/properties-value-implicit-001.html b/css/css-transitions/properties-value-implicit-001.html
index fe76649..8500436 100644
--- a/css/css-transitions/properties-value-implicit-001.html
+++ b/css/css-transitions/properties-value-implicit-001.html
@@ -62,7 +62,7 @@
// tests = filterPropertyTests(tests, /^background-color/);
// general transition-duration
- var duration = '0.5s';
+ var duration = '2s';
runParallelAsyncHarness({
// array of test data
diff --git a/css/css-transitions/properties-value-inherit-001.html b/css/css-transitions/properties-value-inherit-001.html
index 0e91c71..abbdecd 100644
--- a/css/css-transitions/properties-value-inherit-001.html
+++ b/css/css-transitions/properties-value-inherit-001.html
@@ -62,7 +62,7 @@
// tests = filterPropertyTests(tests, /^background-color/);
// general transition-duration
- var duration = '0.5s';
+ var duration = '2s';
runParallelAsyncHarness({
// array of test data
diff --git a/css/css-transitions/properties-value-inherit-002.html b/css/css-transitions/properties-value-inherit-002.html
index 49ee314..9556cf7 100644
--- a/css/css-transitions/properties-value-inherit-002.html
+++ b/css/css-transitions/properties-value-inherit-002.html
@@ -63,7 +63,7 @@
// tests = filterPropertyTests(tests, /^background-color/);
// general transition-duration
- var duration = '0.5s';
+ var duration = '2s';
runParallelAsyncHarness({
// array of test data
diff --git a/css/css-transitions/properties-value-inherit-003.html b/css/css-transitions/properties-value-inherit-003.html
index 046ba43..13a1613 100644
--- a/css/css-transitions/properties-value-inherit-003.html
+++ b/css/css-transitions/properties-value-inherit-003.html
@@ -62,7 +62,7 @@
// tests = filterPropertyTests(tests, /^background-color/);
// general transition-duration
- var duration = '0.5s';
+ var duration = '2s';
runParallelAsyncHarness({
// array of test data
diff --git a/css/css-transitions/pseudo-elements-001.html b/css/css-transitions/pseudo-elements-001.html
index ae9db1e..146c533 100644
--- a/css/css-transitions/pseudo-elements-001.html
+++ b/css/css-transitions/pseudo-elements-001.html
@@ -84,7 +84,7 @@
];
// general transition-duration
- var duration = '0.5s';
+ var duration = '2s';
runParallelAsyncHarness({
// array of test data
diff --git a/css/css-transitions/support/runParallelAsyncHarness.js b/css/css-transitions/support/runParallelAsyncHarness.js
index fa3b09c..de9b783 100644
--- a/css/css-transitions/support/runParallelAsyncHarness.js
+++ b/css/css-transitions/support/runParallelAsyncHarness.js
@@ -113,8 +113,8 @@
});
});
- // 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 @@
// 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
diff --git a/css/css-transitions/transitions-animatable-properties-01.html b/css/css-transitions/transitions-animatable-properties-01.html
deleted file mode 100644
index 48a7d1e..0000000
--- a/css/css-transitions/transitions-animatable-properties-01.html
+++ /dev/null
@@ -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>
