src/third_party/WebKit/LayoutTests/fast/regions/cssom/webkit-named-flow-event-no-regions.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <meta charset="utf-8">
   5 <script src="../../../resources/js-test.js"></script>
   6 <script src="../resources/helper.js"></script>
   7 <style>
   8 #article {
   9     -webkit-flow-into: article;
  10     border: 2px solid black;
  11 }
  12 #region_1, #region_2{
  13     -webkit-flow-from: no_article;
  14     overflow:hidden;
  15     display:inline-block;
  16     vertical-align:top;
  17     margin:10px;
  18 }
  19 .block {
  20    display:block;
  21 }
  22 #region_1, #region_2 { height:110px; width:200px; margin: 5px;}
  23 </style>
  24 </head>
  25 <body>
  26 <div id="article">
  27     <div>
  28         <div id="content" style="height: 200px; background-color: green;"></div>
  29     </div>
  30 </div>
  31
  32 <div id="region_1"></div>
  33 <div id="container2">
  34     <div id="region_2"></div>
  35 </div>
  36
  37 <script>
  38     description("Tests regionOversetChange being dispatched when the region chain is removed");
  39     if (window.testRunner) {
  40         testRunner.dumpAsText();
  41         testRunner.waitUntilDone();
  42     }
  43
  44     window.jsTestIsAsync = true;
  45     function flowContent(flowName) {
  46         var r = document.getElementById("region_1");
  47         r.style.webkitFlowFrom = flowName;
  48         r = document.getElementById("region_2");
  49         r.style.webkitFlowFrom = flowName;
  50     }
  51
  52     function finishTest() {
  53         shouldBe("eventCount", "2");
  54         finishJSTest();
  55     }
  56
  57     var eventCount = 0;
  58     function regionOversetChanged(event) {
  59         shouldBeEqualToString("event.target.name", "article");
  60         if (++eventCount > 1) {
  61            event.target.removeEventListener("webkitregionoversetchange", regionOversetChanged);
  62            finishTest();
  63            return;
  64         }
  65
  66         debug("Removing region 1");
  67         var r = document.getElementById("region_1");
  68         r.style.webkitFlowFrom = "no-article";
  69         debug("Removing region 2");
  70         r = document.getElementById("region_2");
  71         r.style.webkitFlowFrom = "no-article";
  72     }
  73
  74     function startTest() {
  75         var flow = getFlowByName("article");
  76         flow.addEventListener("webkitregionoversetchange", regionOversetChanged);
  77
  78         debug("Flow content");
  79         flowContent("article");
  80     }
  81     window.addEventListener("load", startTest);
  82
  83 </script>
  84 </body>
  85 </html>