test_font_face_parser.html (16086B)
1 <!DOCTYPE HTML><html> 2 <!-- https://bugzilla.mozilla.org/show_bug.cgi?id=441469 --> 3 <head> 4 <meta http-equiv="content-type" content="text/html; charset=utf-8"> 5 <title>Test of @font-face parser</title> 6 <script src="/tests/SimpleTest/SimpleTest.js"></script> 7 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"> 8 </head> 9 <body> 10 <p>@font-face parsing (<a 11 target="_blank" 12 href="https://bugzilla.mozilla.org/show_bug.cgi?id=441469" 13 >bug 441469</a>)</p> 14 <pre id="display"></pre> 15 <style type="text/css" id="testbox"></style> 16 <script class="testbody" type="text/javascript"> 17 function runTest() { 18 function _(b) { return "@font-face { " + b + " }"; }; 19 var testset = [ 20 // Complete nonsense - shouldn't make a font-face rule at all. 21 { rule: "@font-face;" }, 22 { rule: "font-face { }" }, 23 { rule: "@fontface { }" }, 24 { rule: "@namespace foo url(http://example.com/foo);" }, 25 26 // Empty rule. 27 { rule: "@font-face { }", d: {} }, 28 { rule: "@font-face {", d: {} }, 29 { rule: "@font-face { ; }", d: {}, noncanonical: true }, 30 31 // Correct font-family. 32 { rule: _("font-family: \"Mouse\";"), d: {"font-family" : "\"Mouse\""} }, 33 { rule: _("font-family: \"Mouse\""), d: {"font-family" : "\"Mouse\""}, 34 noncanonical: true }, 35 { rule: _("font-family: Mouse;"), d: {"font-family" : "Mouse" }, 36 noncanonical: true }, 37 { rule: _("font-family: Mouse"), d: {"font-family" : "Mouse" }, 38 noncanonical: true }, 39 40 // Correct but unusual font-family. 41 { rule: _("font-family: Hoefler Text;"), 42 d: {"font-family" : "Hoefler Text"}, 43 noncanonical: true }, 44 45 // Incorrect font-family. 46 { rule: _("font-family:"), d: {} }, 47 { rule: _("font-family \"Mouse\""), d: {} }, 48 { rule: _("font-family: *"), d: {} }, 49 { rule: _("font-family: Mouse, Rat"), d: {} }, 50 { rule: _("font-family: sans-serif"), d: {} }, 51 52 // Correct font-style. 53 { rule: _("font-style: normal;"), d: {"font-style" : "normal"} }, 54 { rule: _("font-style: italic;"), d: {"font-style" : "italic"} }, 55 { rule: _("font-style: oblique;"), d: {"font-style" : "oblique"} }, 56 57 // Correct font-weight. 58 { rule: _("font-weight: 100;"), d: {"font-weight" : "100"} }, 59 { rule: _("font-weight: 200;"), d: {"font-weight" : "200"} }, 60 { rule: _("font-weight: 300;"), d: {"font-weight" : "300"} }, 61 { rule: _("font-weight: 400;"), d: {"font-weight" : "400"} }, 62 { rule: _("font-weight: 500;"), d: {"font-weight" : "500"} }, 63 { rule: _("font-weight: 600;"), d: {"font-weight" : "600"} }, 64 { rule: _("font-weight: 700;"), d: {"font-weight" : "700"} }, 65 { rule: _("font-weight: 800;"), d: {"font-weight" : "800"} }, 66 { rule: _("font-weight: 900;"), d: {"font-weight" : "900"} }, 67 { rule: _("font-weight: normal;"), d: {"font-weight" : "normal"} }, 68 { rule: _("font-weight: bold;"), d: {"font-weight" : "bold"} }, 69 70 // Incorrect font-weight. 71 { rule: _("font-weight: bolder;"), d: {} }, 72 { rule: _("font-weight: lighter;"), d: {} }, 73 74 // Correct font-stretch. 75 { rule: _("font-stretch: ultra-condensed;"), 76 d: {"font-stretch" : "ultra-condensed"} }, 77 { rule: _("font-stretch: extra-condensed;"), 78 d: {"font-stretch" : "extra-condensed"} }, 79 { rule: _("font-stretch: condensed;"), 80 d: {"font-stretch" : "condensed"} }, 81 { rule: _("font-stretch: semi-condensed;"), 82 d: {"font-stretch" : "semi-condensed"} }, 83 { rule: _("font-stretch: normal;"), 84 d: {"font-stretch" : "normal"} }, 85 { rule: _("font-stretch: semi-expanded;"), 86 d: {"font-stretch" : "semi-expanded"} }, 87 { rule: _("font-stretch: expanded;"), 88 d: {"font-stretch" : "expanded"} }, 89 { rule: _("font-stretch: extra-expanded;"), 90 d: {"font-stretch" : "extra-expanded"} }, 91 { rule: _("font-stretch: ultra-expanded;"), 92 d: {"font-stretch" : "ultra-expanded"} }, 93 94 // Incorrect font-stretch. 95 { rule: _("font-stretch: wider;"), d: {} }, 96 { rule: _("font-stretch: narrower;"), d: {} }, 97 98 // Correct src: 99 { rule: _("src: url(\"/fonts/Mouse\");"), 100 d: { "src" : "url(\"/fonts/Mouse\")" } }, 101 { rule: _("src: url(/fonts/Mouse);"), 102 d: { "src" : "url(\"/fonts/Mouse\")" }, noncanonical: true }, 103 104 { rule: _("src: url(\"/fonts/Mouse\") format(\"truetype\");"), 105 d: { "src" : "url(\"/fonts/Mouse\") format(\"truetype\")" } }, 106 107 { rule: _("src: url(\"/fonts/Mouse\"), url(\"/fonts/Rat\");"), 108 d: { "src" : "url(\"/fonts/Mouse\"), url(\"/fonts/Rat\")" } }, 109 110 { rule: _("src: local(Mouse), url(\"/fonts/Mouse\");"), 111 d: { "src" : "local(Mouse), url(\"/fonts/Mouse\")" }, 112 noncanonical: true }, 113 114 { rule: _("src: local(\"老鼠\"), url(\"/fonts/Mouse\");"), 115 d: { "src" : "local(\"老鼠\"), url(\"/fonts/Mouse\")" } }, 116 117 { rule: _("src: local(\"老鼠\"), url(\"/fonts/Mouse\") format(\"truetype\");"), 118 d: { "src" : "local(\"老鼠\"), url(\"/fonts/Mouse\") format(\"truetype\")" } }, 119 120 { rule: _("src: url(\"/fonts/Mouse\") format(truetype);"), 121 d: { "src" : "url(\"/fonts/Mouse\") format(truetype)" } }, 122 123 // Correct but unusual src: 124 { rule: _("src: local(Hoefler Text);"), 125 d: {"src" : "local(Hoefler Text)"}, noncanonical: true }, 126 127 // Incorrect src: 128 { rule: _("src:"), d: {} }, 129 { rule: _("src: \"/fonts/Mouse\";"), d: {} }, 130 { rule: _("src: /fonts/Mouse;"), d: {} }, 131 { rule: _("src: url(\"/fonts/Mouse\") format(\"truetype\",opentype);"), d: {} }, 132 { rule: _("src: local(*);"), d: {} }, 133 { rule: _("src: format(\"truetype\");"), d: {} }, 134 { rule: _("src: local(Mouse) format(\"truetype\");"), d: {} }, 135 { rule: _("src: local(Mouse, Rat);"), d: {} }, 136 { rule: _("src: local(sans-serif);"), d: {} }, 137 { rule: _("src: url(\"/fonts/Mouse\") format(\"truetype\", \"opentype\");"), d: {} }, 138 139 // Repeated descriptors 140 { rule: _("font-weight: 700; font-weight: 200;"), 141 d: {"font-weight" : "200"}, 142 noncanonical: true }, 143 { rule: _("src: url(\"/fonts/Cat\"); src: url(\"/fonts/Mouse\");"), 144 d: { "src" : "url(\"/fonts/Mouse\")" }, 145 noncanonical: true }, 146 { rule: _("src: local(Cat); src: local(Mouse)"), 147 d: { "src" : "local(Mouse)" }, 148 noncanonical: true }, 149 150 // Correct parenthesis matching for local() 151 { rule: _("src: local(Mouse); src: local(Cat(); src: local(Rat); )"), 152 d: { "src" : "local(Mouse)" }, 153 noncanonical: true }, 154 { rule: _("src: local(Mouse); src: local(\"Cat\"; src: local(Rat); )"), 155 d: { "src" : "local(Mouse)" }, 156 noncanonical: true }, 157 158 // Correct parenthesis matching for format() 159 { rule: _("src: url(\"/fonts/Mouse\"); " + 160 "src: url(\"/fonts/Cat\") format(Cat(); src: local(Rat); )"), 161 d: { "src" : "url(\"/fonts/Mouse\")" }, 162 noncanonical: true }, 163 { rule: _("src: url(\"/fonts/Mouse\"); " + 164 "src: url(\"/fonts/Cat\") format(\"Cat\"; src: local(Rat); )"), 165 d: { "src" : "url(\"/fonts/Mouse\")" }, 166 noncanonical: true }, 167 { rule: _("src: url(\"/fonts/Mouse\"); " + 168 "src: url(\"/fonts/Cat\") format((); src: local(Rat); )"), 169 d: { "src" : "url(\"/fonts/Mouse\")" }, 170 noncanonical: true }, 171 172 // Correct unicode-range: 173 { rule: _("unicode-range: U+A5;"), d: { "unicode-range" : "U+A5" } }, 174 { rule: _("unicode-range: U+00A5;"), 175 d: { "unicode-range" : "U+A5" }, noncanonical: true }, 176 { rule: _("unicode-range: U+00a5;"), 177 d: { "unicode-range" : "U+A5" }, noncanonical: true }, 178 { rule: _("unicode-range: u+00a5;"), 179 d: { "unicode-range" : "U+A5" }, noncanonical: true }, 180 { rule: _("unicode-range: U+0-FF;"), 181 d: { "unicode-range" : "U+0-FF" } }, 182 { rule: _("unicode-range: U+00??;"), 183 d: { "unicode-range" : "U+0-FF" }, noncanonical: true }, 184 { rule: _("unicode-range: U+?"), 185 d: { "unicode-range" : "U+0-F" }, noncanonical: true }, 186 { rule: _("unicode-range: U+590-5ff;"), 187 d: { "unicode-range" : "U+590-5FF" }, noncanonical: true }, 188 189 { rule: _("unicode-range: U+A5, U+4E00-9FFF, U+30??, U+FF00-FF9F;"), 190 d: { "unicode-range" : "U+A5, U+4E00-9FFF, U+3000-30FF, U+FF00-FF9F" }, 191 noncanonical: true }, 192 193 { rule: _("unicode-range: U+104??;"), 194 d: { "unicode-range" : "U+10400-104FF" }, noncanonical: true }, 195 { rule: _("unicode-range: U+320??, U+321??, U+322??, U+323??, U+324??, U+325??;"), 196 d: { "unicode-range" : "U+32000-320FF, U+32100-321FF, U+32200-322FF, U+32300-323FF, U+32400-324FF, U+32500-325FF" }, 197 noncanonical: true }, 198 { rule: _("unicode-range: U+100000-10ABCD;"), 199 d: { "unicode-range" : "U+100000-10ABCD" } }, 200 { rule: _("unicode-range: U+0121 , U+1023"), 201 d: { "unicode-range" : "U+121, U+1023" }, noncanonical: true }, 202 { rule: _("unicode-range: U+0121/**/, U+1023"), 203 d: { "unicode-range" : "U+121, U+1023" }, noncanonical: true }, 204 205 // Incorrect unicode-range: 206 { rule: _("unicode-range:"), d: {} }, 207 { rule: _("unicode-range: U+"), d: {} }, 208 { rule: _("unicode-range: U+8FFFFFFF"), d: {} }, 209 { rule: _("unicode-range: U+8FFF-7000"), d: {} }, 210 { rule: _("unicode-range: U+8F??-9000"), d: {} }, 211 { rule: _("unicode-range: U+9000-9???"), d: {} }, 212 { rule: _("unicode-range: U+??00"), d: {} }, 213 { rule: _("unicode-range: U+12345678?"), d: {} }, 214 { rule: _("unicode-range: U+1????????"), d: {} }, 215 { rule: _("unicode-range: twelve"), d: {} }, 216 { rule: _("unicode-range: 1000"), d: {} }, 217 { rule: _("unicode-range: 13??"), d: {} }, 218 { rule: _("unicode-range: 1300-1377"), d: {} }, 219 { rule: _("unicode-range: U-1000"), d: {} }, 220 { rule: _("unicode-range: U+nnnn"), d: {} }, 221 { rule: _("unicode-range: U+0121 U+1023"), d: {} }, 222 { rule: _("unicode-range: U+ 0121"), d: {} }, 223 { rule: _("unicode-range: U +0121"), d: {} }, 224 { rule: _("unicode-range: U+0121-"), d: {} }, 225 { rule: _("unicode-range: U+0121- 1023"), d: {} }, 226 { rule: _("unicode-range: U+0121 -1023"), d: {} }, 227 { rule: _("unicode-range: U+012 ?"), d: {} }, 228 { rule: _("unicode-range: U+01 2?"), d: {} }, 229 { rule: _("unicode-range: U+A0000-12FFFF"), d: {} }, 230 { rule: _("unicode-range: U+??????"), d: {} }, 231 232 // Thorough test of seven-digit rejection: all these are syntax errors 233 { rule: _("unicode-range: U+1034560, U+A5"), d: {} }, 234 { rule: _("unicode-range: U+1034569, U+A5"), d: {} }, 235 { rule: _("unicode-range: U+103456a, U+A5"), d: {} }, 236 { rule: _("unicode-range: U+103456f, U+A5"), d: {} }, 237 { rule: _("unicode-range: U+103456?, U+A5"), d: {} }, 238 { rule: _("unicode-range: U+103456-1034560, U+A5"), d: {} }, 239 { rule: _("unicode-range: U+103456-1034569, U+A5"), d: {} }, 240 { rule: _("unicode-range: U+103456-103456a, U+A5"), d: {} }, 241 { rule: _("unicode-range: U+103456-103456f, U+A5"), d: {} }, 242 243 // Syntactically invalid unicode-range tokens invalidate the 244 // entire descriptor 245 { rule: _("unicode-range: U+1, U+2, U+X"), d: {} }, 246 { rule: _("unicode-range: U+A5, U+0?F"), d: {} }, 247 { rule: _("unicode-range: U+A5, U+0F?-E00"), d: {} }, 248 249 // Descending ranges and ranges outside 0-10FFFF are invalid 250 { rule: _("unicode-range: U+A5, U+90-30"), d: {} }, 251 { rule: _("unicode-range: U+A5, U+220043"), d: {} }, 252 253 // font-feature-settings 254 { rule: _("font-feature-settings: normal;"), 255 d: { "font-feature-settings" : "normal" } }, 256 { rule: _("font-feature-settings: \"dlig\";"), 257 d: { "font-feature-settings" : "\"dlig\"" } }, 258 { rule: _("font-feature-settings: \"dlig\" 1;"), 259 d: { "font-feature-settings" : "\"dlig\"" }, noncanonical: true }, 260 { rule: _("font-feature-settings: 'dlig' 1"), 261 d: { "font-feature-settings" : "\"dlig\"" }, noncanonical: true }, 262 263 // incorrect font-feature-settings 264 { rule: _("font-feature-settings: dlig 1"), d: {} }, 265 { rule: _("font-feature-settings: none;"), d: {} }, 266 { rule: _("font-feature-settings: 0;"), d: {} }, 267 { rule: _("font-feature-settings: 3.14;"), d: {} }, 268 { rule: _("font-feature-settings: 'blah' 3.14;"), d: {} }, 269 { rule: _("font-feature-settings: 'dlig' 1 'hist' 0;"), d: {} }, 270 { rule: _("font-feature-settings: 'dlig=1,hist=1'"), d: {} }, 271 272 // font-language-override: 273 { rule: _("font-language-override: normal;"), 274 d: { "font-language-override" : "normal" } }, 275 { rule: _("font-language-override: \"TRK\";"), 276 d: { "font-language-override" : "\"TRK\"" } }, 277 { rule: _("font-language-override: 'TRK'"), 278 d: { "font-language-override" : "\"TRK\"" }, noncanonical: true }, 279 280 // incorrect font-language-override 281 { rule: _("font-language-override: TRK"), d: {} }, 282 { rule: _("font-language-override: none;"), d: {} }, 283 { rule: _("font-language-override: 0;"), d: {} }, 284 { rule: _("font-language-override: #999;"), d: {} }, 285 { rule: _("font-language-override: 'TRK' 'SRB'"), d: {} }, 286 { rule: _("font-language-override: 'TRK', 'SRB'"), d: {} }, 287 288 // font-display: 289 { rule: _("font-display: auto;"), 290 d: { "font-display" : "auto" } }, 291 { rule: _("font-display: block;"), 292 d: { "font-display" : "block" } }, 293 { rule: _("font-display: swap;"), 294 d: { "font-display" : "swap" } }, 295 { rule: _("font-display: fallback;"), 296 d: { "font-display" : "fallback" } }, 297 { rule: _("font-display: optional;"), 298 d: { "font-display" : "optional" } }, 299 300 // incorrect font-display 301 { rule: _("font-display: hidden"), d: {} }, 302 { rule: _("font-display: swap 3"), d: {} }, 303 { rule: _("font-display: block 2 swap 0"), d: {} }, 304 { rule: _("font-display: all"), d: {} }, 305 ]; 306 307 var display = document.getElementById("display"); 308 var sheet = document.styleSheets[1]; 309 310 for (var curTest = 0; curTest < testset.length; curTest++) { 311 try { 312 while(sheet.cssRules.length > 0) 313 sheet.deleteRule(0); 314 sheet.insertRule(testset[curTest].rule, 0); 315 } catch (e) { 316 ok( 317 e.name == "SyntaxError" 318 && e instanceof DOMException 319 && e.code == DOMException.SYNTAX_ERR 320 && !('d' in testset[curTest]), 321 testset[curTest].rule + " syntax error thrown - " + e 322 ); 323 } 324 325 try { 326 if (testset[curTest].d) { 327 is(sheet.cssRules.length, 1, 328 testset[curTest].rule + " rule count"); 329 is(sheet.cssRules[0].type, 5 /*FONT_FACE_RULE*/, 330 testset[curTest].rule + " rule type"); 331 332 var d = testset[curTest].d; 333 var s = sheet.cssRules[0].style; 334 var n = 0; 335 336 is(s.getPropertyValue("pointless"), "", "Unknown descriptors don't assert"); 337 338 // everything is set that should be 339 for (var name in d) { 340 is(s.getPropertyValue(name), d[name], 341 testset[curTest].rule + " (prop " + name + ")"); 342 n++; 343 } 344 // nothing else is set 345 is(s.length, n, testset[curTest].rule + "prop count"); 346 for (var i = 0; i < s.length; i++) { 347 ok( 348 s[i] in d, 349 testset[curTest].rule + 350 " - Unexpected item #" + i + ": " + s[i] 351 ); 352 } 353 354 // round-tripping of cssText 355 // this is a strong test; it's okay if the exact serialization 356 // changes in the future 357 if (n && !testset[curTest].noncanonical) { 358 is(sheet.cssRules[0].cssText.replace(/[ \n]+/g, " "), 359 testset[curTest].rule, 360 testset[curTest].rule + " rule text"); 361 } 362 } else { 363 if (sheet.cssRules.length == 0) { 364 is(sheet.cssRules.length, 0, 365 testset[curTest].rule + " rule count (0)"); 366 } else { 367 is(sheet.cssRules.length, 1, 368 testset[curTest].rule + " rule count (1 non-fontface)"); 369 isnot(sheet.cssRules[0].type, 5 /*FONT_FACE_RULE*/, 370 testset[curTest].rule + " rule type (1 non-fontface)"); 371 } 372 } 373 } catch (e) { 374 ok(false, testset[curTest].rule + " - During test: " + e); 375 } 376 } 377 SimpleTest.finish(); 378 } 379 380 SimpleTest.waitForExplicitFinish(); 381 382 runTest(); 383 384 </script> 385 </body> 386 </html>