OLD | NEW |
| (Empty) |
1 <!DOCTYPE html> | |
2 <title>SVG Web Animations should be responsive to changes in the underlying valu
e</title> | |
3 <script src="../resources/testharness.js"></script> | |
4 <script src="../resources/testharnessreport.js"></script> | |
5 <script> | |
6 // offset has a primitive animVal type. | |
7 function createOffsetTestTarget() { | |
8 var target = document.createElementNS('http://www.w3.org/2000/svg', 'stop'); | |
9 target.setAttribute('offset', '0'); | |
10 var animation = target.animate({'svg-offset': '1'}, 1); | |
11 animation.pause(); | |
12 animation.currentTime = 0.5; | |
13 assert_equals(target.getAttribute('offset'), '0.5', 'Initial getAttribute()'); | |
14 assert_equals(target.offset.animVal, 0.5, 'Initial get animVal'); | |
15 return target; | |
16 } | |
17 | |
18 test(() => { | |
19 var target = createOffsetTestTarget(); | |
20 target.setAttribute('offset', '0.5'); | |
21 assert_equals(target.getAttribute('offset'), '0.75'); | |
22 }, document.title + ': setAttribute() -> getAttribute()'); | |
23 | |
24 test(() => { | |
25 var target = createOffsetTestTarget(); | |
26 target.setAttribute('offset', '0.5'); | |
27 assert_equals(target.offset.animVal, 0.75); | |
28 }, document.title + ': setAttribute() -> get primitive animVal'); | |
29 | |
30 test(() => { | |
31 var target = createOffsetTestTarget(); | |
32 target.offset.baseVal = '0.5'; | |
33 assert_equals(target.getAttribute('offset'), '0.75'); | |
34 }, document.title + ': set baseVal -> getAttribute()'); | |
35 | |
36 test(() => { | |
37 var target = createOffsetTestTarget(); | |
38 target.offset.baseVal = '0.5'; | |
39 assert_equals(target.offset.animVal, 0.75); | |
40 }, document.title + ': set baseVal -> get primitive animVal'); | |
41 | |
42 | |
43 function serializeRect(rect) { | |
44 return [rect.x, rect.y, rect.width, rect.height].join(' '); | |
45 } | |
46 | |
47 // viewBox has a tear-off animVal type. | |
48 function createViewBoxTestTarget() { | |
49 var target = document.createElementNS('http://www.w3.org/2000/svg', 'marker'); | |
50 target.setAttribute('viewBox', '0 0 0 0'); | |
51 var animation = target.animate({'svg-viewBox': '1 1 1 1'}, 1); | |
52 animation.pause(); | |
53 animation.currentTime = 0.5; | |
54 assert_equals(target.getAttribute('viewBox'), '0.5 0.5 0.5 0.5', 'Initial getA
ttribute()'); | |
55 assert_equals(serializeRect(target.viewBox.animVal), '0.5 0.5 0.5 0.5', 'Initi
al get animVal'); | |
56 return target; | |
57 } | |
58 | |
59 test(() => { | |
60 var target = createViewBoxTestTarget(); | |
61 var animVal = target.viewBox.animVal; | |
62 target.setAttribute('viewBox', '0.5 0.5 0.5 0.5'); | |
63 assert_equals(serializeRect(animVal), '0.75 0.75 0.75 0.75'); | |
64 }, document.title + ': setAttribute() -> read tear-off animVal'); | |
65 | |
66 test(() => { | |
67 var target = createViewBoxTestTarget(); | |
68 var animVal = target.viewBox.animVal; | |
69 var baseVal = target.viewBox.baseVal; | |
70 baseVal.x = 0.5; | |
71 baseVal.y = 0.5; | |
72 baseVal.width = 0.5; | |
73 baseVal.height = 0.5; | |
74 assert_equals(serializeRect(animVal), '0.75 0.75 0.75 0.75'); | |
75 }, document.title + ': set baseVal -> read tear-off animVal'); | |
76 </script> | |
OLD | NEW |