| OLD | NEW |
| (Empty) |
| 1 <!doctype html> | |
| 2 <html> | |
| 3 <!-- | |
| 4 Tests parsing of region styling @-webkit-region rule. | |
| 5 On success, you should see a PASS message. | |
| 6 --> | |
| 7 <head> | |
| 8 <style> | |
| 9 #article { -webkit-flow: "main-thread"; } | |
| 10 .region { content: -webkit-from-flow("main-thread"); } | |
| 11 | |
| 12 /* Style the content flowing into the first region */ | |
| 13 @-webkit-region #region1 { div { margin-top: 10px; } } | |
| 14 | |
| 15 /* Style the content flowing into the second region */ | |
| 16 @-webkit-region #region2 { div { margin-left: 5px; } } | |
| 17 | |
| 18 /* Mix region styling rules declarations with other rules */ | |
| 19 #region1 { width: 200px; height: 50px; } | |
| 20 #region2 { width: 200px; height: 50px; } | |
| 21 | |
| 22 /* Again style the content flowing into the first region */ | |
| 23 @-webkit-region #region1 { p { color: red; } } | |
| 24 | |
| 25 /* Incorrect region styling rule should be ignored as long as | |
| 26 braces are paired properly*/ | |
| 27 @-webkit-region #region1 { color: red; } | |
| 28 | |
| 29 /* Style both regions at the same time */ | |
| 30 @-webkit-region #region1, #region2 { p > p { color: green; } } | |
| 31 </style> | |
| 32 </head> | |
| 33 <body> | |
| 34 <div id="console"></div> | |
| 35 <script> | |
| 36 if (window.testRunner) | |
| 37 testRunner.dumpAsText(); | |
| 38 | |
| 39 function logConsole(msg) | |
| 40 { | |
| 41 var textNode = document.createTextNode(msg); | |
| 42 document.getElementById("console").appendChild(textNode); | |
| 43 } | |
| 44 | |
| 45 var expectedRegionStyleRulesText = | |
| 46 [ | |
| 47 "@-webkit-region #region1 { div { margin-top: 10px; } }", | |
| 48 "@-webkit-region #region2 { div { margin-left: 5px; } }", | |
| 49 "@-webkit-region #region1 { p { color: red; } }", | |
| 50 "@-webkit-region #region1, #region2 { p > p { color: green; } }" | |
| 51 ]; | |
| 52 | |
| 53 var actualRegionStyleRulesText = new Array(); | |
| 54 var cssRules = document.styleSheets[0].cssRules; | |
| 55 for (var idx = 0; idx < cssRules.length; idx++) { | |
| 56 var cssRule = cssRules.item(idx); | |
| 57 if (cssRule.type == CSSRule.WEBKIT_REGION_RULE) | |
| 58 actualRegionStyleRulesText.push(cssRule.cssText); | |
| 59 } | |
| 60 | |
| 61 var pass = true; | |
| 62 if (expectedRegionStyleRulesText.length != actualRegionStyleRulesText.le
ngth) { | |
| 63 logConsole("FAIL: expected " + expectedRegionStyleRulesText.length +
" region style rules, actual: " + actualRegionStyleRulesText.length); | |
| 64 pass = false; | |
| 65 } | |
| 66 else { | |
| 67 for (var idx = 0; idx < actualRegionStyleRulesText.length; idx++) { | |
| 68 if (expectedRegionStyleRulesText[idx].replace(/\s/g, "") != actu
alRegionStyleRulesText[idx].replace(/\s/g, "")) { | |
| 69 logConsole("FAIL: expected " + expectedRegionStyleRulesText[
idx] + "found " + actualRegionStyleRulesText[idx]); | |
| 70 pass = false; | |
| 71 } | |
| 72 } | |
| 73 } | |
| 74 | |
| 75 if (pass) | |
| 76 logConsole("PASS"); | |
| 77 </script> | |
| 78 </body> | |
| 79 </html> | |
| OLD | NEW |