cross-container-3.xhtml (2183B)
1 <?xml version="1.0" encoding="UTF-8" ?> 2 <html xmlns="http://www.w3.org/1999/xhtml" class="reftest-wait"> 3 <!-- 4 Check that calls to beginElement cause the pause time to be updated. 5 6 This is an area that's underspecified so we're just going with what's 7 intuitive. A is supposed to start at the same time as B. However, whilst B is 8 paused, a script calls 'beginElement'. Yet A is not paused. Intuitively, 9 A should start at the time beginElement is called. However, unless we handle 10 this situation specifically, what happens instead is that A is considered to 11 begin at the time when B was paused as follows: 12 13 14 Document time: 15 0 1 2 3 4 ... 16 A: 17 B: |.......*.......... 18 ^ Pause starts here 19 ^ beginElement called here 20 21 Intuitively, A should start at t=2s, not t=1s. To provide this behaviour we 22 must specifically handle it. 23 24 Perhaps a more fundamental question is whether a call to beginElement should 25 take effect whilst the document is paused. Currently it does. This is 26 consistent with Opera but not Safari. 27 --> 28 <head> 29 <script> 30 function snapshot() { 31 var svgb = document.getElementById("svg-b"); 32 svgb.pauseAnimations(); 33 setTimeout('snapshotB()', 100); 34 } 35 36 function snapshotB() { 37 var svga = document.getElementById("svg-a"); 38 svga.pauseAnimations(); 39 var b = document.getElementById("b"); 40 b.beginElement(); 41 // Force a sample on the first document fragment before taking a snapshot 42 svga.setCurrentTime(svga.getCurrentTime()); 43 document.documentElement.removeAttribute("class"); 44 } 45 46 document.addEventListener("MozReftestInvalidate", snapshot, false); 47 setTimeout(snapshot, 4000); // fallback for running outside reftest 48 49 </script> 50 </head> 51 <body> 52 <svg xmlns="http://www.w3.org/2000/svg" width="120px" height="120px" id="svg-a"> 53 <rect width="100" height="100" fill="orange"> 54 <animate attributeName="fill" attributeType="CSS" id="a" 55 values="green; red" 56 begin="b.begin" dur="0.5s"/> 57 </rect> 58 </svg> 59 <svg xmlns="http://www.w3.org/2000/svg" width="120px" height="120px" id="svg-b"> 60 <set attributeName="y" to="0" begin="indefinite" id="b"/> 61 </svg> 62 </body> 63 </html>