| <!DOCTYPE html> |
| <link rel=author href="mailto:jarhar@chromium.org"> |
| <link rel=help href="https://github.com/w3c/csswg-drafts/issues/8857"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script src="/css/support/parsing-testcommon.js"></script> |
| <script src="/css/support/computed-testcommon.js"></script> |
| <div id="target"></div> |
| <script> |
| test_valid_value('transition-animation-type', 'normal'); |
| test_computed_value('transition-animation-type', 'normal'); |
| |
| test_valid_value('transition-animation-type', 'discrete'); |
| test_computed_value('transition-animation-type', 'discrete'); |
| |
| test_valid_value('transition', 'discrete display', 'display 0s ease 0s discrete'); |
| test_computed_value('transition', 'discrete display', 'display 0s ease 0s discrete'); |
| |
| test_valid_value('transition', 'discrete display 3s', 'display 3s ease 0s discrete'); |
| test_computed_value('transition', 'discrete display 3s', 'display 3s ease 0s discrete'); |
| |
| test_valid_value('transition', 'discrete display 3s 1s', 'display 3s ease 1s discrete'); |
| test_computed_value('transition', 'discrete display 3s 1s', 'display 3s ease 1s discrete'); |
| |
| test_valid_value('transition', 'discrete display 3s ease-in-out', 'display 3s ease-in-out 0s discrete'); |
| test_computed_value('transition', 'discrete display 3s ease-in-out', 'display 3s ease-in-out 0s discrete'); |
| |
| test_valid_value('transition', 'discrete display 3s ease-in-out 1s', 'display 3s ease-in-out 1s discrete'); |
| test_computed_value('transition', 'discrete display 3s ease-in-out 1s', 'display 3s ease-in-out 1s discrete'); |
| |
| test_invalid_value('transition', 'asdf display'); |
| test_invalid_value('transition', 'display asdf'); |
| |
| // Putting "discrete" anywhere in the shorthand should still work |
| test_valid_value('transition', 'display discrete 3s ease-in-out 1s', 'display 3s ease-in-out 1s discrete'); |
| test_valid_value('transition', 'display 3s discrete ease-in-out 1s', 'display 3s ease-in-out 1s discrete'); |
| test_valid_value('transition', 'display 3s ease-in-out discrete 1s', 'display 3s ease-in-out 1s discrete'); |
| test_valid_value('transition', 'display 3s ease-in-out 1s discrete', 'display 3s ease-in-out 1s discrete'); |
| test_computed_value('transition', 'display discrete 3s ease-in-out 1s', 'display 3s ease-in-out 1s discrete'); |
| test_computed_value('transition', 'display 3s discrete ease-in-out 1s', 'display 3s ease-in-out 1s discrete'); |
| test_computed_value('transition', 'display 3s ease-in-out discrete 1s', 'display 3s ease-in-out 1s discrete'); |
| test_computed_value('transition', 'display 3s ease-in-out 1s discrete', 'display 3s ease-in-out 1s discrete'); |
| |
| // Serialization with multiple shorthands, including different order |
| test_valid_value('transition', |
| 'discrete display, normal opacity, color', |
| 'display 0s ease 0s discrete, opacity 0s ease 0s, color 0s ease 0s'); |
| test_computed_value('transition', |
| 'discrete display, normal opacity, color', |
| 'display 0s ease 0s discrete, opacity 0s ease 0s, color 0s ease 0s'); |
| test_valid_value('transition', |
| 'normal opacity, color, discrete display', |
| 'opacity 0s ease 0s, color 0s ease 0s, display 0s ease 0s discrete'); |
| test_computed_value('transition', |
| 'normal opacity, color, discrete display', |
| 'opacity 0s ease 0s, color 0s ease 0s, display 0s ease 0s discrete'); |
| </script> |