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

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

Issue 1265873002: Add test coverage for interpolations using CSS wide keywords and neutral keyframes (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Rebased Created 5 years, 4 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 | Annotate | Revision Log
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <meta charset="UTF-8"> 2 <meta charset="UTF-8">
3 <style> 3 <style>
4 svg { 4 .container {
5 stroke-dashoffset: 100px; 5 display: inline-block;
6 }
7 .parent {
8 stroke-dashoffset: 80px;
6 } 9 }
7 .target { 10 .target {
11 font-size: 16px;
8 stroke: black; 12 stroke: black;
9 stroke-width: 10px; 13 stroke-width: 10px;
10 font-size: 16px; 14 stroke-dashoffset: 20px;
11 } 15 }
12 .expected { 16 .expected {
13 stroke: green; 17 stroke: green;
14 } 18 }
15 </style> 19 </style>
16 <body> 20 <body>
17 <template id="target-template"> 21 <template id="target-template">
18 <svg height="200" width="10"> 22 <svg height="200" width="5">
19 <path d="M5,0 l0,200" stroke-dasharray="15,15" class="target"> 23 <path d="M0,0 l0,200" stroke-dasharray="10,20" class="target">
20 </svg> 24 </svg>
21 </template> 25 </template>
22 <script src="resources/interpolation-test.js"></script> 26 <script src="resources/interpolation-test.js"></script>
23 <script> 27 <script>
24 assertInterpolation({ 28 assertInterpolation({
25 property: 'stroke-dashoffset', 29 property: 'stroke-dashoffset',
30 from: '',
31 to: '40px',
32 }, [
33 {at: -0.25, is: '15px'},
34 {at: 0, is: '20px'},
35 {at: 0.25, is: '25px'},
36 {at: 0.5, is: '30px'},
37 {at: 0.75, is: '35px'},
38 {at: 1, is: '40px'},
39 {at: 1.25, is: '45px'},
40 ]);
41
42 assertInterpolation({
43 property: 'stroke-dashoffset',
44 from: 'initial',
45 to: '40px',
46 }, [
47 {at: -0.25, is: '-10px'},
48 {at: 0, is: '0px'},
49 {at: 0.25, is: '10px'},
50 {at: 0.5, is: '20px'},
51 {at: 0.75, is: '30px'},
52 {at: 1, is: '40px'},
53 {at: 1.25, is: '50px'},
54 ]);
55
56 assertInterpolation({
57 property: 'stroke-dashoffset',
58 from: 'inherit',
59 to: '40px',
60 }, [
61 {at: -0.25, is: '90px'},
62 {at: 0, is: '80px'},
63 {at: 0.25, is: '70px'},
64 {at: 0.5, is: '60px'},
65 {at: 0.75, is: '50px'},
66 {at: 1, is: '40px'},
67 {at: 1.25, is: '30px'},
68 ]);
69
70 assertInterpolation({
71 property: 'stroke-dashoffset',
72 from: 'unset',
73 to: '40px',
74 }, [
75 {at: -0.25, is: '90px'},
76 {at: 0, is: '80px'},
77 {at: 0.25, is: '70px'},
78 {at: 0.5, is: '60px'},
79 {at: 0.75, is: '50px'},
80 {at: 1, is: '40px'},
81 {at: 1.25, is: '30px'},
82 ]);
83
84 assertInterpolation({
85 property: 'stroke-dashoffset',
26 from: '-10px', 86 from: '-10px',
27 to: '10px' 87 to: '10px'
28 }, [ 88 }, [
29 {at: -0.25, is: '-15px'}, 89 {at: -0.25, is: '-15px'},
30 {at: 0, is: '-10px'}, 90 {at: 0, is: '-10px'},
31 {at: 0.25, is: '-5px'}, 91 {at: 0.25, is: '-5px'},
32 {at: 0.5, is: '0px'}, 92 {at: 0.5, is: '0px'},
33 {at: 0.75, is: '5px'}, 93 {at: 0.75, is: '5px'},
34 {at: 1, is: '10px'}, 94 {at: 1, is: '10px'},
35 {at: 1.25, is: '15px'}, 95 {at: 1.25, is: '15px'},
36 ]); 96 ]);
97
37 assertInterpolation({ 98 assertInterpolation({
38 property: 'stroke-dashoffset', 99 property: 'stroke-dashoffset',
39 from: '-20px', 100 from: '-20px',
40 to: '30em' 101 to: '30em'
41 }, [ 102 }, [
42 {at: -0.25, is: '-145px'}, 103 {at: -0.25, is: '-145px'},
43 {at: 0, is: '-20px'}, 104 {at: 0, is: '-20px'},
44 {at: 0.25, is: '105px'}, 105 {at: 0.25, is: '105px'},
45 {at: 0.5, is: '230px'}, 106 {at: 0.5, is: '230px'},
46 {at: 0.75, is: '355px'}, 107 {at: 0.75, is: '355px'},
47 {at: 1, is: '30em'}, 108 {at: 1, is: '30em'},
48 {at: 1.25, is: '605px'}, 109 {at: 1.25, is: '605px'},
49 ]); 110 ]);
50 assertInterpolation({ 111
51 property: 'stroke-dashoffset',
52 from: 'inherit',
53 to: '140px'
54 }, [
55 {at: -0.25, is: '90px'},
56 {at: 0, is: '100px'},
57 {at: 0.25, is: '110px'},
58 {at: 0.5, is: '120px'},
59 {at: 0.75, is: '130px'},
60 {at: 1, is: '140px'},
61 {at: 1.25, is: '150px'},
62 ]);
63 assertInterpolation({ 112 assertInterpolation({
64 property: 'stroke-dashoffset', 113 property: 'stroke-dashoffset',
65 from: '-10', 114 from: '-10',
66 to: '10' 115 to: '10'
67 }, [ 116 }, [
68 {at: -0.25, is: '-15'}, 117 {at: -0.25, is: '-15'},
69 {at: 0, is: '-10'}, 118 {at: 0, is: '-10'},
70 {at: 0.25, is: '-5'}, 119 {at: 0.25, is: '-5'},
71 {at: 0.5, is: '0'}, 120 {at: 0.5, is: '0'},
72 {at: 0.75, is: '5'}, 121 {at: 0.75, is: '5'},
73 {at: 1, is: '10'}, 122 {at: 1, is: '10'},
74 {at: 1.25, is: '15'}, 123 {at: 1.25, is: '15'},
75 ]); 124 ]);
76 </script> 125 </script>
77 </body> 126 </body>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698