third_party/WebKit/LayoutTests/animations/keyframe-autoclose-brace.html

   1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   2    "http://www.w3.org/TR/html4/loose.dtd">
   3
   4 <html lang="en">
   5 <head>
   6   <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
   7   <title>Tests CSS parser autocloses braces.</title>
   8   <style type="text/css" media="screen">
   9     @-webkit-keyframes foo {
  10         from { left: 100px; }
  11         40%  { left: 200px; }
  12         60%  { left: 200px; }
  13         to   { left: 300px;
  14   </style>
  15   <script type="text/javascript" charset="utf-8">
  16     function findKeyframesRule(rule)
  17     {
  18         var ss = document.styleSheets;
  19         for (var i = 0; i < ss.length; ++i) {
  20             for (var j = 0; j < ss[i].cssRules.length; ++j) {
  21                 if (ss[i].cssRules[j].type == window.CSSRule.WEBKIT_KEYFRAMES_RULE && ss[i].cssRules[j].name == rule)
  22                     return ss[i].cssRules[j];
  23             }
  24         }
  25
  26         return null;
  27     }
  28
  29     function test()
  30     {
  31         if (window.testRunner)
  32             testRunner.dumpAsText();
  33
  34         var keyframes = findKeyframesRule("foo");
  35         var length = keyframes ? keyframes.cssRules.length : undefined;
  36         document.getElementById("console").textContent = length === 4
  37             ? "PASS: keyframes rule has length 4"
  38             : ("FAIL: keyframes rule should have length 4 but had length " + length);
  39     }
  40
  41   </script>
  42 </head>
  43 <body onload="test()">
  44 <div>Tests parsing the @-webkit-keyframes rule without closing brace. &quot;User agents must close all open constructs ... at the end of the style sheet.&quot;
  45 (<a href="http://www.w3.org/TR/CSS21/syndata.html#parsing-errors">http://www.w3.org/TR/CSS21/syndata.html#parsing-errors</a>). So it must be parsed as if
  46 all braces are closed.</div>
  47 <div id="console"></div>
  48 </body>
  49 </html>