| OLD | NEW |
|---|
| (Empty) | |
| 1 <!DOCTYPE html> |
| 2 <html> |
| 3 <body> |
| 4 <template id="target-template"> |
| 5 <svg width="50" height="50"> |
| 6 <ellipse class="target" cx="40" cy="30" rx="20" ry="30" /> |
| 7 </svg> |
| 8 </template> |
| 9 <script src="resources/interpolation-test.js"></script> |
| 10 <script> |
| 11 'use strict'; |
| 12 assertAttributeInterpolation({ |
| 13 property: 'cx', |
| 14 from: 'calc(50% - 25px)', |
| 15 to: 'calc(100% - 10px)' |
| 16 }, [ |
| 17 {at: -0.25, is: '-10px'}, |
| 18 {at: 0, is: '0px'}, |
| 19 {at: 0.25, is: '10px'}, |
| 20 {at: 0.5, is: '20px'}, |
| 21 {at: 0.75, is: '30px'}, |
| 22 {at: 1, is: '40px'}, |
| 23 {at: 1.25, is: '50px'} |
| 24 ]); |
| 25 assertAttributeInterpolation({ |
| 26 property: 'cy', |
| 27 from: '0%', |
| 28 to: '100px' |
| 29 }, [ |
| 30 {at: -0.25, is: 'calc(0% + -25px)'}, |
| 31 {at: 0, is: '0%'}, |
| 32 {at: 0.25, is: 'calc(0% + 25px)'}, |
| 33 {at: 0.5, is: 'calc(0% + 50px)'}, |
| 34 {at: 0.75, is: 'calc(0% + 75px)'}, |
| 35 {at: 1, is: '100px'}, |
| 36 {at: 1.25, is: 'calc(0% + 125px)'} |
| 37 ]); |
| 38 assertAttributeInterpolation({ |
| 39 property: 'cy', |
| 40 from: '0%', |
| 41 to: '100' |
| 42 }, [ |
| 43 {at: -0.25, is: 'calc(0% + -25)'}, |
| 44 {at: 0, is: '0%'}, |
| 45 {at: 0.25, is: 'calc(0% + 25)'}, |
| 46 {at: 0.5, is: 'calc(0% + 50)'}, |
| 47 {at: 0.75, is: 'calc(0% + 75)'}, |
| 48 {at: 1, is: '100px'}, |
| 49 {at: 1.25, is: 'calc(0% + 125)'} |
| 50 ]); |
| 51 assertAttributeInterpolation({ |
| 52 property: 'cy', |
| 53 from: '10%', |
| 54 to: 'calc(10% + 100px)' |
| 55 }, [ |
| 56 {at: -0.25, is: 'calc(10% + -25px)'}, |
| 57 {at: 0, is: '10%'}, |
| 58 {at: 0.25, is: 'calc(10% + 25px)'}, |
| 59 {at: 0.5, is: 'calc(10% + 50px)'}, |
| 60 {at: 0.75, is: 'calc(10% + 75px)'}, |
| 61 {at: 1, is: 'calc(10% + 100px)'}, |
| 62 {at: 1.25, is: 'calc(10% + 125px)'} |
| 63 ]); |
| 64 assertAttributeInterpolation({ |
| 65 property: 'cy', |
| 66 from: 'calc(50% - 25px)', |
| 67 to: 'calc(100% - 10px)' |
| 68 }, [ |
| 69 {at: -0.25, is: 'calc(((50% - 25px) * 1.25) + ((100% - 10px) * -0.25))'}, |
| 70 {at: 0, is: 'calc(50% - 25px)'}, |
| 71 {at: 0.25, is: 'calc(((50% - 25px) * 0.75) + ((100% - 10px) * 0.25))'}, |
| 72 {at: 0.5, is: 'calc(((50% - 25px) * 0.5) + ((100% - 10px) * 0.5))'}, |
| 73 {at: 0.75, is: 'calc(((50% - 25px) * 0.25) + ((100% - 10px) * 0.75))'}, |
| 74 {at: 1, is: 'calc(100% - 10px)'}, |
| 75 {at: 1.25, is: 'calc(((50% - 25px) * -0.25) + ((100% - 10px) * 1.25))'} |
| 76 ]); |
| 77 assertAttributeInterpolation({ |
| 78 property: 'cy', |
| 79 from: 'calc(10mm + 0in)', |
| 80 to: 'calc(10mm + 100in)' |
| 81 }, [ |
| 82 {at: -0.25, is: 'calc(10mm + -25in)'}, |
| 83 {at: 0, is: '10mm'}, |
| 84 {at: 0.25, is: 'calc(10mm + 25in)'}, |
| 85 {at: 0.5, is: 'calc(10mm + 50in)'}, |
| 86 {at: 0.75, is: 'calc(10mm + 75in)'}, |
| 87 {at: 1, is: 'calc(10mm + 100in)'}, |
| 88 {at: 1.25, is: 'calc(10mm + 125in)'} |
| 89 ]); |
| 90 </script> |
| 91 </body> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 2097383002:
Added support of calc() for SVGLength (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master