test_smilSyncTransform.xhtml (1869B)
1 <html xmlns="http://www.w3.org/1999/xhtml"> 2 <head> 3 <title>Test for SMIL sync behaviour for transform types</title> 4 <script src="/tests/SimpleTest/SimpleTest.js"></script> 5 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" /> 6 </head> 7 <body> 8 <p id="display"></p> 9 <div id="content" style="display: none"> 10 <svg id="svg" xmlns="http://www.w3.org/2000/svg" width="120px" height="120px"> 11 <circle cx="20" cy="20" r="15" fill="blue"> 12 <animateTransform attributeName="transform" type="rotate" 13 from="90" to="180" begin="0s" dur="2s" fill="freeze" 14 additive="sum" id="anim1"/> 15 </circle> 16 <circle cx="20" cy="20" r="15" fill="blue"> 17 <animateTransform attributeName="transform" type="scale" 18 from="1" to="2" begin="2s" dur="2s" id="anim2"/> 19 </circle> 20 </svg> 21 </div> 22 <pre id="test"> 23 <script class="testbody" type="text/javascript"> 24 <![CDATA[ 25 /** Test for SMIL sync behavior for transform types */ 26 27 /* Global Variables */ 28 var svg = document.getElementById("svg"); 29 30 SimpleTest.waitForExplicitFinish(); 31 32 function main() { 33 testChangeBaseVal(document.getElementById("anim1")); 34 SimpleTest.finish(); 35 } 36 37 function testChangeBaseVal(anim) { 38 // Check that a change to the base value is updated even after animation is 39 // frozen 40 41 var target = anim.targetElement; 42 43 var baseList = target.transform.baseVal; 44 var animList = target.transform.animVal; 45 46 // make sure element has ended 47 svg.setCurrentTime(anim.getSimpleDuration()); 48 49 // check frozen value is applied 50 is(baseList.numberOfItems, 0); 51 is(animList.numberOfItems, 1); 52 53 // change base val and re-check 54 var newTransform = svg.createSVGTransform(); 55 newTransform.setScale(1,2); 56 baseList.appendItem(newTransform); 57 is(baseList.numberOfItems, 1); 58 is(animList.numberOfItems, 2); 59 } 60 61 window.addEventListener("load", main); 62 ]]> 63 </script> 64 </pre> 65 </body> 66 </html>