animation-multiple-from-to-keyframes-with-only-timing-function.html (858B)
1 <!doctype html> 2 <meta charset=utf-8> 3 <title>Multiple from and to keyframes</title> 4 <link rel="help" href="https://drafts.csswg.org/css-animations-1/"> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <script src="support/testcommon.js"></script> 8 <style> 9 10 @keyframes multiple-from-to-keyframes { 11 from, to { animation-timing-function: cubic-bezier(0, 0, 1, 1) } 12 from { left: 50px } 13 to { left: 150px } 14 } 15 16 </style> 17 <div id="log"></div> 18 <script> 19 'use strict'; 20 21 test(t => { 22 const div = addDiv(t); 23 div.style.animation = 'multiple-from-to-keyframes 100s -50s linear'; 24 assert_equals(getComputedStyle(div).left, "100px"); 25 }, 'Animations should not use an implicit value when the first rule within a @keyframes rule specifies "from" and "to" but only specifies a timing function.'); 26 27 </script>