Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(15)

Side by Side Diff: polymer_0.5.0/bower_components/web-animations-js/test/blink/interpolation/shape-outside.html

Issue 786953007: npm_modules: Fork bower_components into Polymer 0.4.0 and 0.5.0 versions (Closed) Base URL: https://chromium.googlesource.com/infra/third_party/npm_modules.git@master
Patch Set: Created 5 years, 11 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 unified diff | Download patch
OLDNEW
(Empty)
1 <!DOCTYPE html>
2 <meta charset="UTF-8">
3 <body>
4 <script src="../testharness/testharness.js"></script>
5 <script src="../testharness/testharnessreport.js"></script>
6 <script src="resources/interpolation-test.js"></script>
7 <script>
8 /* TODO: add inset test once blend() works for it */
9
10 assertInterpolation({
11 property: 'shape-outside',
12 from: 'circle(100% at 0% 0%)',
13 to: 'circle(50% at 25% 25%)',
14 }, [
15 {at: -0.3, is: 'circle(115% at -7.5% -7.5%)'},
16 {at: 0, is: 'circle(100% at 0% 0%)'},
17 {at: 0.3, is: 'circle(85% at 7.5% 7.5%)'},
18 {at: 0.6, is: 'circle(70% at 15% 15%)'},
19 {at: 1, is: 'circle(50% at 25% 25%)'},
20 {at: 1.5, is: 'circle(25% at 37.5% 37.5%)'}
21 ]);
22
23 assertInterpolation({
24 property: 'shape-outside',
25 from: 'ellipse(100% 100% at 0% 0%)',
26 to: 'ellipse(50% 50% at 25% 25%)',
27 }, [
28 {at: -0.3, is: 'ellipse(115% 115% at -7.5% -7.5%)'},
29 {at: 0, is: 'ellipse(100% 100% at 0% 0%)'},
30 {at: 0.3, is: 'ellipse(85% 85% at 7.5% 7.5%)'},
31 {at: 0.6, is: 'ellipse(70% 70% at 15% 15%)'},
32 {at: 1, is: 'ellipse(50% 50% at 25% 25%)'},
33 {at: 1.5, is: 'ellipse(25% 25% at 37.5% 37.5%)'}
34 ]);
35
36 assertInterpolation({
37 property: 'shape-outside',
38 from: 'polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)',
39 to: 'polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)',
40 }, [
41 {at: -0.3, is: 'polygon(nonzero, -7.5px -7.5px, 17.5px 17.5px, 42.5px 42.5px)' },
42 {at: 0, is: 'polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)'},
43 {at: 0.3, is: 'polygon(nonzero, 7.5px 7.5px, 32.5px 32.5px, 57.5px 57.5px)'},
44 {at: 0.6, is: 'polygon(nonzero, 15px 15px, 40px 40px, 65px 65px)'},
45 {at: 1, is: 'polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)'},
46 {at: 1.5, is: 'polygon(nonzero, 37.5px 37.5px, 62.5px 62.5px, 87.5px 87.5px)'}
47 ]);
48
49 assertInterpolation({
50 property: 'shape-outside',
51 from: 'polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)',
52 to: 'polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)',
53 }, [
54 {at: -0.3, is: 'polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)'},
55 {at: 0, is: 'polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)'},
56 {at: 0.3, is: 'polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)'},
57 {at: 0.6, is: 'polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)'},
58 {at: 1, is: 'polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)'},
59 {at: 1.5, is: 'polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)'},
60 ]);
61
62 assertInterpolation({
63 property: 'shape-outside',
64 from: 'none',
65 to: 'ellipse(100% 100% at 0% 0%)',
66 }, [
67 {at: -0.3, is: 'none'},
68 {at: 0, is: 'none'},
69 {at: 0.3, is: 'none'},
70 {at: 0.6, is: 'ellipse(100% 100% at 0% 0%)'},
71 {at: 1, is: 'ellipse(100% 100% at 0% 0%)'},
72 {at: 1.5, is: 'ellipse(100% 100% at 0% 0%)'}
73 ]);
74
75 // TODO: add intermediate keyframe tests when CSS shapes position computed value s are cleaned up
76 assertInterpolation({
77 property: 'shape-outside',
78 from: 'circle(20% at right 10% bottom 20px)',
79 to: 'circle(30% at right 20% bottom 30px)',
80 }, [
81 {at: 0, is: 'circle(20% at right 10% bottom 20px)'},
82 {at: 0.5, is: 'circle(25% at 85% calc(-25px + 100%))'},
83 {at: 1, is: 'circle(30% at right 20% bottom 30px)'},
84 ]);
85 </script>
86 </body>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698