| <!DOCTYPE html> |
| <html> |
| <head> |
| <meta charset="utf-8"> |
| <title>CSS Transitions Test: Parsing transition-delay</title> |
| <meta name="assert" content="Test checks that transition-delay values are parsed properly"> |
| <link rel="help" title="2.4. The 'transition-delay' Property" href="http://www.w3.org/TR/css3-transitions/#transition-delay-property"> |
| <link rel="help" title="CSS Values and Units Module Level 3 - 6.2. Times: the ‘<time>’ type and ‘s’, ‘ms’ units" href="http://www.w3.org/TR/css3-values/#time"> |
| <link rel="author" title="Rodney Rehm" href="http://rodneyrehm.de/en/"> |
| <meta name="flags" content="dom"> |
| |
| <script src="/resources/testharness.js" type="text/javascript"></script> |
| <script src="/resources/testharnessreport.js" type="text/javascript"></script> |
| |
| <script src="./support/vendorPrefix.js" type="text/javascript"></script> |
| <script src="./support/helper.js" type="text/javascript"></script> |
| </head> |
| <body> |
| <!-- required by testharnessreport.js --> |
| <div id="log"></div> |
| <!-- elements used for testing --> |
| <div id="container"> |
| <div id="transition"></div> |
| </div> |
| |
| <script> |
| var transition = document.getElementById('transition'); |
| // <time> [, <time>]* |
| var values = { |
| // seconds |
| '10.2s': '10.2s', |
| '1s': '1s', |
| '0.1s': '0.1s', |
| '0.01s': '0.01s', |
| '0.001s': '0.001s', |
| '0.009s': '0.009s', |
| '0s': '0s', |
| '0s': '0s', |
| '.0s': '0s', |
| '0.0s': '0s', |
| '.3s': '0.3s', |
| '-5s' : '-5s', |
| // milliseconds |
| '10200ms': '10.2s', |
| '1000ms': '1s', |
| '100ms': '0.1s', |
| '10ms': '0.01s', |
| '9ms': '0.009s', |
| '1ms': '0.001s', |
| '0ms': '0s', |
| '-500ms' : '-0.5s', |
| // combination |
| '1s, 0.1s, 10ms': '1s, 0.1s, 0.01s', |
| // invalid |
| 'foobar': '0s' |
| }; |
| |
| // these tests are supposed to fail and |
| // possibly make the engine issue a parser warning |
| var invalidTests = { |
| 'foobar': true |
| }; |
| |
| for (var key in values) { |
| if (Object.prototype.hasOwnProperty.call(values, key)) { |
| test(function() { |
| setStyle('#transition', { |
| 'transition-delay': key |
| }); |
| var result = computedStyle(transition, 'transition-delay'); |
| assert_equals(result, values[key], "Expected computed value"); |
| }, "parse '" + key + "'", |
| { |
| // mark tests that fail as such |
| flags: invalidTests[key] ? "invalid" : "" |
| }); |
| } |
| } |
| </script> |
| </body> |
| </html> |
