| OLD | NEW |
|---|
| (Empty) |
| 1 <!DOCTYPE html> | |
| 2 <meta charset='utf-8'> | |
| 3 <title>Test that KeyframeEffect can take iterable objects as keyframes</title> | |
| 4 <link rel='help' href='https://w3c.github.io/web-animations/#processing-a-keyfra
mes-argument'> | |
| 5 <script src="../resources/testharness.js"></script> | |
| 6 <script src="../resources/testharnessreport.js"></script> | |
| 7 <body></body> | |
| 8 <script> | |
| 9 function assertAnimationEffect({keyframes, expect}) { | |
| 10 var effect = new KeyframeEffect(null, keyframes); | |
| 11 var frames = effect.getKeyframes(); | |
| 12 for (let i = 0; i < expect.length; i++) { | |
| 13 assert_equals(frames[i].computedOffset, expect[i].at); | |
| 14 for (var property in expect[i].is) | |
| 15 assert_equals(frames[i][property], expect[i].is[property], | |
| 16 `${property} is ${expect[i].is[property]} at ${expect[i].at}`); | |
| 17 } | |
| 18 return frames; | |
| 19 } | |
| 20 | |
| 21 function createIterable(iterations) { | |
| 22 return { | |
| 23 [Symbol.iterator]() { | |
| 24 var i = 0; | |
| 25 return {next: () => iterations[i++]}; | |
| 26 }, | |
| 27 }; | |
| 28 } | |
| 29 | |
| 30 test(() => { | |
| 31 assertAnimationEffect({ | |
| 32 keyframes: createIterable([ | |
| 33 {done: false, value: {left: '100px'}}, | |
| 34 {done: false, value: {left: '300px'}}, | |
| 35 {done: false, value: {left: '200px'}}, | |
| 36 {done: true}, | |
| 37 ]), | |
| 38 expect: [ | |
| 39 {at: 0, is: {left: '100px'}}, | |
| 40 {at: 0.5, is: {left: '300px'}}, | |
| 41 {at: 1, is: {left: '200px'}}, | |
| 42 ], | |
| 43 }); | |
| 44 }, 'Custom iterator with basic keyframes.'); | |
| 45 | |
| 46 test(() => { | |
| 47 var keyframes = createIterable([ | |
| 48 {done: false, value: {left: '100px'}}, | |
| 49 {done: false, value: {left: '300px'}}, | |
| 50 {done: false, value: {left: '200px'}}, | |
| 51 {done: true}, | |
| 52 ]); | |
| 53 keyframes.easing = 'ease-in-out'; | |
| 54 keyframes.offset = '0.1'; | |
| 55 let frames = assertAnimationEffect({ | |
| 56 keyframes, | |
| 57 expect: [ | |
| 58 {at: 0, is: {left: '100px'}}, | |
| 59 {at: 0.5, is: {left: '300px'}}, | |
| 60 {at: 1, is: {left: '200px'}}, | |
| 61 ], | |
| 62 }); | |
| 63 assert_equals(frames[0].easing, 'linear'); | |
| 64 assert_equals(frames[0].offset, null); | |
| 65 }, 'easing and offset are ignored on iterable objects.'); | |
| 66 | |
| 67 test(() => { | |
| 68 assertAnimationEffect({ | |
| 69 keyframes: createIterable([ | |
| 70 {done: false, value: {left: '100px', top: '200px'}}, | |
| 71 {done: false, value: {left: '300px'}}, | |
| 72 {done: false, value: {left: '200px', top: '100px'}}, | |
| 73 {done: true}, | |
| 74 ]), | |
| 75 expect: [ | |
| 76 {at: 0, is: {left: '100px', top: '200px'}}, | |
| 77 {at: 0.5, is: {left: '300px'}}, | |
| 78 {at: 1, is: {left: '200px', top: '100px'}}, | |
| 79 ], | |
| 80 }); | |
| 81 }, 'Custom iterator with multiple properties specified.'); | |
| 82 | |
| 83 test(() => { | |
| 84 assertAnimationEffect({ | |
| 85 keyframes: createIterable([ | |
| 86 {done: false, value: {left: '100px'}}, | |
| 87 {done: false, value: {left: '250px', offset: 0.75}}, | |
| 88 {done: false, value: {left: '200px'}}, | |
| 89 {done: true}, | |
| 90 ]), | |
| 91 expect: [ | |
| 92 {at: 0, is: {left: '100px'}}, | |
| 93 {at: 0.75, is: {left: '250px'}}, | |
| 94 {at: 1, is: {left: '200px'}}, | |
| 95 ], | |
| 96 }); | |
| 97 }, 'Custom iterator with offset specified.'); | |
| 98 | |
| 99 test(() => { | |
| 100 assert_throws({name: 'TypeError'}, () => { | |
| 101 assertAnimationEffect({ | |
| 102 keyframes: createIterable([ | |
| 103 {done: false, value: {left: '100px'}}, | |
| 104 {done: false, value: 1234}, | |
| 105 {done: false, value: {left: '200px'}}, | |
| 106 {done: true}, | |
| 107 ]), | |
| 108 expect: [], | |
| 109 }); | |
| 110 }); | |
| 111 }, 'Custom iterator with non object keyframe should throw.'); | |
| 112 | |
| 113 test(() => { | |
| 114 assertAnimationEffect({ | |
| 115 keyframes: createIterable([ | |
| 116 {done: false, value: {left: ['100px', '200px']}}, | |
| 117 {done: true}, | |
| 118 ]), | |
| 119 expect: [{at: 1, is: {left: "100px,200px"}}], | |
| 120 }); | |
| 121 }, 'Custom iterator with value list in keyframe should give bizarre string repre
sentation of list.'); | |
| 122 </script> | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 2910883002:
Clean up duplicate tests in web-animations-api (Closed)
