dom/smil/test/test_smilValues.xhtml

branch
TOR_BUG_9701
changeset 15
b8a032363ba2
equal deleted inserted replaced
-1:000000000000 0:c972c44523a2
1 <html xmlns="http://www.w3.org/1999/xhtml">
2 <head>
3 <title>Test for SMIL values</title>
4 <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
5 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
6 </head>
7 <body>
8 <a target="_blank"
9 href="https://bugzilla.mozilla.org/show_bug.cgi?id=557885">Mozilla Bug
10 474742</a>
11 <p id="display"></p>
12 <div id="content" style="display: none">
13 <svg id="svg" xmlns="http://www.w3.org/2000/svg" width="120px" height="120px">
14 <circle cx="-100" cy="20" r="15" fill="blue" id="circle"/>
15 </svg>
16 </div>
17 <pre id="test">
18 <script class="testbody" type="text/javascript">
19 <![CDATA[
20 /** Test for SMIL values **/
21
22 var gSvg = document.getElementById("svg");
23 SimpleTest.waitForExplicitFinish();
24
25 function main()
26 {
27 gSvg.pauseAnimations();
28
29 var testCases = Array();
30
31 // Single value
32 testCases.push({
33 'attr' : { 'values': 'a' },
34 'times': [ [ 0, 'a' ] ]
35 });
36
37 // The parsing below is based on the following discussion:
38 //
39 // http://lists.w3.org/Archives/Public/www-svg/2011Nov/0136.html
40 //
41 // In summary:
42 // * Values lists are semi-colon delimited and semi-colon terminated.
43 // * However, if there are extra non-whitespace characters after the final
44 // semi-colon then there's an implied semi-colon at the end.
45 //
46 // This differs to what is specified in SVG 1.1 but is consistent with the
47 // majority of browsers and with existing content (particularly that generated
48 // by Ikivo Animator).
49
50 // Trailing semi-colon
51 testCases.push({
52 'attr' : { 'values': 'a;' },
53 'times': [ [ 0, 'a' ], [ 10, 'a' ] ]
54 });
55
56 // Trailing semi-colon + whitespace
57 testCases.push({
58 'attr' : { 'values': 'a; ' },
59 'times': [ [ 0, 'a' ], [ 10, 'a' ] ]
60 });
61
62 // Whitespace + trailing semi-colon
63 testCases.push({
64 'attr' : { 'values': 'a ;' },
65 'times': [ [ 0, 'a' ], [ 10, 'a' ] ]
66 });
67
68 // Empty at end
69 testCases.push({
70 'attr' : { 'values': 'a;;' },
71 'times': [ [ 0, 'a' ], [ 5, '' ], [ 10, '' ] ]
72 });
73
74 // Empty at end + whitespace
75 testCases.push({
76 'attr' : { 'values': 'a;; ' },
77 'times': [ [ 0, 'a' ], [ 4, 'a' ], [ 5, '' ], [ 10, '' ] ]
78 });
79
80 // Empty in middle
81 testCases.push({
82 'attr' : { 'values': 'a;;b' },
83 'times': [ [ 0, 'a' ], [ 5, '' ], [ 10, 'b' ] ]
84 });
85
86 // Empty in middle + trailing semi-colon
87 testCases.push({
88 'attr' : { 'values': 'a;;b;' },
89 'times': [ [ 0, 'a' ], [ 5, '' ], [ 10, 'b' ] ]
90 });
91
92 // Whitespace in middle
93 testCases.push({
94 'attr' : { 'values': 'a; ;b' },
95 'times': [ [ 0, 'a' ], [ 5, '' ], [ 10, 'b' ] ]
96 });
97
98 // Empty at start
99 testCases.push({
100 'attr' : { 'values': ';a' },
101 'times': [ [ 0, '' ], [ 5, 'a' ], [ 10, 'a' ] ]
102 });
103
104 // Whitespace at start
105 testCases.push({
106 'attr' : { 'values': ' ;a' },
107 'times': [ [ 0, '' ], [ 5, 'a' ], [ 10, 'a' ] ]
108 });
109
110 // Embedded whitespace
111 testCases.push({
112 'attr' : { 'values': ' a b ; c d ' },
113 'times': [ [ 0, 'a b' ], [ 5, 'c d' ], [ 10, 'c d' ] ]
114 });
115
116 // Whitespace only
117 testCases.push({
118 'attr' : { 'values': ' ' },
119 'times': [ [ 0, '' ], [ 10, '' ] ]
120 });
121
122 for (var i = 0; i < testCases.length; i++) {
123 gSvg.setCurrentTime(0);
124 var test = testCases[i];
125
126 // Create animation elements
127 var anim = createAnim(test.attr);
128
129 // Run samples
130 for (var j = 0; j < test.times.length; j++) {
131 var curSample = test.times[j];
132 gSvg.setCurrentTime(curSample[0]);
133 checkSample(anim, curSample[1], curSample[0], i);
134 }
135
136 anim.parentNode.removeChild(anim);
137 }
138
139 SimpleTest.finish();
140 }
141
142 function createAnim(attr)
143 {
144 const svgns = "http://www.w3.org/2000/svg";
145 var anim = document.createElementNS(svgns, 'animate');
146 anim.setAttribute('attributeName','class');
147 anim.setAttribute('dur','10s');
148 anim.setAttribute('begin','0s');
149 anim.setAttribute('fill','freeze');
150 for (name in attr) {
151 anim.setAttribute(name, attr[name]);
152 }
153 return document.getElementById('circle').appendChild(anim);
154 }
155
156 function checkSample(anim, expectedValue, sampleTime, caseNum)
157 {
158 var msg = "Test case " + caseNum +
159 " (values: '" + anim.getAttribute('values') + "')," +
160 "t=" + sampleTime +
161 ": Unexpected sample value:";
162 is(anim.targetElement.className.animVal, expectedValue, msg);
163 }
164
165 window.addEventListener("load", main, false);
166 ]]>
167 </script>
168 </pre>
169 </body>
170 </html>

mercurial