1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/layout/style/test/test_variable_serialization_specified.html Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,117 @@
1.4 +<!DOCTYPE html>
1.5 +<title>Test serialization of specified CSS variable values</title>
1.6 +<script src="/MochiKit/MochiKit.js"></script>
1.7 +<script src="/tests/SimpleTest/SimpleTest.js"></script>
1.8 +<link rel="stylesheet" href="/tests/SimpleTest/test.css" type="text/css">
1.9 +
1.10 +<style id=style1>#test { }</style>
1.11 +<style id=style2></style>
1.12 +
1.13 +<script>
1.14 +// Values that should be serialized back to the same string.
1.15 +var values_with_unchanged_specified_value_serialization = [
1.16 + "var(--a)",
1.17 + "var(--a)",
1.18 + "var(--a) ",
1.19 + "var( --a ) ",
1.20 + "var(--a, )",
1.21 + "var(--a,/**/a)",
1.22 + "1px var(--a)",
1.23 + "var(--a) 1px",
1.24 + "something 3px url(whereever) calc(var(--a) + 1px)",
1.25 + "var(--a)",
1.26 + "var(--a)var(--b)",
1.27 + "var(--a, var(--b, var(--c, black)))",
1.28 + "var(--a) <!--",
1.29 + "--> var(--a)",
1.30 + "{ [ var(--a) ] }",
1.31 + "[;] var(--a)",
1.32 + "var(--a,(;))",
1.33 + "VAR(--a)",
1.34 + "var(--0)",
1.35 + "var(--\\30)",
1.36 + "var(--\\d800)",
1.37 + "var(--\\ffffff)",
1.38 +];
1.39 +
1.40 +// Values that serialize differently, due to additional implied closing
1.41 +// characters at EOF.
1.42 +var values_with_changed_specified_value_serialization = [
1.43 + ["var(--a", "var(--a)"],
1.44 + ["var(--a , ", "var(--a , )"],
1.45 + ["var(--a, ", "var(--a, )"],
1.46 + ["var(--a, var(--b", "var(--a, var(--b))"],
1.47 + ["var(--a /* unclosed comment", "var(--a /* unclosed comment*/)"],
1.48 + ["var(--a /* unclosed comment *", "var(--a /* unclosed comment */)"],
1.49 + ["[{(((var(--a", "[{(((var(--a))))}]"],
1.50 + ["var(--a, \"unclosed string", "var(--a, \"unclosed string\")"],
1.51 + ["var(--a, 'unclosed string", "var(--a, 'unclosed string')"],
1.52 + ["var(--a) \"unclosed string\\", "var(--a) \"unclosed string\""],
1.53 + ["var(--a) 'unclosed string\\", "var(--a) 'unclosed string'"],
1.54 + ["var(--a) \\", "var(--a) \\\ufffd"],
1.55 + ["var(--a) url(unclosedurl", "var(--a) url(unclosedurl)"],
1.56 + ["var(--a) url('unclosedurl", "var(--a) url('unclosedurl')"],
1.57 + ["var(--a) url(\"unclosedurl", "var(--a) url(\"unclosedurl\")"],
1.58 + ["var(--a) url(unclosedurl\\", "var(--a) url(unclosedurl\\\ufffd)"],
1.59 + ["var(--a) url('unclosedurl\\", "var(--a) url('unclosedurl')"],
1.60 + ["var(--a) url(\"unclosedurl\\", "var(--a) url(\"unclosedurl\")"],
1.61 +];
1.62 +
1.63 +var style1 = document.getElementById("style1");
1.64 +var style2 = document.getElementById("style2");
1.65 +
1.66 +var decl = style1.sheet.cssRules[0].style;
1.67 +
1.68 +function test_specified_value_serialization(value, expected) {
1.69 + // Test setting value on a custom property with setProperty.
1.70 + decl.setProperty("--test", value, "");
1.71 + is(decl.getPropertyValue("--test"), expected,
1.72 + "value with identical serialization set on custom property with setProperty");
1.73 +
1.74 + // Test setting value on a custom property via style sheet parsing.
1.75 + style2.textContent = "#test { --test:" + value;
1.76 + is(style2.sheet.cssRules[0].style.getPropertyValue("--test"), expected,
1.77 + "value with identical serialization set on custom property via parsing");
1.78 +
1.79 + // Test setting value on a non-custom longhand property with setProperty.
1.80 + decl.setProperty("color", value, "");
1.81 + is(decl.getPropertyValue("color"), expected,
1.82 + "value with identical serialization set on non-custom longhand property with setProperty");
1.83 +
1.84 + // Test setting value on a non-custom longhand property via style sheet parsing.
1.85 + style2.textContent = "#test { color:" + value;
1.86 + is(style2.sheet.cssRules[0].style.getPropertyValue("color"), expected,
1.87 + "value with identical serialization set on non-custom longhand property via parsing");
1.88 +
1.89 + // Test setting value on a non-custom shorthand property with setProperty.
1.90 + decl.setProperty("margin", value, "");
1.91 + is(decl.getPropertyValue("margin"), expected,
1.92 + "value with identical serialization set on non-custom shorthand property with setProperty");
1.93 +
1.94 + // Test setting value on a non-custom shorthand property via style sheet parsing.
1.95 + style2.textContent = "#test { margin:" + value;
1.96 + is(style2.sheet.cssRules[0].style.getPropertyValue("margin"), expected,
1.97 + "value with identical serialization set on non-custom shorthand property via parsing");
1.98 +
1.99 + // Clean up.
1.100 + decl.removeProperty("--test");
1.101 + decl.removeProperty("color");
1.102 + decl.removeProperty("margin");
1.103 +}
1.104 +
1.105 +function runTest() {
1.106 + values_with_unchanged_specified_value_serialization.forEach(function(value) {
1.107 + test_specified_value_serialization(value, value);
1.108 + });
1.109 +
1.110 + values_with_changed_specified_value_serialization.forEach(function(pair) {
1.111 + test_specified_value_serialization(pair[0], pair[1]);
1.112 + });
1.113 +
1.114 + SimpleTest.finish();
1.115 +}
1.116 +
1.117 +SimpleTest.waitForExplicitFinish();
1.118 +SpecialPowers.pushPrefEnv({ set: [["layout.css.variables.enabled", true]] },
1.119 + runTest);
1.120 +</script>
