1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/layout/style/test/test_css_supports_variables.html Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,248 @@
1.4 +<!DOCTYPE HTML>
1.5 +<html>
1.6 +<!--
1.7 +https://bugzilla.mozilla.org/show_bug.cgi?id=773296
1.8 +-->
1.9 +<head>
1.10 + <title>Test for Bug 773296</title>
1.11 + <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
1.12 + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
1.13 +</head>
1.14 +<body>
1.15 +<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=773296">Mozilla Bug 773296</a>
1.16 +<p id="display"></p>
1.17 +<div id="content" style="display: none">
1.18 +
1.19 +</div>
1.20 +<pre id="test">
1.21 +<script type="application/javascript">
1.22 +
1.23 +/** Test for Bug 773296 **/
1.24 +
1.25 +function runTest()
1.26 +{
1.27 + var passingConditions = [
1.28 + "(color:var(--a))",
1.29 + "(color: var(--a))",
1.30 + "(color: var(--a) )",
1.31 + "(color: var( --a ) )",
1.32 + "(color: var(--a, ))",
1.33 + "(color: var(--))",
1.34 + "(color: var(--a,/**/a))",
1.35 + "(color: 1px var(--a))",
1.36 + "(color: var(--a) 1px)",
1.37 + "(color: something 3px url(whereever) calc(var(--a) + 1px))",
1.38 + "(color: var(--a) !important)",
1.39 + "(color: var(--a)var(--b))",
1.40 + "(color: var(--a, var(--b, var(--c, black))))",
1.41 + "(color: var(--a) <!--)",
1.42 + "(color: --> var(--a))",
1.43 + "(color: { [ var(--a) ] })",
1.44 + "(color: [;] var(--a))",
1.45 + "(color: var(--a,(;)))",
1.46 + "(color: VAR(--a))",
1.47 + "(color: var(--0))",
1.48 + "(color: var(--\\30))",
1.49 + "(color: var(--\\d800))",
1.50 + "(color: var(--\\ffffff))",
1.51 + "(color: var(--",
1.52 + "(color: var(--a",
1.53 + "(color: var(--a , ",
1.54 + "(color: var(--a, ",
1.55 + "(color: var(--a, var(--b",
1.56 + "(color: var(--a /* unclosed comment",
1.57 + "(color: var(--a, '",
1.58 + "(color: var(--a, '\\",
1.59 + "(color: var(--a, \\",
1.60 +
1.61 + "(--a:var(--b))",
1.62 + "(--a: var(--b))",
1.63 + "(--a: var(--b) )",
1.64 + "(--a: var( --b ) )",
1.65 + "(--a: var(--b, ))",
1.66 + "(--a: var(--b,/**/a))",
1.67 + "(--a: 1px var(--b))",
1.68 + "(--a: var(--b) 1px)",
1.69 + "(--a: something 3px url(whereever) calc(var(--b) + 1px))",
1.70 + "(--a: var(--b) !important)",
1.71 + "(--a: var(--b)var(--b))",
1.72 + "(--a: var(--b, var(--c, var(--d, black))))",
1.73 + "(--a: var(--b) <!--)",
1.74 + "(--a: --> var(--b))",
1.75 + "(--a: { [ var(--b) ] })",
1.76 + "(--a: [;] var(--b))",
1.77 + "(--a: )",
1.78 + "(--a:var(--a))",
1.79 + "(--0: a)",
1.80 + "(--\\30: a)",
1.81 + "(--\\61: a)",
1.82 + "(--\\d800: a)",
1.83 + "(--\\ffffff: a)",
1.84 + "(--\0: 1)",
1.85 + "(--a: ",
1.86 + "(--a: /* unclosed comment",
1.87 + "(--a: var(--b",
1.88 + "(--a: var(--b, ",
1.89 + "(--a: var(--b, var(--c",
1.90 + "(--a: [{(((",
1.91 + "(--a: '",
1.92 + "(--a: '\\",
1.93 + "(--a: \\",
1.94 + "(--: a)",
1.95 + ];
1.96 +
1.97 + var failingConditions = [
1.98 + "(color: var(--a,))",
1.99 + "(color: var(--a,/**/))",
1.100 + "(color: var(--a,!))",
1.101 + "(color: var(--a,!important))",
1.102 + "(color: var(--a) !important !important)",
1.103 + "(color: var(--a,;))",
1.104 + "(color: var(--a);)",
1.105 + "(color: var(1px))",
1.106 + "(color: var(--a)))",
1.107 + "(color: var(--a) \"\n",
1.108 + "(color: var(--a) url(\"\n",
1.109 + "(color: var(a))",
1.110 +
1.111 + "(--a: var(--b,))",
1.112 + "(--a: var(--b,/**/))",
1.113 + "(--a: var(--b,!))",
1.114 + "(--a: var(--b,!important))",
1.115 + "((--a: var(--b) !important !important))",
1.116 + "(--a: var(--b,;))",
1.117 + "(--a: var(--b);)",
1.118 + "(--a:)",
1.119 + "(--a: var(1px))",
1.120 + "(--a: a))",
1.121 + "(--a: \"\n",
1.122 + "(--a: url(\"\n",
1.123 + "(--a: var(a))",
1.124 + ];
1.125 +
1.126 + var passingDeclarations = [
1.127 + ["color", "var(--a)"],
1.128 + ["color", " var(--a)"],
1.129 + ["color", "var(--a) "],
1.130 + ["color", "var( --a ) "],
1.131 + ["color", "var(--a, )"],
1.132 + ["color", "var(--a,/**/a)"],
1.133 + ["color", "1px var(--a)"],
1.134 + ["color", "var(--a) 1px"],
1.135 + ["color", "something 3px url(whereever) calc(var(--a) + 1px)"],
1.136 + ["color", "var(--a)var(--b)"],
1.137 + ["color", "var(--a, var(--b, var(--c, black)))"],
1.138 + ["color", "var(--a) <!--"],
1.139 + ["color", "--> var(--a)"],
1.140 + ["color", "{ [ var(--a) ] }"],
1.141 + ["color", "[;] var(--a)"],
1.142 + ["color", "var(--a,(;))"],
1.143 + ["color", "VAR(--a)"],
1.144 + ["color", "var(--0)"],
1.145 + ["color", "var(--\\30)"],
1.146 + ["color", "var(--\\d800)"],
1.147 + ["color", "var(--\\ffffff)"],
1.148 + ["color", "var(--a"],
1.149 + ["color", "var(--a , "],
1.150 + ["color", "var(--a, "],
1.151 + ["color", "var(--a, var(--b"],
1.152 + ["color", "var(--a /* unclosed comment"],
1.153 + ["color", "var(--a, '"],
1.154 + ["color", "var(--a, '\\"],
1.155 + ["color", "var(--a, \\"],
1.156 + ["color", "var(--"],
1.157 +
1.158 + ["--a", " var(--b)"],
1.159 + ["--a", "var(--b)"],
1.160 + ["--a", "var(--b) "],
1.161 + ["--a", "var( --b ) "],
1.162 + ["--a", "var(--b, )"],
1.163 + ["--a", "var(--b,/**/a)"],
1.164 + ["--a", "1px var(--b)"],
1.165 + ["--a", "var(--b) 1px"],
1.166 + ["--a", "something 3px url(whereever) calc(var(--b) + 1px)"],
1.167 + ["--a", "var(--b)var(--b)"],
1.168 + ["--a", "var(--b, var(--c, var(--d, black)))"],
1.169 + ["--a", "var(--b) <!--"],
1.170 + ["--a", "--> var(--b)"],
1.171 + ["--a", "{ [ var(--b) ] }"],
1.172 + ["--a", "[;] var(--b)"],
1.173 + ["--a", " "],
1.174 + ["--a", "var(--a)"],
1.175 + ["--0", "a"],
1.176 + ["--\\30", "a"],
1.177 + ["--\\61", "a"],
1.178 + ["--\\d800", "a"],
1.179 + ["--\\ffffff", "a"],
1.180 + ["--\0", "a"],
1.181 + ["--\ud800", "a"],
1.182 + ["--a", "a /* unclosed comment"],
1.183 + ["--a", "var(--b"],
1.184 + ["--a", "var(--b, "],
1.185 + ["--a", "var(--b, var(--c"],
1.186 + ["--a", "[{((("],
1.187 + ["--a ", "a"],
1.188 + ["--a ", "'"],
1.189 + ["--a ", "'\\"],
1.190 + ["--a ", "\\"],
1.191 + ["--", "a"],
1.192 + ];
1.193 +
1.194 + var failingDeclarations = [
1.195 + ["color", "var(--a,)"],
1.196 + ["color", "var(--a,/**/)"],
1.197 + ["color", "var(--a,!)"],
1.198 + ["color", "var(--a,!important)"],
1.199 + ["color", "var(--a,;)"],
1.200 + ["color", "var(--a);"],
1.201 + ["color", "var(1px)"],
1.202 + ["color", "var(--a))"],
1.203 + ["color", "var(--a) \"\n"],
1.204 + ["color", "var(--a) url(\"\n"],
1.205 + ["color", "var(--a) !important"],
1.206 + ["color", "var(--a) !important !important"],
1.207 + ["color", "var(a)"],
1.208 +
1.209 + ["--a", "var(--b,)"],
1.210 + ["--a", "var(--b,/**/)"],
1.211 + ["--a", "var(--b,!)"],
1.212 + ["--a", "var(--b,!important)"],
1.213 + ["--a", "var(--b) !important !important"],
1.214 + ["--a", "var(--b,;)"],
1.215 + ["--a", "var(--b);"],
1.216 + ["--a", ""],
1.217 + ["--a", "var(1px)"],
1.218 + ["(VAR-a", "a"],
1.219 + ["--a", "a)"],
1.220 + ["--a", "\"\n"],
1.221 + ["--a", "url(\"\n"],
1.222 + ["--a", "var(--b))"],
1.223 + ["--a", "var(b)"],
1.224 + ];
1.225 +
1.226 + passingConditions.forEach(function(aCondition) {
1.227 + is(CSS.supports(aCondition), true, "CSS.supports returns true for passing condition \"" + aCondition + "\"");
1.228 + });
1.229 +
1.230 + failingConditions.forEach(function(aCondition) {
1.231 + is(CSS.supports(aCondition), false, "CSS.supports returns false for failing condition \"" + aCondition + "\"");
1.232 + });
1.233 +
1.234 + passingDeclarations.forEach(function(aDeclaration) {
1.235 + is(CSS.supports(aDeclaration[0], aDeclaration[1]), true, "CSS.supports returns true for supported declaration \"" + aDeclaration.join(":") + "\"");
1.236 + });
1.237 +
1.238 + failingDeclarations.forEach(function(aDeclaration) {
1.239 + is(CSS.supports(aDeclaration[0], aDeclaration[1]), false, "CSS.supports returns false for unsupported declaration \"" + aDeclaration.join(":") + "\"");
1.240 + });
1.241 +
1.242 + SimpleTest.finish();
1.243 +}
1.244 +
1.245 +SimpleTest.waitForExplicitFinish();
1.246 +SpecialPowers.pushPrefEnv({ "set": [["layout.css.supports-rule.enabled", true],
1.247 + ["layout.css.variables.enabled", true]] }, runTest);
1.248 +</script>
1.249 +</pre>
1.250 +</body>
1.251 +</html>
