Modified: trunk/LayoutTests/ChangeLog (262547 => 262548)
--- trunk/LayoutTests/ChangeLog 2020-06-04 18:06:57 UTC (rev 262547)
+++ trunk/LayoutTests/ChangeLog 2020-06-04 18:28:17 UTC (rev 262548)
@@ -1,3 +1,17 @@
+2020-06-04 Antoine Quint <[email protected]>
+
+ [ iOS wk2 ] animations/play-state-paused.html is flaky failing.
+ https://bugs.webkit.org/show_bug.cgi?id=212641
+ <rdar://problem/63879230>
+
+ Reviewed by Dean Jackson.
+
+ Rewrite this test to use the AnimationTest helper that will non-flakily check animated values while an animation is running.
+
+ * animations/play-state-paused-expected.txt:
+ * animations/play-state-paused.html:
+ * platform/ios-wk2/TestExpectations:
+
2020-06-02 Chris Dumez <[email protected]>
Resync web-platform-tests/2dcontext from upstream
Modified: trunk/LayoutTests/animations/play-state-paused-expected.txt (262547 => 262548)
--- trunk/LayoutTests/animations/play-state-paused-expected.txt 2020-06-04 18:06:57 UTC (rev 262547)
+++ trunk/LayoutTests/animations/play-state-paused-expected.txt 2020-06-04 18:28:17 UTC (rev 262548)
@@ -1,4 +1,3 @@
-PASS - "margin-left" property for "box" element at 0.5s saw something close to: 75
-PASS - "margin-left" property for "box" element at 1s saw something close to: 150
-PASS - "margin-left" property for "box" element at 2.5s saw something close to: 150
+PASS Pausing an animation using the animation-play-state property stops animating styles.
+
Modified: trunk/LayoutTests/animations/play-state-paused.html (262547 => 262548)
--- trunk/LayoutTests/animations/play-state-paused.html 2020-06-04 18:06:57 UTC (rev 262547)
+++ trunk/LayoutTests/animations/play-state-paused.html 2020-06-04 18:28:17 UTC (rev 262548)
@@ -1,9 +1,9 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
+<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
- <title>Test of -webkit-animation-play-state</title>
- <style type="text/css" media="screen">
+ <title>Test of animation-play-state</title>
+ <style>
body {
margin: 0;
}
@@ -16,57 +16,52 @@
width: 100px;
background-color: red;
margin: 0;
- -webkit-animation-duration: 2s;
- -webkit-animation-timing-function: linear;
- -webkit-animation-name: "move1";
- -webkit-animation-play-state: running;
+ animation-duration: 2s;
+ animation-timing-function: linear;
+ animation-name: move;
+ animation-play-state: running;
}
- #safezone {
- position: absolute;
- top: 100px;
- height: 100px;
- width: 200px;
- left: 100px;
- background-color: green;
- }
- @-webkit-keyframes "move1" {
+
+ @keyframes move {
from { margin-left: 0px; }
to { margin-left: 300px; }
}
- #result {
- color: white; /* hide from pixel results */
- }
</style>
- <script src="" type="text/_javascript_" charset="utf-8"></script>
- <script type="text/_javascript_" charset="utf-8">
- const expectedValues = [
- // [animation-name, time, element-id, property, expected-value, tolerance]
- ["move1", 0.5, "box", "margin-left", 75, 20],
- ["move1", 1.0, "box", "margin-left", 150, 20],
- ["move1", 2.5, "box", "margin-left", 150, 20],
- ];
+ <script src=""
+ <script src=""
+ <script src=""
+</head>
+<body>
+<div id="box"></div>
+<script>
- function pauseAnimation()
- {
- const box = document.getElementById("box");
- box.style.webkitAnimationPlayState = "paused";
- box.getAnimations()[0].currentTime = 1000;
- }
+async_test(async t => {
+ const delay = 100;
- function setTimers()
- {
- setTimeout(pauseAnimation, 1000);
- }
+ const test = new AnimationTest({
+ target: document.getElementById("box"),
+ styleExtractor: style => parseFloat(style.marginLeft)
+ });
- runAnimationTest(expectedValues, setTimers, null, true);
+ // Record two computed values after the specified delay each.
+ await test.recordValueAfterRunningFor(delay);
+ await test.recordValueAfterRunningFor(delay);
- </script>
-</head>
-<body>
-<!-- This tests the operation of -webkit-animation-play-state. After 1 second the red boxes should be hidden by the green boxes. You should see no red boxes. -->
-<div id="box"></div>
-<div id="safezone"></div>
-<div id="result"></div>
+ // We'll now pause the animation using the CSS property "animation-play-state".
+ box.style.animationPlayState = "paused";
+
+ // And now we'll record values after the specified delay each and check that those are the same.
+ const initialPausedValue = await test.valueAfterWaitingFor(delay);
+ const currentPausedValue = await test.valueAfterWaitingFor(delay);
+ assert_equals(initialPausedValue, currentPausedValue, "Values recorded while paused are the same.");
+
+ // Finally, check the values recorded earlier in the test.
+ test.checkRecordedValues();
+
+ t.done();
+}, `Pausing an animation using the animation-play-state property stops animating styles.`);
+
+</script>
</div>
</body>
</html>
Modified: trunk/LayoutTests/platform/ios-wk2/TestExpectations (262547 => 262548)
--- trunk/LayoutTests/platform/ios-wk2/TestExpectations 2020-06-04 18:06:57 UTC (rev 262547)
+++ trunk/LayoutTests/platform/ios-wk2/TestExpectations 2020-06-04 18:28:17 UTC (rev 262548)
@@ -1754,6 +1754,4 @@
webkit.org/b/212532 http/wpt/service-workers/service-worker-crashing-while-fetching.https.html [ Pass Failure ]
webkit.org/b/212532 http/wpt/service-workers/service-worker-different-process.https.html [ Pass Failure ]
-webkit.org/b/212641 animations/play-state-paused.html [ Pass Failure ]
-
webkit.org/b/212696 imported/w3c/web-platform-tests/service-workers/service-worker/fetch-request-no-freshness-headers.https.html [ Pass Failure ]
