third_party/WebKit/LayoutTests/web-animations-api/keyframe-effect-iterable-keyframes.html - Issue 2142733002: Modified iterable keyframes test to use KeyframeEffect constructor and

Unified Diff: third_party/WebKit/LayoutTests/web-animations-api/keyframe-effect-iterable-keyframes.html

Issue 2142733002: Modified iterable keyframes test to use KeyframeEffect constructor and (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master

Patch Set: Add test expectations now that this test fails Created 4 years, 5 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

View side-by-side diff with in-line comments

Download patch

« no previous file with comments | « third_party/WebKit/LayoutTests/web-animations-api/element-animate-iterable-keyframes.html ('k') | third_party/WebKit/LayoutTests/web-animations-api/keyframe-effect-iterable-keyframes-expected.txt » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

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'>

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'}},

{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>