transition-behavior.html (3386B)
1 <!DOCTYPE html> 2 <link rel=author href="mailto:jarhar@chromium.org"> 3 <link rel=help href="https://github.com/w3c/csswg-drafts/issues/8857"> 4 <script src="/resources/testharness.js"></script> 5 <script src="/resources/testharnessreport.js"></script> 6 <script src="/css/support/parsing-testcommon.js"></script> 7 <script src="/css/support/computed-testcommon.js"></script> 8 <div id="target"></div> 9 <script> 10 test_valid_value('transition-behavior', 'normal'); 11 test_computed_value('transition-behavior', 'normal'); 12 13 test_valid_value('transition-behavior', 'allow-discrete'); 14 test_computed_value('transition-behavior', 'allow-discrete'); 15 16 test_valid_value('transition', 'allow-discrete display', 'display allow-discrete'); 17 test_computed_value('transition', 'allow-discrete display', 'display allow-discrete'); 18 19 test_valid_value('transition', 'allow-discrete display 3s', 'display 3s allow-discrete'); 20 test_computed_value('transition', 'allow-discrete display 3s', 'display 3s allow-discrete'); 21 22 test_valid_value('transition', 'allow-discrete display 3s 1s', 'display 3s 1s allow-discrete'); 23 test_computed_value('transition', 'allow-discrete display 3s 1s', 'display 3s 1s allow-discrete'); 24 25 test_valid_value('transition', 'allow-discrete display 3s ease-in-out', 'display 3s ease-in-out allow-discrete'); 26 test_computed_value('transition', 'allow-discrete display 3s ease-in-out', 'display 3s ease-in-out allow-discrete'); 27 28 test_valid_value('transition', 'allow-discrete display 3s ease-in-out 1s', 'display 3s ease-in-out 1s allow-discrete'); 29 test_computed_value('transition', 'allow-discrete display 3s ease-in-out 1s', 'display 3s ease-in-out 1s allow-discrete'); 30 31 test_invalid_value('transition', 'asdf display'); 32 test_invalid_value('transition', 'display asdf'); 33 34 // Putting "discrete" anywhere in the shorthand should still work 35 test_valid_value('transition', 'display allow-discrete 3s ease-in-out 1s', 'display 3s ease-in-out 1s allow-discrete'); 36 test_valid_value('transition', 'display 3s allow-discrete ease-in-out 1s', 'display 3s ease-in-out 1s allow-discrete'); 37 test_valid_value('transition', 'display 3s ease-in-out allow-discrete 1s', 'display 3s ease-in-out 1s allow-discrete'); 38 test_valid_value('transition', 'display 3s ease-in-out 1s allow-discrete', 'display 3s ease-in-out 1s allow-discrete'); 39 test_computed_value('transition', 'display allow-discrete 3s ease-in-out 1s', 'display 3s ease-in-out 1s allow-discrete'); 40 test_computed_value('transition', 'display 3s allow-discrete ease-in-out 1s', 'display 3s ease-in-out 1s allow-discrete'); 41 test_computed_value('transition', 'display 3s ease-in-out allow-discrete 1s', 'display 3s ease-in-out 1s allow-discrete'); 42 test_computed_value('transition', 'display 3s ease-in-out 1s allow-discrete', 'display 3s ease-in-out 1s allow-discrete'); 43 44 // Serialization with multiple shorthands, including different order 45 test_valid_value('transition', 46 'allow-discrete display, normal opacity, color', 47 'display allow-discrete, opacity, color'); 48 test_computed_value('transition', 49 'allow-discrete display, normal opacity, color', 50 'display allow-discrete, opacity, color'); 51 test_valid_value('transition', 52 'normal opacity, color, allow-discrete display', 53 'opacity, color, display allow-discrete'); 54 test_computed_value('transition', 55 'normal opacity, color, allow-discrete display', 56 'opacity, color, display allow-discrete'); 57 </script>