blob: 972fd43883db15428ac3eaf1fb9c9097b5dfd264 [file] [log] [blame]
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Fonts Module Level 4: parsing @font-palette-values</title>
<link rel="help" href="https://drafts.csswg.org/css-fonts/#font-palette-values">
<meta name="assert" content="@font-palette-values is parsed correctly.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style id="style">
/* 0 */
@font-palette-values --A {
}
/* 1 */
@font-palette-values --B {
font-weight: 400;
}
/* 2 */
@font-palette-values --C {
font-family: foo;
font-family: bar;
base-palette: 1;
base-palette: "baz";
base-palette: 2;
override-colors: "a" #123;
override-colors: 3 #123;
override-colors: "b" #123;
}
/* 3 */
@font-palette-values --D {
base-palette: "foo";
base-palette: 1;
base-palette: "bar";
override-colors: 3 #123;
override-colors: "baz" #123;
override-colors: 4 #123;
}
/* 4 */
@font-palette-values --E {
override-colors: 3 rgb(17, 34, 51);
override-colors: 3 rgb(68, 85, 102);
}
/* 5 */
@font-palette-values --F {
font-family: "foo";
}
/* 6 */
@font-palette-values --G {
override-colors: 3 rgb(17, 34, 51), 4 rgb(68, 85, 102);
}
/* 7 */
@font-palette-values --H {
override-colors: 3 rgb(17, 34, 51), 3 rgb(68, 85, 102);
}
/* 8 */
@font-palette-values --I {
override-colors: 0 #0000FF;
}
/* 9 */
@font-palette-values --J {
override-colors: 0 green;
}
/* 10 */
@font-palette-values --K {
override-colors: 0 transparent;
}
/* 11 */
@font-palette-values --L {
override-colors: 0 rgba(1 2 3 / 4);
}
/* 12 */
@font-palette-values --M {
override-colors: 0 lab(29.2345% 39.3825 20.0664);
}
/* 13 */
@font-palette-values --N {
override-colors: 0 color(display-p3 100% 100% 100%);
}
/* 14 */
@font-palette-values --O {
override-colors: 0 transparent;
}
/* 15 */
@font-palette-values -- {
}
</style>
</head>
<body>
<script>
let rules = document.getElementById("style").sheet.cssRules;
test(function() {
let text = rules[0].cssText;
assert_not_equals(text.indexOf("@font-palette-values "), -1);
assert_not_equals(text.indexOf(" --A "), -1);
assert_not_equals(text.indexOf("{"), -1);
assert_not_equals(text.indexOf("}"), -1);
assert_equals(text.indexOf("font-family"), -1);
assert_equals(text.indexOf("base-palette"), -1);
assert_equals(text.indexOf("override-colors"), -1);
});
test(function() {
let rule = rules[0];
assert_equals(rule.constructor.name, "CSSFontPaletteValuesRule");
assert_equals(rule.name, "--A");
assert_equals(rule.fontFamily, "");
assert_equals(rule.basePalette, "");
assert_equals(rule.overrideColors, "");
});
test(function() {
let text = rules[1].cssText;
assert_equals(text.indexOf("font-weight"), -1);
});
test(function() {
let rule = rules[1];
assert_equals(rule.name, "--B");
assert_equals(rule.fontFamily, "");
assert_equals(rule.basePalette, "");
assert_equals(rule.overrideColors, "");
});
test(function() {
let text = rules[2].cssText;
assert_equals(text.indexOf("font-family: foo;"), -1);
assert_not_equals(text.indexOf("font-family: bar;"), -1);
assert_equals(text.indexOf("base-palette: 1;"), -1);
assert_equals(text.indexOf("base-palette: \"baz\""), -1);
assert_not_equals(text.indexOf("base-palette: 2;"), -1);
assert_equals(text.indexOf("override-colors: \"a\""), -1);
assert_not_equals(text.indexOf("override-colors: 3"), -1);
assert_equals(text.indexOf("override-colors: \"b\""), -1);
});
test(function() {
let rule = rules[2];
assert_equals(rule.name, "--C");
assert_equals(rule.fontFamily, "bar");
assert_equals(rule.basePalette, "2");
assert_equals(rule.overrideColors, "3 rgb(17, 34, 51)");
});
test(function() {
let text = rules[3].cssText;
assert_equals(text.indexOf("base-palette: \"foo\";"), -1);
assert_not_equals(text.indexOf("base-palette: 1"), -1);
assert_equals(text.indexOf("base-palette: \"bar\";"), -1);
assert_equals(text.indexOf("override-colors: 3"), -1);
assert_equals(text.indexOf("override-colors: \"baz\""), -1);
assert_not_equals(text.indexOf("override-colors: 4"), -1);
});
test(function() {
let rule = rules[3];
assert_equals(rule.name, "--D");
assert_equals(rule.fontFamily, "");
assert_equals(rule.basePalette, "1");
assert_equals(rule.overrideColors.indexOf("),"), -1);
assert_equals(rule.overrideColors.indexOf("4 "), 0);
assert_not_equals(rule.overrideColors.indexOf("rgb"), -1);
});
test(function() {
let text = rules[4].cssText;
assert_equals(text.indexOf("51"), -1);
assert_not_equals(text.indexOf("102"), -1);
});
test(function() {
let rule = rules[4];
assert_equals(rule.name, "--E");
assert_equals(rule.fontFamily, "");
assert_equals(rule.basePalette, "");
assert_equals(rule.overrideColors.indexOf("),"), -1);
assert_equals(rule.overrideColors.indexOf("3 "), 0);
assert_not_equals(rule.overrideColors.indexOf("102"), -1);
});
test(function() {
let text = rules[5].cssText;
assert_not_equals(text.indexOf("foo"), -1);
});
test(function() {
let rule = rules[5];
assert_equals(rule.name, "--F");
assert_equals(rule.fontFamily, "foo");
assert_equals(rule.basePalette, "");
assert_equals(rule.overrideColors, "");
});
test(function() {
let text = rules[6].cssText;
assert_not_equals(text.indexOf("51"), -1);
assert_not_equals(text.indexOf("102"), -1);
});
test(function() {
let rule = rules[6];
assert_equals(rule.name, "--G");
assert_equals(rule.fontFamily, "");
assert_equals(rule.basePalette, "");
assert_equals(rule.overrideColors.split("),").length, 2);
assert_equals(rule.overrideColors.indexOf("3 "), 0);
assert_not_equals(rule.overrideColors.indexOf("), 4 "), -1);
assert_not_equals(rule.overrideColors.indexOf("51"), -1);
assert_not_equals(rule.overrideColors.indexOf("102"), -1);
});
test(function() {
let text = rules[7].cssText;
assert_not_equals(text.indexOf("51"), -1);
assert_not_equals(text.indexOf("102"), -1);
});
test(function() {
let rule = rules[7];
assert_equals(rule.name, "--H");
assert_equals(rule.fontFamily, "");
assert_equals(rule.basePalette, "");
assert_not_equals(rule.overrideColors.indexOf("),"), -1);
assert_equals(rule.overrideColors.indexOf("3 "), 0);
assert_not_equals(rule.overrideColors.indexOf("), 3 "), -1);
assert_not_equals(rule.overrideColors.indexOf("51"), -1);
assert_not_equals(rule.overrideColors.indexOf("102"), -1);
});
test(function() {
let text = rules[8].cssText;
assert_not_equals(text.indexOf("override-colors"), -1);
assert_not_equals(text.indexOf("rgb(0, 0, 255)"), -1);
});
test(function() {
let rule = rules[8];
assert_equals(rule.name, "--I");
assert_equals(rule.fontFamily, "");
assert_equals(rule.basePalette, "");
assert_equals(rule.overrideColors.indexOf("),"), -1);
assert_not_equals(rule.overrideColors.indexOf("rgb(0, 0, 255)"), -1);
});
test(function() {
let text = rules[9].cssText;
assert_not_equals(text.indexOf("override-colors"), -1);
assert_not_equals(text.indexOf("rgb(0, 128, 0)"), -1);
});
test(function() {
let rule = rules[9];
assert_equals(rule.name, "--J");
assert_equals(rule.fontFamily, "");
assert_equals(rule.basePalette, "");
assert_equals(rule.overrideColors.indexOf("),"), -1);
assert_not_equals(rule.overrideColors.indexOf("rgb(0, 128, 0)"), -1);
});
test(function() {
let text = rules[10].cssText;
assert_not_equals(text.indexOf("override-colors"), -1);
assert_not_equals(text.indexOf("rgba(0, 0, 0, 0)"), -1);
});
test(function() {
let rule = rules[10];
assert_equals(rule.name, "--K");
assert_equals(rule.fontFamily, "");
assert_equals(rule.basePalette, "");
assert_equals(rule.overrideColors.indexOf("),"), -1);
assert_not_equals(rule.overrideColors.indexOf("rgba(0, 0, 0, 0)"), -1);
});
test(function() {
let text = rules[11].cssText;
assert_not_equals(text.indexOf("override-colors"), -1);
assert_not_equals(text.indexOf("2"), -1);
});
test(function() {
let rule = rules[11];
assert_equals(rule.name, "--L");
assert_equals(rule.fontFamily, "");
assert_equals(rule.basePalette, "");
assert_equals(rule.overrideColors.indexOf("),"), -1);
assert_not_equals(rule.overrideColors.indexOf("2"), -1);
});
test(function() {
let text = rules[12].cssText;
assert_not_equals(text.indexOf("override-colors"), -1);
assert_not_equals(text.indexOf("29"), -1);
});
test(function() {
let rule = rules[12];
assert_equals(rule.name, "--M");
assert_equals(rule.fontFamily, "");
assert_equals(rule.basePalette, "");
assert_equals(rule.overrideColors.indexOf("),"), -1);
assert_not_equals(rule.overrideColors.indexOf("lab"), -1);
});
test(function() {
let text = rules[13].cssText;
assert_not_equals(text.indexOf("override-colors"), -1);
assert_not_equals(text.indexOf("display-p3"), -1);
});
test(function() {
let rule = rules[13];
assert_equals(rule.name, "--N");
assert_equals(rule.fontFamily, "");
assert_equals(rule.basePalette, "");
assert_equals(rule.overrideColors.indexOf("),"), -1);
assert_not_equals(rule.overrideColors.indexOf("display-p3"), -1);
});
test(function() {
let text = rules[14].cssText;
assert_not_equals(text.indexOf("override-colors"), -1);
});
test(function() {
let rule = rules[14];
assert_equals(rule.name, "--O");
assert_equals(rule.fontFamily, "");
assert_equals(rule.basePalette, "");
assert_not_equals(rule.overrideColors, "");
});
test(function() {
let text = rules[15].cssText;
assert_not_equals(text.indexOf("--"), -1);
});
test(function() {
let rule = rules[15];
assert_equals(rule.name, "--");
assert_equals(rule.fontFamily, "");
assert_equals(rule.basePalette, "");
assert_equals(rule.overrideColors, "");
});
</script>
</body>
</html>