| OLD | NEW |
|---|
| (Empty) | |
| 1 <!DOCTYPE html> |
| 2 <meta charset="UTF-8"> |
| 3 <style> |
| 4 .target { |
| 5 color: white; |
| 6 width: 100px; |
| 7 height: 100px; |
| 8 background-color: black; |
| 9 display: inline-block; |
| 10 overflow: hidden; |
| 11 } |
| 12 .replica { |
| 13 background-color: green; |
| 14 } |
| 15 .target div { |
| 16 width: 10px; |
| 17 height: 10px; |
| 18 display: inline-block; |
| 19 background: orange; |
| 20 margin: 1px; |
| 21 } |
| 22 .test { |
| 23 overflow: hidden; |
| 24 } |
| 25 </style> |
| 26 <body> |
| 27 <template id="target-template"> |
| 28 <div></div> |
| 29 </template> |
| 30 <script src="../testharness/testharness.js"></script> |
| 31 <script src="../testharness/testharnessreport.js"></script> |
| 32 <script src="resources/interpolation-test.js"></script> |
| 33 <script> |
| 34 |
| 35 assertInterpolation({ |
| 36 property: 'transform', |
| 37 prefixedProperty: ['-webkit-transform'], |
| 38 from: 'scale(10, 5)', |
| 39 to: 'scale(20, 9)' |
| 40 }, [ |
| 41 {at: -1, is: 'scale(0, 1)'}, |
| 42 {at: 0, is: 'scale(10, 5)'}, |
| 43 {at: 0.25, is: 'scale(12.5, 6)'}, |
| 44 {at: 0.75, is: 'scale(17.5, 8)'}, |
| 45 {at: 1, is: 'scale(20, 9)'}, |
| 46 {at: 2, is: 'scale(30, 13)'}, |
| 47 ]); |
| 48 assertInterpolation({ |
| 49 property: 'transform', |
| 50 prefixedProperty: ['-webkit-transform'], |
| 51 from: 'scaleX(10)', |
| 52 to: 'scaleX(20)' |
| 53 }, [ |
| 54 {at: -1, is: 'scaleX(0)'}, |
| 55 {at: 0, is: 'scaleX(10)'}, |
| 56 {at: 0.25, is: 'scaleX(12.5)'}, |
| 57 {at: 0.75, is: 'scaleX(17.5)'}, |
| 58 {at: 1, is: 'scaleX(20)'}, |
| 59 {at: 2, is: 'scaleX(30)'}, |
| 60 ]); |
| 61 assertInterpolation({ |
| 62 property: 'transform', |
| 63 prefixedProperty: ['-webkit-transform'], |
| 64 from: 'scaleY(5)', |
| 65 to: 'scaleY(9)' |
| 66 }, [ |
| 67 {at: -1, is: 'scaleY(1)'}, |
| 68 {at: 0, is: 'scaleY(5)'}, |
| 69 {at: 0.25, is: 'scaleY(6)'}, |
| 70 {at: 0.75, is: 'scaleY(8)'}, |
| 71 {at: 1, is: 'scaleY(9)'}, |
| 72 {at: 2, is: 'scaleY(13)'}, |
| 73 ]); |
| 74 assertInterpolation({ |
| 75 property: 'transform', |
| 76 prefixedProperty: ['-webkit-transform'], |
| 77 from: 'scaleZ(1)', |
| 78 to: 'scaleZ(2)' |
| 79 }, [ |
| 80 {at: -1, is: 'scaleZ(0)'}, |
| 81 {at: 0, is: 'scaleZ(1)'}, |
| 82 {at: 0.25, is: 'scaleZ(1.25)'}, |
| 83 {at: 0.75, is: 'scaleZ(1.75)'}, |
| 84 {at: 1, is: 'scaleZ(2)'}, |
| 85 {at: 2, is: 'scaleZ(3)'}, |
| 86 ]); |
| 87 assertInterpolation({ |
| 88 property: 'transform', |
| 89 prefixedProperty: ['-webkit-transform'], |
| 90 from: 'scale3d(10, 0.5, 1)', |
| 91 to: 'scale3d(20, 1, 2)' |
| 92 }, [ |
| 93 {at: -1, is: 'scale3d(0, 0, 0)'}, |
| 94 {at: 0, is: 'scale3d(10, 0.5, 1)'}, |
| 95 {at: 0.25, is: 'scale3d(12.5, 0.625, 1.25)'}, |
| 96 {at: 0.75, is: 'scale3d(17.5, 0.875, 1.75)'}, |
| 97 {at: 1, is: 'scale3d(20, 1, 2)'}, |
| 98 {at: 2, is: 'scale3d(30, 1.5, 3)'}, |
| 99 ]); |
| 100 assertInterpolation({ |
| 101 property: 'transform', |
| 102 prefixedProperty: ['-webkit-transform'], |
| 103 from: 'none', |
| 104 to: 'scale3d(2, 3, 5)' |
| 105 }, [ |
| 106 {at: -1, is: 'scale3d(0, -1, -3)'}, |
| 107 {at: 0, is: 'none'}, |
| 108 {at: 0.25, is: 'scale3d(1.25, 1.5, 2)'}, |
| 109 {at: 0.75, is: 'scale3d(1.75, 2.5, 4)'}, |
| 110 {at: 1, is: 'scale3d(2, 3, 5)'}, |
| 111 {at: 2, is: 'scale3d(3, 5, 9)'}, |
| 112 ]); |
| 113 assertInterpolation({ |
| 114 property: 'transform', |
| 115 prefixedProperty: ['-webkit-transform'], |
| 116 from: 'scale3d(2, 3, 5)', |
| 117 to: 'none' |
| 118 }, [ |
| 119 {at: -1, is: 'scale3d(3, 5, 9)'}, |
| 120 {at: 0, is: 'scale3d(2, 3, 5)'}, |
| 121 {at: 0.25, is: 'scale3d(1.75, 2.5, 4)'}, |
| 122 {at: 0.75, is: 'scale3d(1.25, 1.5, 2)'}, |
| 123 {at: 1, is: 'none'}, |
| 124 {at: 2, is: 'scale3d(0, -1, -3)'}, |
| 125 ]); |
| 126 assertInterpolation({ |
| 127 property: 'transform', |
| 128 prefixedProperty: ['-webkit-transform'], |
| 129 from: 'scaleX(10) scaleY(0.5) scaleZ(1)', |
| 130 to: 'scaleX(20) scaleY(1) scaleZ(2)' |
| 131 }, [ |
| 132 {at: -1, is: 'scaleX(0) scaleY(0) scaleZ(0)'}, |
| 133 {at: 0, is: 'scaleX(10) scaleY(0.5) scaleZ(1)'}, |
| 134 {at: 0.25, is: 'scaleX(12.5) scaleY(0.625) scaleZ(1.25)'}, |
| 135 {at: 0.75, is: 'scaleX(17.5) scaleY(0.875) scaleZ(1.75)'}, |
| 136 {at: 1, is: 'scaleX(20) scaleY(1) scaleZ(2)'}, |
| 137 {at: 2, is: 'scaleX(30) scaleY(1.5) scaleZ(3)'}, |
| 138 ]); |
| 139 assertInterpolation({ |
| 140 property: 'transform', |
| 141 prefixedProperty: ['-webkit-transform'], |
| 142 from: 'skewX(10rad) scaleZ(1)', |
| 143 to: 'skewX(20rad) scaleZ(2)' |
| 144 }, [ |
| 145 {at: -1, is: 'skewX(0rad) scaleZ(0)'}, |
| 146 {at: 0, is: 'skewX(10rad) scaleZ(1)'}, |
| 147 {at: 0.25, is: 'skewX(12.5rad) scaleZ(1.25)'}, |
| 148 {at: 0.75, is: 'skewX(17.5rad) scaleZ(1.75)'}, |
| 149 {at: 1, is: 'skewX(20rad) scaleZ(2)'}, |
| 150 {at: 2, is: 'skewX(30rad) scaleZ(3)'}, |
| 151 ]); |
| 152 assertInterpolation({ |
| 153 property: 'transform', |
| 154 prefixedProperty: ['-webkit-transform'], |
| 155 from: 'skewX(10rad)', |
| 156 to: 'skewX(20rad) scaleZ(2)' |
| 157 }, [ |
| 158 {at: -1, is: 'matrix3d(1, 0, 0, 0, -0.940439289306569, 1, 0, 0, 0, 0, 0, 0, 0,
0, 0, 1)'}, |
| 159 {at: 0, is: 'skewX(10rad)'}, |
| 160 {at: 0.25, is: 'matrix3d(1, 0, 0, 0, 1.0455608566505006, 1, 0, 0, 0, 0, 1.25,
0, 0, 0, 0, 1)'}, |
| 161 {at: 0.75, is: 'matrix3d(1, 0, 0, 0, 1.8399609150333283, 1, 0, 0, 0, 0, 1.75,
0, 0, 0, 0, 1)'}, |
| 162 {at: 1, is: 'skewX(20rad) scaleZ(2)'}, |
| 163 {at: 2, is: 'matrix3d(1, 0, 0, 0, 3.825961060990398, 1, 0, 0, 0, 0, 3, 0, 0, 0
, 0, 1)'}, |
| 164 ]); |
| 165 assertInterpolation({ |
| 166 property: 'transform', |
| 167 prefixedProperty: ['-webkit-transform'], |
| 168 from: 'scaleZ(3) perspective(400px)', |
| 169 to: 'scaleZ(4) skewX(1rad) perspective(500px)' |
| 170 }, [ |
| 171 {at: -1, is: 'matrix3d(1, 0, 0, 0, -1.5574077246549023, 1, 0, 0, 0, 0, 2, -0.0
02333333333333333, 0, 0, 0, 1)'}, |
| 172 {at: 0, is: 'matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 3, -0.0025, 0, 0, 0, 1)'}, |
| 173 {at: 0.25, is: 'matrix3d(1, 0, 0, 0, 0.3893519311637256, 1, 0, 0, 0, 0, 3.25,
-0.0024375, 0, 0, 0, 1)'}, |
| 174 {at: 0.75, is: 'matrix3d(1, 0, 0, 0, 1.1680557934911766, 1, 0, 0, 0, 0, 3.75,
-0.0021874999999999998, 0, 0, 0, 1)'}, |
| 175 {at: 1, is: 'matrix3d(1, 0, 0, 0, 1.5574077246549023, 1, 0, 0, 0, 0, 4, -0.002
, 0, 0, 0, 1)'}, |
| 176 {at: 2, is: 'matrix3d(1, 0, 0, 0, 3.1148154493098046, 1, 0, 0, 0, 0, 5, -0.000
8333333333333337, 0, 0, 0, 1)'}, |
| 177 ]); |
| 178 assertInterpolation({ |
| 179 property: 'transform', |
| 180 prefixedProperty: ['-webkit-transform'], |
| 181 from: 'translateY(70%) scaleZ(1)', |
| 182 to: 'translateY(90%) scaleZ(2)' |
| 183 }, [ |
| 184 {at: -1, is: 'translateY(50%) scaleZ(0)'}, |
| 185 {at: 0, is: 'translateY(70%) scaleZ(1)'}, |
| 186 {at: 0.25, is: 'translateY(75%) scaleZ(1.25)'}, |
| 187 {at: 0.75, is: 'translateY(85%) scaleZ(1.75)'}, |
| 188 {at: 1, is: 'translateY(90%) scaleZ(2)'}, |
| 189 {at: 2, is: 'translateY(110%) scaleZ(3)'}, |
| 190 ]); |
| 191 // FIXME: This test case does not work because we don't support non-px lengths |
| 192 // in matrix decompositions. |
| 193 // assertInterpolation({ |
| 194 // property: 'transform', |
| 195 // from: 'translateY(70%)', |
| 196 // to: 'translateY(90%) scaleZ(2)' |
| 197 // }, [ |
| 198 // {at: -1, is: 'translateY(50%) scaleZ(0)'}, |
| 199 // {at: 0, is: 'translateY(70%)'}, |
| 200 // {at: 0.25, is: 'translateY(75%) scaleZ(1.25)'}, |
| 201 // {at: 0.75, is: 'translateY(85%) scaleZ(1.75)'}, |
| 202 // {at: 1, is: 'translateY(90%) scaleZ(2)'}, |
| 203 // {at: 2, is: 'translateY(110%) scaleZ(3)'}, |
| 204 // ]); |
| 205 </script> |
| 206 </body> |
| OLD | NEW |
|---|
Chromium Code Reviews
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