LayoutTests/fast/events/overflow-events-writing-mode.html

   1 <html>
   2 <head>
   3   <script>
   4     var longInlineBlockDirectionText = "longlonglonglonglongtext<br>longlonglonglonglongtext<br>longlonglonglonglongtext<br>longlonglonglonglongtext<br>longlonglonglonglongtext<br>longlonglonglonglongtext<br>";
   5     var longInlineBaseDirectionText = "longlonglonglonglongtext";
   6     var longBlockFlowDirectionText="long<br>long<br>long<br>long<br>long<br>long<br>long<br>";
   7     var shortText = "l";
   8     function setupTest() {
   9         // horizontal overflow.
  10         var horizontalOverflow = testResults[currentTest][1];
  11         var verticalOverflow = testResults[currentTest][2];
  12
  13         if (horizontalOverflow && verticalOverflow) {
  14             document.getElementById('child').innerHTML = longInlineBlockDirectionText;
  15         } else if (horizontalOverflow) {
  16             document.getElementById('child').innerHTML = longBlockFlowDirectionText;
  17         } else if (verticalOverflow) {
  18             document.getElementById('child').innerHTML = longInlineBaseDirectionText;
  19         } else {
  20             document.getElementById('child').innerHTML = shortText;
  21         }
  22     }
  23
  24     function finished(result)
  25     {
  26         document.getElementById('result').innerHTML = result;
  27         document.getElementById('child').innerHTML = "";
  28
  29         if (window.layoutTestController)
  30             layoutTestController.notifyDone();
  31     }
  32
  33     function nextTest() {
  34         if (currentTest == testResults.length) {
  35             finished("SUCCESS");
  36             return;
  37         }
  38
  39         forceLayout();
  40         setupTest();
  41         forceLayout();
  42         forceLayout();
  43     }
  44
  45     function overflowChanged(event) {
  46         var result = [event.orient, event.horizontalOverflow, event.verticalOverflow];
  47
  48         if ('' + result == testResults[currentTest]) {
  49             currentTest++;
  50             nextTest();
  51         } else
  52             finished("FAILURE: expected " + testResults[currentTest] + " got " + result);
  53     }
  54
  55     function forceLayout() {
  56         document.body.offsetTop;
  57     }
  58
  59     function runTest() {
  60         if (window.layoutTestController) {
  61             layoutTestController.dumpAsText();
  62             layoutTestController.waitUntilDone();
  63         }
  64
  65         testResults = [[OverflowEvent.HORIZONTAL, true, false],
  66                        [OverflowEvent.HORIZONTAL, false, false],
  67                        [OverflowEvent.VERTICAL, false, true],
  68                        [OverflowEvent.VERTICAL, false, false],
  69                        [OverflowEvent.BOTH, true, true],
  70                        [OverflowEvent.BOTH, false, false],
  71                        [OverflowEvent.VERTICAL, false, true],
  72                        [OverflowEvent.BOTH, true, false],
  73                        [OverflowEvent.BOTH, false, true]];
  74
  75         currentTest = 0;
  76
  77         var c = document.getElementById('container');
  78         c.addEventListener('overflowchanged', overflowChanged, false);
  79         nextTest();
  80     }
  81   </script>
  82 </head>
  83 <body onload="runTest()">
  84     <div id="container" style="width:100; height:100px; border: solid red 2px; overflow: hidden">
  85         <div id="child" style="margin-top: 30px; margin-left: 30px; font-family: Ahem; border: solid blue 2px; -webkit-writing-mode: vertical-lr;"></div>
  86     </div>
  87     This tests that overflowchanged events are fired correctly on nodes with writing-mode: vertical-lr. If the test is successful, the text "SUCCESS" should be shown below.
  88     <div id="result">FAILURE</div>
  89 </body>
  90 </html>