font-palette-values-invalid.html (8129B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>CSS Fonts Module Level 4: parsing @font-palette-values</title> 6 <link rel="help" href="https://drafts.csswg.org/css-fonts/#font-palette-values"> 7 <meta name="assert" content="@font-palette-values is parsed correctly."> 8 <script src="/resources/testharness.js"></script> 9 <script src="/resources/testharnessreport.js"></script> 10 <style id="style"> 11 @font-palette-values { 12 } 13 14 @font-palette-values A { 15 } 16 17 @font-palette-values --A --B { 18 } 19 20 /* 0 */ 21 @font-palette-values --A { 22 font-family: a, serif; /* multiple families are allowed, but not generics */ 23 } 24 25 /* 1 */ 26 @font-palette-values --A { 27 font-family: 1; 28 } 29 30 /* 2 */ 31 @font-palette-values --A { 32 font: 12px a; 33 } 34 35 /* 3 */ 36 @font-palette-values --A { 37 base-palette: 1 2; 38 } 39 40 /* 4 */ 41 @font-palette-values --A { 42 base-palette: ident; 43 } 44 45 /* 5 */ 46 @font-palette-values --A { 47 base-palette: "a" "b"; 48 } 49 50 /* 6 */ 51 @font-palette-values --A { 52 base-palette: ; 53 } 54 55 /* 7 */ 56 @font-palette-values --A { 57 override-colors: ident #123; 58 } 59 60 /* 8 */ 61 @font-palette-values --A { 62 override-colors: 0 "red"; 63 } 64 65 /* 9 */ 66 @font-palette-values --A { 67 override-colors: 0 #123, 1; 68 } 69 70 /* 10 */ 71 @font-palette-values --A { 72 override-colors: ; 73 } 74 75 /* 11 */ 76 @font-palette-values --A { 77 override-colors: 0 #123 1; 78 } 79 80 /* 12 */ 81 @font-palette-values --A { 82 override-colors: 0; 83 } 84 85 /* 13 */ 86 @font-palette-values --A { 87 font-family: ""; 88 } 89 90 /* 14 */ 91 @font-palette-values --A { 92 base-palette: initial; 93 override-colors: initial; 94 } 95 96 /* 15 */ 97 @font-palette-values --A { 98 base-palette: inherit; 99 override-colors: inherit; 100 } 101 102 /* 16 */ 103 @font-palette-values --A { 104 base-palette: unset; 105 override-colors: unset; 106 } 107 108 /* 17 */ 109 @font-palette-values --A { 110 base-palette: -1; 111 override-color: -1 #123; 112 } 113 114 /* 18 */ 115 @font-palette-values --A { 116 override-colors: 0 canvas; 117 } 118 119 /* 19 */ 120 @font-palette-values --A { 121 override-colors: 0 currentcolor; 122 } 123 124 /* 20 */ 125 @font-palette-values --A { 126 override-colors: 0 light-dark(white, black); 127 } 128 129 /* 21 */ 130 @font-palette-values --A { 131 override-colors: 0 color-mix(in lch, red, canvas); 132 } 133 134 /* 22 */ 135 @font-palette-values --A { 136 override-colors: 0 light-dark(white, currentcolor); 137 } 138 139 /* 23 */ 140 @font-palette-values --A { 141 override-colors: 0 color-mix(in lch, red, color-mix(in lch, currentcolor, black)); 142 } 143 144 /* 24 */ 145 @font-palette-values --A { 146 base-palette: sibling-index(); 147 } 148 </style> 149 </head> 150 <body> 151 <script> 152 let rules = document.getElementById("style").sheet.cssRules; 153 test(function() { 154 assert_equals(rules.length, 25); 155 }); 156 157 test(function() { 158 let text = rules[0].cssText; 159 let rule = rules[0]; 160 assert_equals(text.indexOf("font-family"), -1); 161 assert_equals(rule.fontFamily, ""); 162 rule.fontFamily = "SomeFontFamily"; 163 assert_equals(rule.fontFamily, ""); 164 assert_equals(rule.basePalette, ""); 165 rule.basePalette = "7"; 166 assert_equals(rule.basePalette, ""); 167 assert_throws_js(TypeError, function() { 168 rule.clear(); 169 }); 170 assert_throws_js(TypeError, function() { 171 rule.delete(4); 172 }); 173 assert_throws_js(TypeError, function() { 174 rule.set(4, "0 #123"); 175 }); 176 }); 177 178 test(function() { 179 let text = rules[1].cssText; 180 let rule = rules[1]; 181 assert_equals(text.indexOf("font-family"), -1); 182 assert_equals(rule.fontFamily, ""); 183 }); 184 185 test(function() { 186 let text = rules[2].cssText; 187 let rule = rules[2]; 188 assert_equals(text.indexOf("font:"), -1); 189 assert_equals(rule.fontFamily, ""); 190 }); 191 192 test(function() { 193 let text = rules[3].cssText; 194 let rule = rules[3]; 195 assert_equals(text.indexOf("base-palette"), -1); 196 assert_equals(rule.basePalette, ""); 197 }); 198 199 test(function() { 200 let text = rules[4].cssText; 201 let rule = rules[4]; 202 assert_equals(text.indexOf("base-palette"), -1); 203 assert_equals(rule.basePalette, ""); 204 }); 205 206 test(function() { 207 let text = rules[5].cssText; 208 let rule = rules[5]; 209 assert_equals(text.indexOf("base-palette"), -1); 210 assert_equals(rule.basePalette, ""); 211 }); 212 213 test(function() { 214 let text = rules[6].cssText; 215 let rule = rules[6]; 216 assert_equals(text.indexOf("base-palette"), -1); 217 assert_equals(rule.basePalette, ""); 218 }); 219 220 test(function() { 221 let text = rules[7].cssText; 222 let rule = rules[7]; 223 assert_equals(text.indexOf("override-colors"), -1); 224 assert_equals(rule.overrideColors, ""); 225 }); 226 227 test(function() { 228 let text = rules[8].cssText; 229 let rule = rules[8]; 230 assert_equals(text.indexOf("override-colors"), -1); 231 assert_equals(rule.overrideColors, ""); 232 }); 233 234 test(function() { 235 let text = rules[9].cssText; 236 let rule = rules[9]; 237 assert_equals(text.indexOf("override-colors"), -1); 238 assert_equals(rule.overrideColors, ""); 239 }); 240 241 test(function() { 242 let text = rules[10].cssText; 243 let rule = rules[10]; 244 assert_equals(text.indexOf("override-colors"), -1); 245 assert_equals(rule.overrideColors, ""); 246 }); 247 248 test(function() { 249 let text = rules[11].cssText; 250 let rule = rules[11]; 251 assert_equals(text.indexOf("override-colors"), -1); 252 assert_equals(rule.overrideColors, ""); 253 }); 254 255 test(function() { 256 let text = rules[12].cssText; 257 let rule = rules[12]; 258 assert_equals(text.indexOf("override-colors"), -1); 259 assert_equals(rule.overrideColors, ""); 260 }); 261 262 test(function() { 263 let text = rules[13].cssText; 264 let rule = rules[13]; 265 // I see nothing in the spec that indicates an empty string is a parse error. 266 assert_not_equals(text.indexOf("font-family"), -1); 267 }); 268 269 test(function() { 270 let text = rules[14].cssText; 271 let rule = rules[14]; 272 assert_equals(text.indexOf("base-palette"), -1); 273 assert_equals(text.indexOf("override-colors"), -1); 274 assert_equals(rule.basePalette, ""); 275 assert_equals(rule.overrideColors, ""); 276 }); 277 278 test(function() { 279 let text = rules[15].cssText; 280 let rule = rules[15]; 281 assert_equals(text.indexOf("base-palette"), -1); 282 assert_equals(text.indexOf("override-colors"), -1); 283 assert_equals(rule.basePalette, ""); 284 assert_equals(rule.overrideColors, ""); 285 }); 286 287 test(function() { 288 let text = rules[16].cssText; 289 let rule = rules[16]; 290 assert_equals(text.indexOf("base-palette"), -1); 291 assert_equals(text.indexOf("override-colors"), -1); 292 assert_equals(rule.basePalette, ""); 293 assert_equals(rule.overrideColors, ""); 294 }); 295 296 test(function() { 297 assert_equals(CSSRule.FONT_PALETTE_VALUES_RULE, undefined); 298 }); 299 300 test(function() { 301 let text = rules[17].cssText; 302 let rule = rules[17]; 303 assert_equals(text.indexOf("base-palette"), -1); 304 assert_equals(text.indexOf("override-color"), -1); 305 assert_equals(rule.basePalette, ""); 306 assert_equals(rule.overrideColors, ""); 307 }); 308 309 test(function() { 310 let text = rules[18].cssText; 311 let rule = rules[18]; 312 assert_equals(text.indexOf("override-colors"), -1); 313 assert_equals(rule.basePalette, ""); 314 assert_equals(rule.overrideColors, ""); 315 }); 316 317 test(function() { 318 let text = rules[19].cssText; 319 let rule = rules[19]; 320 assert_equals(text.indexOf("override-colors"), -1); 321 assert_equals(rule.overrideColors, ""); 322 }); 323 324 test(function() { 325 let text = rules[20].cssText; 326 let rule = rules[20]; 327 assert_equals(text.indexOf("override-colors"), -1); 328 assert_equals(rule.overrideColors, ""); 329 }); 330 331 test(function() { 332 let text = rules[21].cssText; 333 let rule = rules[21]; 334 assert_equals(text.indexOf("override-colors"), -1); 335 assert_equals(rule.overrideColors, ""); 336 }); 337 338 test(function() { 339 let text = rules[22].cssText; 340 let rule = rules[22]; 341 assert_equals(text.indexOf("override-colors"), -1); 342 assert_equals(rule.overrideColors, ""); 343 }); 344 345 test(function() { 346 let text = rules[23].cssText; 347 let rule = rules[23]; 348 assert_equals(text.indexOf("override-colors"), -1); 349 assert_equals(rule.overrideColors, ""); 350 }); 351 352 test(function() { 353 let text = rules[24].cssText; 354 let rule = rules[24]; 355 assert_equals(text.indexOf("base-palette"), -1); 356 assert_equals(rule.basePalette, ""); 357 }, "sibling-index() is invalid in base-palette descriptor"); 358 </script> 359 </body> 360 </html>