OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <head> | 3 <head> |
4 <title>Geometry Interfaces: DOMMatrix and DOMMatrixReadOnly constructors</ti
tle> | 4 <title>Geometry Interfaces: DOMMatrix and DOMMatrixReadOnly constructors</ti
tle> |
5 <link rel="author" title="Dirk Schulze" href="mailto:dschulze@adobe.com" /> | 5 <link rel="author" title="Dirk Schulze" href="mailto:dschulze@adobe.com" /> |
6 <link rel="help" href="http://www.w3.org/TR/geometry-1/#DOMMatrix"> | 6 <link rel="help" href="https://drafts.fxtf.org/geometry/#DOMMatrix"> |
7 <link rel="help" href="http://www.w3.org/TR/geometry-1/#dommatrix-constructo
rs"> | 7 <link rel="help" href="https://drafts.fxtf.org/geometry/#dommatrix-construct
ors"> |
8 <link rel="help" href="http://www.w3.org/TR/geometry-1/#dom-dommatrix-dommat
rix"> | 8 <link rel="help" href="https://drafts.fxtf.org/geometry/#dom-dommatrix-domma
trix"> |
9 <script src="support/dommatrix-test-util.js"></script> | 9 <script src="support/dommatrix-test-util.js"></script> |
10 <script src="/resources/testharness.js"></script> | 10 <script src="/resources/testharness.js"></script> |
11 <script src="/resources/testharnessreport.js"></script> | 11 <script src="/resources/testharnessreport.js"></script> |
12 </head> | 12 </head> |
13 <body> | 13 <body> |
14 <p>Test DOMMatrix and DOMMatrixReadOnly contructors</p> | |
15 <div id="log"></div> | 14 <div id="log"></div> |
16 <script> | 15 <script> |
17 initial = { | 16 var initial = { |
18 m11: 1, m21: 0, m31: 0, m41: 0, | 17 m11: 1, m21: 0, m31: 0, m41: 0, |
19 m12: 0, m22: 1, m32: 0, m42: 0, | 18 m12: 0, m22: 1, m32: 0, m42: 0, |
20 m13: 0, m23: 0, m33: 1, m43: 0, | 19 m13: 0, m23: 0, m33: 1, m43: 0, |
21 m14: 0, m24: 0, m34: 0, m44: 1, | 20 m14: 0, m24: 0, m34: 0, m44: 1, |
22 is2D: true, | 21 is2D: true, |
23 isIdentity: true | 22 isIdentity: true |
24 }; | 23 }; |
25 scaleTranslate2D = { | 24 var scaleTranslate2D = { |
26 m11: 2, m21: 0, m31: 0, m41: 10, | 25 m11: 2, m21: 0, m31: 0, m41: 10, |
27 m12: 0, m22: 2, m32: 0, m42: 10, | 26 m12: 0, m22: 2, m32: 0, m42: 10, |
28 m13: 0, m23: 0, m33: 1, m43: 0, | 27 m13: 0, m23: 0, m33: 1, m43: 0, |
29 m14: 0, m24: 0, m34: 0, m44: 1, | 28 m14: 0, m24: 0, m34: 0, m44: 1, |
30 is2D: false, | 29 is2D: false, |
31 isIdentity: false | 30 isIdentity: false |
32 }; | 31 }; |
| 32 ["DOMMatrix", "DOMMatrixReadOnly"].forEach(function(constr) { |
| 33 test(function() { |
| 34 checkDOMMatrix(new self[constr](), initial); |
| 35 }, `new ${constr}()`); |
33 | 36 |
34 test(function() { | 37 test(function() { |
35 checkDOMMatrix(new DOMMatrix(), initial); | 38 checkDOMMatrix(new self[constr](undefined), initial); |
36 },'testConstructor0'); | 39 }, `new ${constr}(undefined)`); |
37 test(function() { | 40 |
38 checkDOMMatrix(new DOMMatrix(new DOMMatrix()), initial); | 41 test(function() { |
39 },'testConstructor1'); | 42 checkDOMMatrix(new self[constr](new self[constr]()), initial); |
40 test(function() { | 43 }, `new ${constr}(new ${constr}())`); |
41 var float32Array = new Float32Array( | 44 |
42 2.0, 0.0, 0.0, 0.0, | 45 ['none', |
| 46 ' none', |
| 47 'none ', |
| 48 'NONE', |
| 49 'none/**/', |
| 50 '/**/none', |
| 51 '', |
| 52 ].forEach(function(string) { |
| 53 test(function() { |
| 54 checkDOMMatrix(new self[constr](string), initial); |
| 55 }, `new ${constr}(${format_value(string)})`); |
| 56 }); |
| 57 |
| 58 test(function() { |
| 59 var float32Array = new Float32Array( |
| 60 2.0, 0.0, 0.0, 0.0, |
| 61 0.0, 2.0, 0.0, 0.0, |
| 62 0.0, 0.0, 1.0, 0.0, |
| 63 10.0, 10.0, 0.0, 1.0); |
| 64 checkDOMMatrix(new self[constr](float32Array), scaleTranslate2D,
false); |
| 65 }, `new ${constr}(float32Array) 16 elements`); |
| 66 |
| 67 test(function() { |
| 68 var float32Array = new Float32Array(2.0, 0.0, 0.0, 2.0, 10.0, 10
.0); |
| 69 checkDOMMatrix(new self[constr](float32Array), scaleTranslate2D)
; |
| 70 }, `new ${constr}(float32Array) 6 elements`); |
| 71 |
| 72 test(function() { |
| 73 var float64Array = new Float64Array([ |
| 74 2.0, 0.0, 0.0, 0.0, |
| 75 0.0, 2.0, 0.0, 0.0, |
| 76 0.0, 0.0, 1.0, 0.0, |
| 77 10.0, 10.0, 0.0, 1.0]); |
| 78 checkDOMMatrix(new self[constr](float64Array), scaleTranslate2D,
false); |
| 79 }, `new ${constr}(float64Array) 16 elements`); |
| 80 |
| 81 test(function() { |
| 82 var float64Array = new Float64Array(2.0, 0.0, 0.0, 2.0, 10.0, 10
.0); |
| 83 checkDOMMatrix(new self[constr](float64Array), scaleTranslate2D)
; |
| 84 }, `new ${constr}((float64Array) 6 elements`); |
| 85 |
| 86 [ |
| 87 [2.0, 0.0, 0.0, 0.0, |
43 0.0, 2.0, 0.0, 0.0, | 88 0.0, 2.0, 0.0, 0.0, |
44 0.0, 0.0, 1.0, 0.0, | 89 0.0, 0.0, 1.0, 0.0, |
45 10.0, 10.0, 0.0, 1.0); | 90 10.0, 10.0, 0.0, 1.0], |
46 checkDOMMatrix(new DOMMatrix(float32Array), scaleTranslate2D, false)
; | 91 [2.0, 0.0, 0.0, 2.0, 10.0, 10.0], |
47 },'testConstructor2'); | 92 ].forEach(function(sequence) { |
48 test(function() { | 93 test(function() { |
49 var float32Array = new Float32Array(2.0, 0.0, 0.0, 2.0, 10.0, 10.0); | 94 checkDOMMatrix(new self[constr](sequence), scaleTranslate2D,
false); |
50 checkDOMMatrix(new DOMMatrix(float32Array), scaleTranslate2D); | 95 }, `new ${constr}(sequence) ${sequence.length} elements`); |
51 },'testConstructor3'); | 96 }); |
52 test(function() { | 97 |
53 var float64Array = new Float64Array([ | 98 ['scale(2) translateX(5px) translateY(5px)', |
54 2.0, 0.0, 0.0, 0.0, | 99 'scale(2 2) translateX(5) translateY(5)', |
| 100 'scale(2, 2), translateX(5) ,translateY(5)', |
| 101 ].forEach(function(string) { |
| 102 test(function() { |
| 103 checkDOMMatrix(new self[constr](string), scaleTranslate2D); |
| 104 }, `new ${constr}(${format_value(string)})`); |
| 105 }); |
| 106 |
| 107 ['translateX (5px)', |
| 108 'scale(2)translateX(5px)', |
| 109 'translateX(5em)', |
| 110 'translateX(5ex)', |
| 111 'translateX(5ch)', |
| 112 'translateX(5rem)', |
| 113 'translateX(5vw)', |
| 114 'translateX(5vh)', |
| 115 'translateX(5vmin)', |
| 116 'translateX(5vmax)', |
| 117 'translateX(5%)', |
| 118 ' ', |
| 119 '/**/', |
| 120 '\0', |
| 121 ';', |
| 122 'none;', |
| 123 'null', |
| 124 null, // is converted to 'null' by IDL |
| 125 'undefined', |
| 126 'inherit', |
| 127 'initial', |
| 128 'unset', |
| 129 ].forEach(function(string) { |
| 130 test(function() { |
| 131 assert_throws('SyntaxError', function() { new self[constr](s
tring); }); |
| 132 }, `new ${constr}(${format_value(string)})`); |
| 133 }); |
| 134 |
| 135 test(function() { |
| 136 var sequence = [ |
| 137 2.0, 1.0, 0.0, 0.0, |
| 138 1.0, 2.0, 0.0, 0.0, |
| 139 0.0, 0.0, 1.0, 0.0, |
| 140 10.0, 10.0, 0.0, 1.0]; |
| 141 checkDOMMatrix(new self[constr](sequence), { |
| 142 m11: 2, m21: 1, m31: 0, m41: 10, |
| 143 m12: 1, m22: 2, m32: 0, m42: 10, |
| 144 m13: 0, m23: 0, m33: 1, m43: 0, |
| 145 m14: 0, m24: 0, m34: 0, m44: 1, |
| 146 is2D: false, |
| 147 isIdentity: false |
| 148 }); |
| 149 }, `new ${constr}(sequence)`); |
| 150 |
| 151 test(function() { |
| 152 var matrix = new self[constr]([ |
| 153 2.0, 1.0, 0.0, 0.0, |
| 154 1.0, 2.0, 0.0, 0.0, |
| 155 0.0, 0.0, 1.0, 0.0, |
| 156 10.0, 10.0, 0.0, 1.0]); |
| 157 checkDOMMatrix(new self[constr](matrix), { |
| 158 m11: 2, m21: 1, m31: 0, m41: 10, |
| 159 m12: 1, m22: 2, m32: 0, m42: 10, |
| 160 m13: 0, m23: 0, m33: 1, m43: 0, |
| 161 m14: 0, m24: 0, m34: 0, m44: 1, |
| 162 is2D: false, |
| 163 isIdentity: false |
| 164 }); |
| 165 }, `new ${constr}(matrix)`); |
| 166 |
| 167 ['scale(2, 2), translateX(5px) translateY(5px)', |
| 168 ].forEach(function(string) { |
| 169 test(function() { |
| 170 assert_throws("SyntaxError", function() { new self[constr](s
tring); }); |
| 171 }, `new ${constr}(${format_value(string)})`); |
| 172 }); |
| 173 |
| 174 [ |
| 175 [2.0, 0.0, 0.0, 0.0, |
55 0.0, 2.0, 0.0, 0.0, | 176 0.0, 2.0, 0.0, 0.0, |
56 0.0, 0.0, 1.0, 0.0, | 177 0.0, 0.0, 1.0, 0.0, |
57 10.0, 10.0, 0.0, 1.0]); | 178 10.0, 10.0, 0.0, 2.0, 0.0], // 17 elements |
58 checkDOMMatrix(new DOMMatrix(float64Array), scaleTranslate2D, false)
; | 179 [2.0, 0.0, 0.0, 0.0, |
59 },'testConstructor4'); | |
60 test(function() { | |
61 var float64Array = new Float64Array(2.0, 0.0, 0.0, 2.0, 10.0, 10.0); | |
62 checkDOMMatrix(new DOMMatrix(float64Array), scaleTranslate2D); | |
63 },'testConstructor5'); | |
64 test(function() { | |
65 var sequence = [ | |
66 2.0, 0.0, 0.0, 0.0, | |
67 0.0, 2.0, 0.0, 0.0, | 180 0.0, 2.0, 0.0, 0.0, |
68 0.0, 0.0, 1.0, 0.0, | 181 0.0, 0.0, 1.0, 0.0, |
69 10.0, 10.0, 0.0, 1.0]; | 182 10.0, 10.0, 0.0], // 15 elements |
70 checkDOMMatrix(new DOMMatrix(sequence), scaleTranslate2D, false); | 183 [2.0, 0.0, 0.0, 2.0, 10.0], // 5 elements |
71 },'testConstructor6'); | 184 [], // 0 elements |
72 test(function() { | 185 ].forEach(function(sequence) { |
73 var sequence = [ 2.0, 0.0, 0.0, 2.0, 10.0, 10.0]; | 186 test(function() { |
74 checkDOMMatrix(new DOMMatrix(float64Array), scaleTranslate2D); | 187 assert_throws(new TypeError(), function() { new self[constr]
(sequence); }); |
75 },'testConstructor7'); | 188 }, `new ${constr}(sequence) ${sequence.length} elements`); |
76 test(function() { | |
77 var string = 'scale(2) translateX(5px) translateY(5px)'; | |
78 checkDOMMatrix(new DOMMatrix(string), scaleTranslate2D); | |
79 },'testConstructor8'); | |
80 test(function() { | |
81 var string = 'scale(2 2) translateX(5) translateY(5)'; | |
82 checkDOMMatrix(new DOMMatrix(string), scaleTranslate2D); | |
83 },'testConstructor9'); | |
84 test(function() { | |
85 var string = 'scale(2, 2), translateX(5) ,translateY(5)'; | |
86 checkDOMMatrix(new DOMMatrix(string), scaleTranslate2D); | |
87 },'testConstructor10'); | |
88 test(function() { | |
89 assert_throws('SyntaxError', function() { new DOMMatrix('translateX
(5px)'); }); | |
90 assert_throws('SyntaxError', function() { new DOMMatrix('scale(2)tra
nslateX(5px)'); }); | |
91 assert_throws('SyntaxError', function() { new DOMMatrix('translateX(
5em)'); }); | |
92 assert_throws('SyntaxError', function() { new DOMMatrix('translateX(
5ex)'); }); | |
93 assert_throws('SyntaxError', function() { new DOMMatrix('translateX(
5ch)'); }); | |
94 assert_throws('SyntaxError', function() { new DOMMatrix('translateX(
5rem)'); }); | |
95 assert_throws('SyntaxError', function() { new DOMMatrix('translateX(
5vw)'); }); | |
96 assert_throws('SyntaxError', function() { new DOMMatrix('translateX(
5vh)'); }); | |
97 assert_throws('SyntaxError', function() { new DOMMatrix('translateX(
5vmin)'); }); | |
98 assert_throws('SyntaxError', function() { new DOMMatrix('translateX(
5vmax)'); }); | |
99 assert_throws('SyntaxError', function() { new DOMMatrix('translateX(
5%)'); }); | |
100 },'testConstructor11'); | |
101 test(function() { | |
102 var sequence = [ | |
103 2.0, 1.0, 0.0, 0.0, | |
104 1.0, 2.0, 0.0, 0.0, | |
105 0.0, 0.0, 1.0, 0.0, | |
106 10.0, 10.0, 0.0, 1.0]; | |
107 checkDOMMatrix(new DOMMatrix(sequence), { | |
108 m11: 2, m21: 1, m31: 0, m41: 10, | |
109 m12: 1, m22: 2, m32: 0, m42: 10, | |
110 m13: 0, m23: 0, m33: 1, m43: 0, | |
111 m14: 0, m24: 0, m34: 0, m44: 1, | |
112 is2D: false, | |
113 isIdentity: false | |
114 }); | 189 }); |
115 },'testConstructor12'); | 190 }); |
116 test(function() { | |
117 var matrix = new DOMMatrix([ | |
118 2.0, 1.0, 0.0, 0.0, | |
119 1.0, 2.0, 0.0, 0.0, | |
120 0.0, 0.0, 1.0, 0.0, | |
121 10.0, 10.0, 0.0, 1.0]); | |
122 checkDOMMatrix(new DOMMatrix(matrix), { | |
123 m11: 2, m21: 1, m31: 0, m41: 10, | |
124 m12: 1, m22: 2, m32: 0, m42: 10, | |
125 m13: 0, m23: 0, m33: 1, m43: 0, | |
126 m14: 0, m24: 0, m34: 0, m44: 1, | |
127 is2D: false, | |
128 isIdentity: false | |
129 }); | |
130 },'testConstructor13'); | |
131 test(function() { | |
132 assert_throws(new TypeError(), function() { new DOMMatrixReadOnly();
}); | |
133 },'testConstructorIllegal0'); | |
134 test(function() { | |
135 var string = 'scale(2, 2), translateX(5px) translateY(5px)'; | |
136 assert_throws(new TypeError(), function() { new DOMMatrixReadOnly(st
ring); }); | |
137 },'testConstructorIllegal1'); | |
138 test(function() { | |
139 var sequence = [ 2.0, 0.0, 0.0, 2.0, 10.0]; | |
140 assert_throws(new TypeError(), function() { new DOMMatrixReadOnly(se
quence); }); | |
141 },'testConstructorIllegal2'); | |
142 | |
143 </script> | 191 </script> |
144 </body> | 192 </body> |
145 </html> | 193 </html> |
OLD | NEW |