| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| <body></body> |
| <script> |
| function createTarget() { |
| var target = document.createElement('div'); |
| document.body.appendChild(target); |
| return target; |
| } |
| |
| test(() => { |
| var target = createTarget(); |
| target.style.left = '100px'; |
| assert_equals(getComputedStyle(target).left, '100px'); |
| target.style.transition = 'left 1s -0.5s, left 1s -0.25s linear'; |
| target.style.left = '200px'; |
| assert_equals(getComputedStyle(target).left, '125px'); |
| target.remove(); |
| }, 'The last timing properties for a transition property should be used'); |
| |
| test(() => { |
| var target = createTarget(); |
| target.style.left = '100px'; |
| assert_equals(getComputedStyle(target).left, '100px'); |
| target.style.transition = 'left 1s -0.5s, all 1s -0.25s linear'; |
| target.style.left = '200px'; |
| assert_equals(getComputedStyle(target).left, '125px'); |
| target.remove(); |
| }, 'The last timing properties for a transition property should be used including shorthand references to the property'); |
| |
| test(() => { |
| var target = createTarget(); |
| target.style.left = '100px'; |
| assert_equals(getComputedStyle(target).left, '100px'); |
| target.style.transition = 'left 1s -0.5s, left 0s'; |
| target.style.left = '200px'; |
| assert_equals(getComputedStyle(target).left, '200px'); |
| target.remove(); |
| }, 'The last timing properties for a transition property should be used even if they cause the transition to not start'); |
| </script> |
