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

Side by Side Diff: LayoutTests/animations/interpolation/svg-r-interpolation.html

Issue 991533003: Handle more <length> properties in animation (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: stroke-dashoffset setter exists + fixups + add tests Created 5 years, 9 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
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <meta charset="UTF-8"> 2 <meta charset="UTF-8">
3 <style> 3 <style>
4 .target { 4 .target {
5 stroke: black; 5 stroke: black;
6 fill: white; 6 fill: white;
7 stroke-width: 5px; 7 r: 5px;
8 } 8 }
9 .replica { 9 .replica {
10 stroke: green; 10 stroke: green;
11 } 11 }
12 </style> 12 </style>
13 <body> 13 <body>
14 <template id="target-template"> 14 <template id="target-template">
15 <svg width="70" height="70"> 15 <svg width="70" height="70">
16 <rect x="10" y="10" width="50" height="50"/> 16 <circle cx="35" cy="35" r="20" class="target"/>
17 </svg> 17 </svg>
18 </template> 18 </template>
19 <script src="resources/interpolation-test.js"></script> 19 <script src="resources/interpolation-test.js"></script>
20 <script> 20 <script>
21 assertInterpolation({ 21 assertInterpolation({
22 property: 'stroke-width', 22 property: 'r',
23 from: '0px', 23 from: '0px',
24 to: '20px' 24 to: '20px'
25 }, [ 25 }, [
26 {at: -0.3, is: '0px'}, // SVG stroke-width can't be negative. 26 {at: -0.3, is: '0px'}, // SVG r can't be negative.
27 {at: 0, is: '0px'}, 27 {at: 0, is: '0px'},
28 {at: 0.3, is: '6px'}, 28 {at: 0.3, is: '6px'},
29 {at: 0.6, is: '12px'}, 29 {at: 0.6, is: '12px'},
30 {at: 1, is: '20px'}, 30 {at: 1, is: '20px'},
31 {at: 1.5, is: '30px'}, 31 {at: 1.5, is: '30px'},
32 ]); 32 ]);
33 assertInterpolation({ 33 assertInterpolation({
34 property: 'stroke-width', 34 property: 'r',
35 from: '0px', 35 from: '0px',
36 to: '10em' 36 to: '10em'
37 }, [ 37 }, [
38 {at: -0.3, is: '0em'}, // SVG stroke-width can't be negative. 38 {at: -0.3, is: '0em'}, // SVG r can't be negative.
39 {at: 0, is: '0em'}, 39 {at: 0, is: '0em'},
40 {at: 0.3, is: '3em'}, 40 {at: 0.3, is: '3em'},
41 {at: 0.6, is: '6em'}, 41 {at: 0.6, is: '6em'},
42 {at: 1, is: '10em'}, 42 {at: 1, is: '10em'},
43 {at: 1.5, is: '15em'}, 43 {at: 1.5, is: '15em'},
44 ]); 44 ]);
45 assertInterpolation({ 45 assertInterpolation({
46 property: 'stroke-width', 46 property: 'r',
47 from: '30px', 47 from: '30px',
48 to: '10em' 48 to: '10em'
49 }, [ 49 }, [
50 {at: -0.3, is: '0px'}, 50 {at: -0.3, is: '0px'},
51 {at: 0, is: '30px'}, 51 {at: 0, is: '30px'},
52 {at: 0.3, is: '69px'}, 52 {at: 0.3, is: '69px'},
53 {at: 0.6, is: '108px'}, 53 {at: 0.6, is: '108px'},
54 {at: 1, is: '10em'}, 54 {at: 1, is: '10em'},
55 {at: 1.5, is: '225px'}, 55 {at: 1.5, is: '225px'},
56 ]); 56 ]);
57 assertInterpolation({ 57 assertInterpolation({
58 property: 'stroke-width', 58 property: 'r',
59 from: '10em', 59 from: '10em',
60 to: '0px' 60 to: '0px'
61 }, [ 61 }, [
62 {at: -0.3, is: '13em'}, 62 {at: -0.3, is: '13em'},
63 {at: 0, is: '10em'}, 63 {at: 0, is: '10em'},
64 {at: 0.3, is: '7em'}, 64 {at: 0.3, is: '7em'},
65 {at: 0.6, is: '4em'}, 65 {at: 0.6, is: '4em'},
66 {at: 1, is: '0em'}, 66 {at: 1, is: '0em'},
67 {at: 1.5, is: '0em'}, // SVG stroke-width can't be negative. 67 {at: 1.5, is: '0em'}, // SVG r can't be negative.
68 ]); 68 ]);
69 assertInterpolation({ 69 assertInterpolation({
70 property: 'stroke-width', 70 property: 'r',
71 from: '10em', 71 from: '10em',
72 to: '30px' 72 to: '30px'
73 }, [ 73 }, [
74 {at: -0.3, is: '199px'}, 74 {at: -0.3, is: '199px'},
75 {at: 0, is: '10em'}, 75 {at: 0, is: '10em'},
76 {at: 0.3, is: '121px'}, 76 {at: 0.3, is: '121px'},
77 {at: 0.6, is: '82px'}, 77 {at: 0.6, is: '82px'},
78 {at: 1, is: '30px'}, 78 {at: 1, is: '30px'},
79 {at: 1.5, is: '0px'}, 79 {at: 1.5, is: '0px'},
80 ]); 80 ]);
81 assertInterpolation({
82 property: 'r',
83 from: '0',
84 to: '20'
85 }, [
86 {at: -0.3, is: '0'},
87 {at: 0, is: '0'},
88 {at: 0.3, is: '6'},
89 {at: 0.6, is: '12'},
90 {at: 1, is: '20'},
91 {at: 1.5, is: '30'},
92 ]);
81 </script> 93 </script>
82 </body> 94 </body>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698