third_party/WebKit/LayoutTests/animations/keyframes-find-rule.html

   1 <!doctype html>
   2 <script src="../resources/testharness.js"></script>
   3 <script src="../resources/testharnessreport.js"></script>
   4 <style>
   5   @keyframes anim {
   6     0% { left: 0px; }
   7     0% { right: 0px; }
   8     from, 50%, 100% { left: 100px; }
   9     100% { right: 100px; }
  10   }
  11 </style>
  12 <script>
  13   test(function() {
  14     var rules = document.styleSheets[0].rules || document.styleSheets[0].cssRules;
  15     for (var i = 0; i < rules.length; i++) {
  16       if (rules[i].type == CSSRule.KEYFRAMES_RULE) {
  17         assert_equals(rules[i].findRule('0%').cssText, '0% { right: 0px; }');
  18         assert_equals(rules[i].findRule('   0%   ').cssText, '0% { right: 0px; }');
  19         assert_equals(rules[i].findRule('from').cssText, '0% { right: 0px; }');
  20         assert_equals(rules[i].findRule('    FROM ,    50%   , 100%  ').cssText, '0%,50%,100% { left: 100px; }');
  21         assert_equals(rules[i].findRule('  0% , 50%, to  ').cssText, '0%,50%,100% { left: 100px; }');
  22         assert_equals(rules[i].findRule('100%').cssText, '100% { right: 100px; }');
  23         assert_equals(rules[i].findRule('to').cssText, '100% { right: 100px; }');
  24         assert_equals(rules[i].findRule('1%'), null);
  25         assert_equals(rules[i].findRule('0%, 100%'), null);
  26         assert_equals(rules[i].findRule('from, 100%, 50%'), null);
  27         assert_equals(rules[i].findRule('100%, from, 50%'), null);
  28         assert_equals(rules[i].findRule(''), null);
  29         assert_equals(rules[i].findRule('foo'), null);
  30       }
  31     }
  32   }, 'Check CSSKeyframesRule.findRule returns the correct matching keyframe rule');
  33 </script>