baselineShift.html (1369B)
1 <!DOCTYPE html> 2 <script src="/resources/testharness.js"></script> 3 <script src="/resources/testharnessreport.js"></script> 4 5 <svg> 6 <text> 7 <tspan id='container'> 8 <tspan id='element'></tspan> 9 </tspan> 10 </text> 11 </svg> 12 13 <script> 14 var element = document.getElementById('element'); 15 var container = document.getElementById('container'); 16 17 test(function() { 18 element.style.fontSize = '10px'; 19 var player = element.animate([{baselineShift: '3em'}, {baselineShift: '5em'}], 10); 20 player.pause(); 21 player.currentTime = 5; 22 element.style.fontSize = '20px'; 23 assert_equals(getComputedStyle(element).baselineShift, '80px'); 24 }, 'baselineShift responsive to style changes'); 25 26 test(function() { 27 container.style.baselineShift = 'sub'; 28 var player = element.animate([{baselineShift: 'inherit'}, {baselineShift: '20px'}], 4000); 29 player.pause(); 30 31 player.currentTime = 1000; 32 assert_equals(getComputedStyle(element).baselineShift, 'sub'); 33 34 container.style.baselineShift = 'super'; 35 assert_equals(getComputedStyle(element).baselineShift, 'super'); 36 37 container.style.baselineShift = '100px'; 38 assert_equals(getComputedStyle(element).baselineShift, '80px'); 39 40 container.style.baselineShift = 'sub'; 41 assert_equals(getComputedStyle(element).baselineShift, 'sub'); 42 }, 'baselineShift responsive to inherited changes'); 43 </script>