| Index: third_party/WebKit/LayoutTests/web-animations-api/w3c/simple-keyframes.html
|
| diff --git a/third_party/WebKit/LayoutTests/web-animations-api/w3c/simple-keyframes.html b/third_party/WebKit/LayoutTests/web-animations-api/w3c/simple-keyframes.html
|
| index fee77a185293f826f03d3841b42079366bf5fbfe..8c403f4dd056f447ad724525dd21f4f708f1683b 100644
|
| --- a/third_party/WebKit/LayoutTests/web-animations-api/w3c/simple-keyframes.html
|
| +++ b/third_party/WebKit/LayoutTests/web-animations-api/w3c/simple-keyframes.html
|
| @@ -1,45 +1,58 @@
|
| <!DOCTYPE html>
|
| +<meta charset=utf-8>
|
| +<title>Animate() with no offsets</title>
|
| +<link rel="help" href="https://w3c.github.io/web-animations/#keyframe-animation-effects">
|
| <script src="../../resources/testharness.js"></script>
|
| <script src="../../resources/testharnessreport.js"></script>
|
| -<script src="resources/keyframes-test.js"></script>
|
| +<script src="../../imported/wpt/web-animations/testcommon.js"></script>
|
| +<body>
|
| <script>
|
| -test(function() {
|
| - assertAnimationStyles([
|
| +'use strict';
|
| +test(function(t) {
|
| + var keyframes = [
|
| {opacity: '0.25', left: '25px'},
|
| {opacity: '0.75', left: '75px'},
|
| - ], {
|
| + ];
|
| + var expectations = {
|
| 0.5: {opacity: '0.5', left: '50px'},
|
| - });
|
| -},
|
| -'element.animate() with 2 keyframes',
|
| -{
|
| - help: 'http://dev.w3.org/fxtf/web-animations/#keyframe-animation-effects',
|
| - assert: [
|
| - 'element.animate() should start an animation when two keyframes',
|
| - 'are provided with matching properties and no offsets specified.',
|
| - ],
|
| - author: 'Alan Cutter',
|
| -});
|
| + };
|
| + for (var progress in expectations) {
|
| + var element = createDiv(t);
|
| + element.animate(keyframes, {
|
| + duration: 1000,
|
| + fill: 'forwards',
|
| + delay: -progress * 1000,
|
| + });
|
| + var computedStyle = getComputedStyle(element);
|
| + for (var property in expectations[progress]) {
|
| + assert_equals(computedStyle[property], expectations[progress][property],
|
| + property + ' at ' + (progress * 100) + '%');
|
| + }
|
| + }
|
| +}, 'element.animate() with 2 keyframes');
|
|
|
| -test(function() {
|
| - assertAnimationStyles([
|
| +test(function(t) {
|
| + var keyframes =[
|
| {opacity: '0', left: '0px'},
|
| {opacity: '0.25', left: '25px'},
|
| {opacity: '0.75', left: '75px'},
|
| - ], {
|
| + ];
|
| + var expectations = {
|
| 0.25: {opacity: '0.125', left: '12.5px'},
|
| 0.75: {opacity: '0.5', left: '50px'},
|
| - });
|
| -},
|
| -'element.animate() with 3 keyframes',
|
| -{
|
| - help: 'http://dev.w3.org/fxtf/web-animations/#keyframe-animation-effects',
|
| - assert: [
|
| - 'element.animate() should start an animation when three keyframes',
|
| - 'are provided with matching properties and no offsets specified.',
|
| - 'The keyframes must maintain their ordering and get distributed',
|
| - 'correctly.',
|
| - ],
|
| - author: 'Alan Cutter',
|
| -});
|
| + };
|
| + for (var progress in expectations) {
|
| + var element = createDiv(t);
|
| + element.animate(keyframes, {
|
| + duration: 1000,
|
| + fill: 'forwards',
|
| + delay: -progress * 1000,
|
| + });
|
| + var computedStyle = getComputedStyle(element);
|
| + for (var property in expectations[progress]) {
|
| + assert_equals(computedStyle[property], expectations[progress][property],
|
| + property + ' at ' + (progress * 100) + '%');
|
| + }
|
| + }
|
| +}, 'element.animate() with 3 keyframes');
|
| </script>
|
|
|
Chromium Code Reviews
Issue 2138333002:
Cleaned up simple-keyframes.html test (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master