layout/style/test/test_css_supports.html

   1 <!DOCTYPE HTML>
   2 <html>
   3 <!--
   4 https://bugzilla.mozilla.org/show_bug.cgi?id=779917
   5 -->
   6 <head>
   7   <title>Test for Bug 779917</title>
   8   <script src="/tests/SimpleTest/SimpleTest.js"></script>
   9   <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
  10 </head>
  11 <body>
  12 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=779917">Mozilla Bug 779917</a>
  13 <p id="display"></p>
  14 <div id="content" style="display: none">
  15
  16 </div>
  17 <pre id="test">
  18 <script type="application/javascript">
  19
  20 /** Test for Bug 779917 **/
  21
  22 function runTest()
  23 {
  24   var passingConditions = [
  25     "color: green",
  26     "(color: green)",
  27     "((color: green))",
  28     "(color: green !important)",
  29     "(color: rainbow) or (color: green)",
  30     "(color: green) or (color: rainbow)",
  31     "(color: green) and (color: blue)",
  32     "(color: rainbow) or (color: iridescent) or (color: green)",
  33     "(color: red) and (color: green) and (color: blue)",
  34     "(color:green)",
  35     "not (color: rainbow)",
  36     "not (not (color: green))",
  37     "(unknown:) or (color: green)",
  38     "(unknown) or (color: green)",
  39     "(font: 16px serif)",
  40     "(color:) or (color: green)",
  41     "not (@page)",
  42     "not ({ something @with [ balanced ] brackets })",
  43     "an-extension(of some kind) or (color: green)",
  44     "not ()",
  45     "( Font:  20px serif ! Important) ",
  46     "(color: /* comment */ green)",
  47     "(/* comment */ color: green)",
  48     "(color: green /* comment */)",
  49     "(color: green) /* comment */",
  50     "/* comment */ (color: green)",
  51     "(color /* comment */: green)",
  52     "(color: green) /* unclosed comment",
  53     "(color: green",
  54     "(((((((color: green",
  55     "(font-family: 'Helvetica"
  56   ];
  57
  58   var failingConditions = [
  59     "(color: rainbow)",
  60     "(color: rainbow) and (color: green)",
  61     "(color: blue) and (color: rainbow)",
  62     "(color: green) and (color: green) or (color: green)",
  63     "(color: green) or (color: green) and (color: green)",
  64     "not not (color: green)",
  65     "not (color: rainbow) and not (color: iridescent)",
  66     "not (color: rainbow) or (color: green)",
  67     "(not (color: rainbow) or (color: green))",
  68     "(unknown: green)",
  69     "not ({ something @with (unbalanced brackets })",
  70     "(color: green) or an-extension(that is [unbalanced)",
  71     "not(unknown: unknown)",
  72     "(color: green) or(color: blue)",
  73     "(color: green;)",
  74     "(font-family: 'Helvetica\n",
  75     "(font-family: 'Helvetica\n')",
  76     "()",
  77     ""
  78   ];
  79
  80   var passingDeclarations = [
  81     ["color", "green"],
  82     ["color", " green "],
  83     ["Color", "Green"],
  84     ["color", "green /* comment */"],
  85     ["color", "/* comment */ green"],
  86     ["color", "green /* unclosed comment"],
  87     ["font", "16px serif"],
  88     ["font", "16px /* comment */ serif"],
  89     ["font", "16px\nserif"],
  90     ["color", "\\0067reen"]
  91   ];
  92
  93   var failingDeclarations = [
  94     ["color ", "green"],
  95     ["color", "rainbow"],
  96     ["color", "green green"],
  97     ["color", "green !important"],
  98     ["\\0063olor", "green"],
  99     ["/* comment */color", "green"],
 100     ["color/* comment */", "green"],
 101     ["font-family", "'Helvetica\n"],
 102     ["font-family", "'Helvetica\n'"],
 103     ["color", "green;"],
 104     ["color", ""],
 105     ["unknown", "unknown"],
 106     ["", "green"],
 107     ["", ""]
 108   ];
 109
 110   passingConditions.forEach(function(aCondition) {
 111     is(CSS.supports(aCondition), true, "CSS.supports returns true for passing condition \"" + aCondition + "\"");
 112   });
 113
 114   failingConditions.forEach(function(aCondition) {
 115     is(CSS.supports(aCondition), false, "CSS.supports returns false for failing condition \"" + aCondition + "\"");
 116   });
 117
 118   passingDeclarations.forEach(function(aDeclaration) {
 119     is(CSS.supports(aDeclaration[0], aDeclaration[1]), true, "CSS.supports returns true for supported declaration \"" + aDeclaration.join(":") + "\"");
 120   });
 121
 122   failingDeclarations.forEach(function(aDeclaration) {
 123     is(CSS.supports(aDeclaration[0], aDeclaration[1]), false, "CSS.supports returns false for unsupported declaration \"" + aDeclaration.join(":") + "\"");
 124   });
 125
 126   SimpleTest.finish();
 127 }
 128
 129 SimpleTest.waitForExplicitFinish();
 130 runTest();
 131 </script>
 132 </pre>
 133 </body>
 134 </html>