overflow-serialization.html (2890B)
1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>CSSOM - Overflow shorthand serialization</title> 6 <link rel="help" href="https://drafts.csswg.org/cssom/#serialize-a-css-value"> 7 <script src="/resources/testharness.js"></script> 8 <script src="/resources/testharnessreport.js"></script> 9 <style> 10 div { overflow: inherit; } 11 div { overflow: hidden; } 12 div { overflow-x: initial; overflow-y: initial; } 13 div { overflow-x: scroll; overflow-y: scroll; } 14 div { overflow-x: scroll; overflow-y: hidden; } 15 </style> 16 17 <script> 18 var styleSheet = document.styleSheets[0] 19 var div = document.createElement('div') 20 test(function () { 21 assert_equals(styleSheet.cssRules[0].style.cssText, "overflow: inherit;") 22 }, "Single value overflow with CSS-wide keyword should serialize correctly.") 23 test(function () { 24 assert_equals(styleSheet.cssRules[1].style.cssText, "overflow: hidden;") 25 }, "Single value overflow with non-CSS-wide keyword should serialize correctly.") 26 test(function () { 27 assert_equals(styleSheet.cssRules[2].style.cssText, "overflow: initial;") 28 }, "Overflow-x/y longhands with same CSS-wide keyword should serialize correctly.") 29 test(function () { 30 assert_equals(styleSheet.cssRules[3].style.cssText, "overflow: scroll;") 31 }, "Overflow-x/y longhands with same non-CSS-wide keyword should serialize correctly.") 32 test(function () { 33 assert_equals(styleSheet.cssRules[4].style.cssText, "overflow: scroll hidden;") 34 }, "Overflow-x/y longhands with different keywords should serialize correctly.") 35 test(function () { 36 div.style.overflow = "inherit" 37 assert_equals(div.style.overflow, "inherit") 38 }, "Single value overflow on element with CSS-wide keyword should serialize correctly.") 39 test(function () { 40 div.style.overflow = "hidden" 41 assert_equals(div.style.overflow, "hidden") 42 }, "Single value overflow on element with non-CSS-wide keyword should serialize correctly.") 43 test(function () { 44 div.style.overflow = "" 45 div.style.overflowX = "initial" 46 div.style.overflowY = "initial" 47 assert_equals(div.style.overflow, "initial") 48 }, "Overflow-x/y longhands on element with same CSS-wide keyword should serialize correctly.") 49 test(function () { 50 div.style.overflowX = "scroll" 51 div.style.overflowY = "scroll" 52 assert_equals(div.style.overflow, "scroll") 53 }, "Overflow-x/y longhands on element with same non-CSS-wide keyword should serialize correctly.") 54 test(function () { 55 div.style.overflowX = "scroll" 56 div.style.overflowY = "hidden" 57 assert_equals(div.style.overflow, "scroll hidden") 58 }, "Overflow-x/y longhands on element with different keywords should serialize correctly.") 59 </script> 60 </head> 61 </html>