Chromium Code Reviews Chromium Code Reviews
Issue 2142733002:
Modified iterable keyframes test to use KeyframeEffect constructor and (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master| Index: third_party/WebKit/LayoutTests/web-animations-api/keyframe-effect-iterable-keyframes.html |
| diff --git a/third_party/WebKit/LayoutTests/web-animations-api/element-animate-iterable-keyframes.html b/third_party/WebKit/LayoutTests/web-animations-api/keyframe-effect-iterable-keyframes.html |
| similarity index 70% |
| rename from third_party/WebKit/LayoutTests/web-animations-api/element-animate-iterable-keyframes.html |
| rename to third_party/WebKit/LayoutTests/web-animations-api/keyframe-effect-iterable-keyframes.html |
| index 09d9a279f08ac8745af7b134c9f87fcaff2d4410..1cd20ff902469b77e1878135ef530ffd53ae7ac2 100644 |
| --- a/third_party/WebKit/LayoutTests/web-animations-api/element-animate-iterable-keyframes.html |
| +++ b/third_party/WebKit/LayoutTests/web-animations-api/keyframe-effect-iterable-keyframes.html |
| @@ -1,19 +1,21 @@ |
| <!DOCTYPE html> |
| +<meta charset='utf-8'> |
| +<title>Test that KeyframeEffect can take iterable objects as keyframes</title> |
| +<link rel='help' href='https://w3c.github.io/web-animations/#processing-a-keyframes-argument'> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| <body></body> |
| <script> |
| function assertAnimationEffect({keyframes, expect}) { |
| - var target = document.createElement('target'); |
| - document.body.appendChild(target); |
| - var animation = target.animate(keyframes, {duration: 1, fill: 'forwards'}); |
| - animation.pause(); |
| - for (var {at, is} of expect) { |
| - animation.currentTime = at; |
| - for (var property in is) |
| - assert_equals(getComputedStyle(target)[property], is[property], `${property} is ${is[property]} at ${at}`); |
| + var effect = new KeyframeEffect(null, keyframes); |
| + var frames = effect.getKeyframes(); |
| + for (let i = 0; i < expect.length; i++) { |
| + assert_equals(frames[i].computedOffset, expect[i].at); |
| + for (var property in expect[i].is) |
| + assert_equals(frames[i][property], expect[i].is[property], |
| + `${property} is ${expect[i].is[property]} at ${expect[i].at}`); |
| } |
| - target.remove(); |
| + return frames; |
| } |
| function createIterable(iterations) { |
| @@ -35,9 +37,7 @@ test(() => { |
| ]), |
| expect: [ |
| {at: 0, is: {left: '100px'}}, |
| - {at: 0.25, is: {left: '200px'}}, |
| {at: 0.5, is: {left: '300px'}}, |
| - {at: 0.75, is: {left: '250px'}}, |
| {at: 1, is: {left: '200px'}}, |
| ], |
| }); |
| @@ -52,16 +52,16 @@ test(() => { |
| ]); |
| keyframes.easing = 'ease-in-out'; |
| keyframes.offset = '0.1'; |
| - assertAnimationEffect({ |
| + let frames = assertAnimationEffect({ |
| keyframes, |
| expect: [ |
| {at: 0, is: {left: '100px'}}, |
| - {at: 0.25, is: {left: '200px'}}, |
| {at: 0.5, is: {left: '300px'}}, |
| - {at: 0.75, is: {left: '250px'}}, |
| {at: 1, is: {left: '200px'}}, |
| ], |
| }); |
| + assert_equals(frames[0].easing, 'linear'); |
| + assert_equals(frames[0].offset, null); |
| }, 'easing and offset are ignored on iterable objects.'); |
| test(() => { |
| @@ -74,9 +74,7 @@ test(() => { |
| ]), |
| expect: [ |
| {at: 0, is: {left: '100px', top: '200px'}}, |
| - {at: 0.25, is: {left: '200px', top: '175px'}}, |
| - {at: 0.5, is: {left: '300px', top: '150px'}}, |
| - {at: 0.75, is: {left: '250px', top: '125px'}}, |
| + {at: 0.5, is: {left: '300px'}}, |
|
alancutter (OOO until 2018)
2016/07/12 03:44:53
Why remove the check for top?
|
| {at: 1, is: {left: '200px', top: '100px'}}, |
| ], |
| }); |
| @@ -92,8 +90,6 @@ test(() => { |
| ]), |
| expect: [ |
| {at: 0, is: {left: '100px'}}, |
| - {at: 0.25, is: {left: '150px'}}, |
| - {at: 0.5, is: {left: '200px'}}, |
| {at: 0.75, is: {left: '250px'}}, |
| {at: 1, is: {left: '200px'}}, |
| ], |
| @@ -115,14 +111,12 @@ test(() => { |
| }, 'Custom iterator with non object keyframe should throw.'); |
| test(() => { |
| - assert_throws({name: 'TypeError'}, () => { |
| - assertAnimationEffect({ |
| - keyframes: createIterable([ |
| - {done: false, value: {left: ['100px', '200px']}}, |
| - {done: true}, |
| - ]), |
| - expect: [], |
| - }); |
| + assertAnimationEffect({ |
| + keyframes: createIterable([ |
| + {done: false, value: {left: ['100px', '200px']}}, |
| + {done: true}, |
| + ]), |
| + expect: [{at: 1, is: {left: "100px,200px"}}], |
| }); |
| -}, 'Custom iterator with value list in keyframe should throw.'); |
| +}, 'Custom iterator with value list in keyframe should give bizarre string representation of list.'); |
| </script> |
