font-face-src-tech.html (5456B)
1 <!DOCTYPE html> 2 <title>CSS Fonts 4 test: parsing the tech() function in the src descriptor</title> 3 <link rel="help" href="https://drafts.csswg.org/css-fonts/#font-face-src-parsing"> 4 <script src="/resources/testharness.js"></script> 5 <script src="/resources/testharnessreport.js"></script> 6 <style id="testStyle"> 7 </style> 8 <script> 9 const sheet = testStyle.sheet; 10 tests = [ 11 // No tech() function 12 { src: 'url("foo.ttf")', valid: true }, 13 // Empty tech() is not valid 14 { src: 'url("foo.ttf") tech()', valid: false }, 15 // Check that each valid keyword is accepted 16 { src: 'url("foo.ttf") tech(features-opentype)', valid: true }, 17 { src: 'url("foo.ttf") tech(features-aat)', valid: true }, 18 { src: 'url("foo.ttf") tech(color-COLRv0)', valid: true }, 19 { src: 'url("foo.ttf") tech(color-COLRv1)', valid: true }, 20 { src: 'url("foo.ttf") tech(color-sbix)', valid: true }, 21 { src: 'url("foo.ttf") tech(color-CBDT)', valid: true }, 22 { src: 'url("foo.ttf") tech(variations)', valid: true }, 23 { src: 'url("foo.ttf") tech(palettes)', valid: true }, 24 // tech() does not accept strings (unlike format()!) 25 { src: 'url("foo.ttf") tech("features-opentype")', valid: false }, 26 { src: 'url("foo.ttf") tech("color-COLRv0")', valid: false }, 27 { src: 'url("foo.ttf") tech("variations")', valid: false }, 28 // tech() accepts a comma-separated list of keywords 29 { src: 'url("foo.ttf") tech(features-opentype, color-COLRv0, variations, palettes)', valid: true }, 30 { src: 'url("foo.ttf") tech(features-opentype color-COLRv0 variations palettes)', valid: false }, 31 // Invalid font-tech keywords should be a parse error 32 { src: 'url("foo.ttf") tech(feature-opentype)', valid: false }, 33 { src: 'url("foo.ttf") tech(feature-aat)', valid: false }, 34 { src: 'url("foo.ttf") tech(feature-graphite)', valid: false }, 35 { src: 'url("foo.ttf") tech(auto)', valid: false }, 36 { src: 'url("foo.ttf") tech(default)', valid: false }, 37 { src: 'url("foo.ttf") tech(inherit)', valid: false }, 38 { src: 'url("foo.ttf") tech(initial)', valid: false }, 39 { src: 'url("foo.ttf") tech(none)', valid: false }, 40 { src: 'url("foo.ttf") tech(normal)', valid: false }, 41 { src: 'url("foo.ttf") tech(xyzzy)', valid: false }, 42 { src: 'url("foo.ttf") tech(xyzzy, features-opentype)', valid: false }, 43 { src: 'url("foo.ttf") tech(features-opentype, xyzzy)', valid: false }, 44 // format() function must precede tech() if both are present 45 { src: 'url("foo.ttf") format(opentype) tech(features-opentype)', valid: true }, 46 { src: 'url("foo.ttf") tech(features-opentype) format(opentype)', valid: false }, 47 // Unsupported technology (for example: no browser has incremental transfer yet), might be 48 // dropped from the list, next component of the list should be accepted. 49 { src: 'url("foo.ttf") tech(incremental), url("bar.html")', dontcomparetech: true, valid: true }, 50 { src: 'url("foo.ttf") tech(incremental, color-SVG, features-graphite, features-aat), url("bar.html")', dontcomparetech: true, valid: true }, 51 { src: 'url("foo.ttf") tech(color-SVG, features-graphite), url("bar.html")', dontcomparetech: true, valid: true }, 52 { src: 'url("foo.ttf") tech(color-SVG), url("bar.html")', dontcomparetech: true, valid: true }, 53 { src: 'url("foo.ttf") tech(features-graphite), url("bar.html")', dontcomparetech: true, valid: true }, 54 // No invalid functions. 55 { src: 'url("foo.ttf") dummy("opentype") tech(variations)', valid: false }, 56 { src: 'url("foo.ttf") dummy("opentype") dummy(variations)', valid: false }, 57 { src: 'url("foo.ttf") format(opentype) tech(features-opentype) dummy(something)', valid: false }, 58 // A parsing error in one component does not make the entire descriptor invalid. 59 { src: 'url("foo.ttf") format(dummy), url("foo.ttf") tech(variations)', valid: true }, 60 // check_same_tech isn't currently smart enough to handle this. 61 { src: 'url("foo.ttf") tech(color), url("bar.html")', dontcomparetech: true, valid: true }, 62 ]; 63 64 // Assert that the two arguments have the same set of keywords in the tech() function, 65 // (although their ordering may differ). 66 function check_same_tech(serialized, specified) { 67 if (!specified.includes("tech(")) { 68 assert_false(serialized.includes("tech("), "expected no tech() function"); 69 return; 70 } 71 // Extract the lists of tech() keywords and sort them for comparison. 72 const tech = /tech\((.+)\)/; 73 var specified_techs = tech.exec(specified)[1].split(/,\s*/).sort().join(", "); 74 var serialized_techs = tech.exec(serialized)[1].split(/,\s*/).sort().join(", "); 75 // Per CSSOM spec, keywords are serialized in ASCII-lowercase form: 76 // https://drafts.csswg.org/cssom/#serialize-a-css-component-value 77 assert_equals(serialized_techs, specified_techs.toLowerCase(), "expected matching tech() lists"); 78 } 79 80 for (let t of tests) { 81 test(() => { 82 assert_equals(sheet.cssRules.length, 0, "testSheet should initially be empty"); 83 sheet.insertRule("@font-face { src: " + t.src + "}"); 84 try { 85 assert_equals(sheet.cssRules[0].style.getPropertyValue("src") != "", t.valid); 86 if (t.valid && !t.dontcomparetech) { 87 check_same_tech(sheet.cssRules[0].style.getPropertyValue("src"), t.src); 88 } 89 } finally { 90 sheet.deleteRule(0); 91 } 92 }, "Check that src: " + t.src + " is " + (t.valid ? "valid" : "invalid")); 93 } 94 </script>