| <!doctype html> |
| <html> |
| <head> |
| <meta charset="utf-8"> |
| <title>CSSOM - Overflow shorthand serialization</title> |
| <link rel="help" href="https://drafts.csswg.org/cssom/#serialize-a-css-value"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <style> |
| div { overflow: inherit; } |
| div { overflow: hidden; } |
| div { overflow-x: initial; overflow-y: initial; } |
| div { overflow-x: scroll; overflow-y: scroll; } |
| div { overflow-x: scroll; overflow-y: hidden; } |
| </style> |
| |
| <script> |
| test(function () { |
| var styleSheet = document.styleSheets[0]; |
| |
| assert_equals(styleSheet.cssRules[0].style.cssText, "overflow: inherit;", "Single value overflow with CSS-wide keyword should serialize correctly."); |
| assert_equals(styleSheet.cssRules[1].style.cssText, "overflow: hidden;", "Single value overflow with non-CSS-wide keyword should serialize correctly."); |
| assert_equals(styleSheet.cssRules[2].style.cssText, "overflow: initial;", "Overflow-x/y longhands with same CSS-wide keyword should serialize correctly."); |
| assert_equals(styleSheet.cssRules[3].style.cssText, "overflow: scroll;", "Overflow-x/y longhands with same non-CSS-wide keyword should serialize correctly."); |
| assert_equals(styleSheet.cssRules[4].style.cssText, "overflow: scroll hidden;", "Overflow-x/y longhands with different keywords should serialize correctly."); |
| |
| var div = document.createElement('div'); |
| div.style.overflow = "inherit"; |
| assert_equals(div.style.overflow, "inherit", "Single value overflow with CSS-wide keyword should serialize correctly."); |
| |
| div.style.overflow = "hidden"; |
| assert_equals(div.style.overflow, "hidden", "Single value overflow with non-CSS-wide keyword should serialize correctly."); |
| |
| div.style.overflow = ""; |
| div.style.overflowX = "initial"; |
| div.style.overflowY = "initial"; |
| assert_equals(div.style.overflow, "initial", "Overflow-x/y longhands with same CSS-wide keyword should serialize correctly."); |
| |
| div.style.overflowX = "scroll"; |
| div.style.overflowY = "scroll"; |
| assert_equals(div.style.overflow, "scroll", "Overflow-x/y longhands with same non-CSS-wide keyword should serialize correctly."); |
| |
| div.style.overflowX = "scroll"; |
| div.style.overflowY = "hidden"; |
| assert_equals(div.style.overflow, "scroll hidden", "Overflow-x/y longhands with different keywords should serialize correctly."); |
| }); |
| </script> |
| </head> |
| </html> |
