flex-serialization.html (1708B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>CSSOM - Flex 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 { flex: initial; } 11 div { flex: 0; } 12 div { flex: initial; flex-basis: initial; flex-shrink: initial; } 13 div { flex: initial; flex-shrink: 0; } 14 div { flex: initial; flex-basis: 0; flex-shrink: 2;} 15 </style> 16 17 <script> 18 var styleSheet = document.styleSheets[0] 19 test(function () { 20 assert_equals(styleSheet.cssRules[0].style.cssText, "flex: initial;") 21 }, "Single value flex with CSS-wide keyword should serialize correctly.") 22 test(function () { 23 assert_in_array(styleSheet.cssRules[1].style.cssText, ["flex: 0px;", "flex: 0 1 0px;"]) 24 }, "Single value flex with non-CSS-wide value should serialize correctly.") 25 test(function () { 26 assert_equals(styleSheet.cssRules[2].style.cssText, "flex: initial;") 27 }, "Multiple values flex with CSS-wide keyword should serialize correctly.") 28 test(function () { 29 assert_equals(styleSheet.cssRules[3].style.cssText, "flex-grow: initial; flex-basis: initial; flex-shrink: 0;") 30 }, "Multiple values flex with CSS-wide keywords and non-CSS-wide value should serialize correctly.") 31 test(function () { 32 assert_equals(styleSheet.cssRules[4].style.cssText, "flex-grow: initial; flex-basis: 0px; flex-shrink: 2;") 33 }, "Multiple values flex with CSS-wide and two non-CSS-wide-keyword values should serialize correctly.") 34 </script> 35 </head> 36 </html>