| <!DOCTYPE html> |
| <meta charset=utf-8> |
| <meta name="assert" |
| content="This test checks the syntax output of frame timing functions" /> |
| <title>Frames timing function syntax tests</title> |
| <link rel="help" |
| href="https://drafts.csswg.org/css-timing/#frames-timing-functions"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script src="testcommon.js"></script> |
| <body> |
| <div id="log"></div> |
| <script> |
| "use strict"; |
| |
| test(function(t) { |
| const div = createDiv(t); |
| div.style.animation = 'abc 1s ease-in'; |
| div.style.animationTimingFunction = 'frames(1)'; |
| assert_equals(getComputedStyle(div).animationTimingFunction, 'ease-in'); |
| }, 'The number of frames must be a positive integer greater than 1, or we ' + |
| 'fallback to the previously-set easing'); |
| |
| test(function(t) { |
| const div = createDiv(t); |
| div.style.animation = 'abc 1s frames( 2 )'; |
| assert_equals(getComputedStyle(div).animationTimingFunction, 'frames(2)'); |
| }, 'The serialization of frames is \'frames(n)\', n is the number of frames'); |
| |
| </script> |
| </body> |
