animate-fill-freeze-with-repeatDur.html (1330B)
1 <!doctype html> 2 <html> 3 <meta charset="utf-8"> 4 <title>Test for animation freeze when repeatDur is not a multiple of dur</title> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <script src="/resources/SVGAnimationTestCase-testharness.js"></script> 8 9 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> 10 <rect x='0' y='0' width='50' height='50' fill='green'> 11 <animate id="anim" attributeName='x' from='0' to='100' dur='4s' begin='0s' repeatDur="6s" accumulate="sum" fill='freeze'/> 12 </rect> 13 </svg> 14 15 <script> 16 var rootSVGElement = document.querySelector("svg"); 17 var epsilon = 1.0; 18 19 // Setup animation test 20 function sample1() { 21 assert_approx_equals(rect1.x.animVal.value, 0, epsilon); 22 assert_equals(rect1.x.baseVal.value, 0); 23 } 24 25 function sample2() { 26 assert_approx_equals(rect1.x.animVal.value, 150, epsilon); 27 assert_equals(rect1.x.baseVal.value, 0); 28 } 29 30 smil_async_test((t) => { 31 var rects = rootSVGElement.ownerDocument.getElementsByTagName("rect"); 32 rect1 = rects[0]; 33 34 const expectedValues = [ 35 // [animationId, time, sampleCallback] 36 ["anim", 0.0, sample1], 37 ["anim", 6.0, sample2] 38 ]; 39 40 runAnimationTest(t, expectedValues); 41 }); 42 43 window.animationStartsImmediately = true; 44 45 </script>