CSSFontFeatureValuesRule.html (6129B)
1 <!DOCTYPE html> 2 <meta charset="utf-8" /> 3 <title>CSSOM - CSSFontFeatureValuesRule interface</title> 4 <link 5 rel="help" 6 href="https://drafts.csswg.org/css-fonts-4/#om-fontfeaturevalues" 7 /> 8 <link rel="author" title="Dominik Röttsches" href="drott@chromium.org" /> 9 <meta 10 name="assert" 11 content="CSSFontFeatureValuesRule interface is accessible and supports read and write access." 12 /> 13 <script src="/resources/testharness.js"></script> 14 <script src="/resources/testharnessreport.js"></script> 15 <style></style> 16 <body></body> 17 <script> 18 let rule_initial = ` 19 @font-feature-values test_family { 20 @annotation { 21 the_first: 6; 22 } 23 @styleset { 24 yo: 7; 25 del: 4; 26 di: 10 9 4 5; 27 } 28 } 29 `; 30 31 let rule_added = ` 32 @font-feature-values second_family { 33 @annotation { 34 yabab: 2; 35 yogog: 4; 36 bidib: 5; 37 } 38 } 39 `; 40 41 let rule_overlap = ` 42 @font-feature-values test_family { 43 @annotation { 44 baric: 17; 45 } 46 @ornaments { 47 fooic: 1; 48 } 49 } 50 `; 51 52 function resetStateAndTest(testFunction) { 53 var sheet = document.styleSheets[0]; 54 while (sheet.cssRules.length > 0) sheet.deleteRule(0); 55 sheet.insertRule(rule_initial); 56 testFunction(); 57 } 58 59 test(function () { 60 resetStateAndTest(() => { 61 let rule = document.styleSheets[0].cssRules[0]; 62 assert_equals(rule.type, 14); 63 assert_equals(rule.annotation.size, 1); 64 assert_equals(rule.styleset.size, 3); 65 assert_array_equals(rule.styleset.get("yo"), [7]); 66 assert_array_equals(rule.styleset.get("del"), [4]); 67 assert_array_equals(rule.styleset.get("di"), [10, 9, 4, 5]); 68 assert_array_equals(rule.annotation.get("the_first"), [6]); 69 assert_equals(rule.stylistic.size, 0); 70 assert_equals(rule.swash.size, 0); 71 assert_equals(rule.ornaments.size, 0); 72 assert_equals(rule.characterVariant.size, 0); 73 assert_equals(rule.fontFamily, "test_family"); 74 }); 75 }, "CSSFontFeatureValuesRule is correctly parsed and accessible via CSSOM."); 76 77 test(function () { 78 resetStateAndTest(() => { 79 let family_override = "test_changed_family"; 80 let rule = document.styleSheets[0].cssRules[0]; 81 rule.fontFamily = family_override; 82 let read_rule = document.styleSheets[0].cssRules[0]; 83 assert_equals(read_rule.fontFamily, family_override); 84 }); 85 }, "CSSFontFeatureValuesRule family is settable and readable."); 86 87 test(function () { 88 resetStateAndTest(() => { 89 let rule = document.styleSheets[0].cssRules[0]; 90 let override_number = 43; 91 assert_equals(rule.styleset.get("di").length, 4); 92 rule.styleset.set("di", override_number); 93 assert_array_equals( 94 document.styleSheets[0].cssRules[0].styleset.get("di"), 95 [override_number] 96 ); 97 assert_equals(rule.styleset.size, 3); 98 assert_equals( 99 document.styleSheets[0].cssRules[0].styleset.get("di").length, 100 1 101 ); 102 }); 103 }, "CSSFontFeatureValuesMap entries are settable to single values."); 104 105 test(function () { 106 resetStateAndTest(() => { 107 let rule = document.styleSheets[0].cssRules[0]; 108 let override_sequence = [43, 22]; 109 assert_equals( 110 document.styleSheets[0].cssRules[0].styleset.get("di").length, 111 4 112 ); 113 rule.styleset.set("di", override_sequence); 114 assert_array_equals( 115 document.styleSheets[0].cssRules[0].styleset.get("di"), 116 override_sequence 117 ); 118 assert_equals(document.styleSheets[0].cssRules[0].styleset.size, 3); 119 assert_equals( 120 document.styleSheets[0].cssRules[0].styleset.get("di").length, 121 2 122 ); 123 }); 124 }, "CSSFontFeatureValuesMap entries are settable to sequences of numbers."); 125 126 test(function () { 127 resetStateAndTest(() => { 128 document.styleSheets[0].insertRule(rule_added, 1); 129 assert_equals(document.styleSheets[0].cssRules[1].type, 14); 130 assert_equals(document.styleSheets[0].cssRules[1].annotation.size, 3); 131 }); 132 }, "New rules can be added."); 133 134 test(function () { 135 resetStateAndTest(() => { 136 document.styleSheets[0].insertRule(rule_added, 1); 137 assert_equals(document.styleSheets[0].cssRules[1].annotation.size, 3); 138 document.styleSheets[0].cssRules[1].annotation.delete("yogog"); 139 assert_equals(document.styleSheets[0].cssRules[1].annotation.size, 2); 140 }); 141 }, "Deleting single entries is possible."); 142 143 test(function () { 144 resetStateAndTest(() => { 145 document.styleSheets[0].insertRule(rule_added, 1); 146 assert_equals(document.styleSheets[0].cssRules[1].annotation.size, 3); 147 document.styleSheets[0].cssRules[1].annotation.clear(); 148 assert_equals(document.styleSheets[0].cssRules[1].annotation.size, 0); 149 }); 150 }, "Clearing all entries is possible."); 151 152 test(function () { 153 resetStateAndTest(() => { 154 assert_equals(document.styleSheets[0].cssRules.length, 1); 155 document.styleSheets[0].insertRule(rule_overlap, 1); 156 assert_equals(document.styleSheets[0].cssRules.length, 2); 157 158 // Force updating internal state. 159 getComputedStyle(document.body).borderTop; 160 161 assert_equals( 162 document.styleSheets[0].cssRules[0].annotation.size, 163 1, 164 "1 annotation." 165 ); 166 assert_equals( 167 document.styleSheets[0].cssRules[0].styleset.size, 168 3, 169 "3 entries in styleset." 170 ); 171 assert_equals( 172 document.styleSheets[0].cssRules[0].ornaments.size, 173 0, 174 "No ornament entries." 175 ); 176 assert_false( 177 document.styleSheets[0].cssRules[0].annotation.has("baric"), 178 "Annotation must not contain 'baric'." 179 ); 180 assert_false( 181 document.styleSheets[0].cssRules[0].ornaments.has("fooic"), 182 "Ornaments must not contain 'fooic'." 183 ); 184 185 assert_equals(document.styleSheets[0].cssRules[1].annotation.size, 1); 186 assert_equals(document.styleSheets[0].cssRules[1].ornaments.size, 1); 187 assert_false( 188 document.styleSheets[0].cssRules[1].annotation.has("the_first") 189 ); 190 }); 191 }, "Multiple rules for the same family are kept separate in CSSOM."); 192 </script>