third_party/WebKit/LayoutTests/fast/dynamic/hover-before-position-after-style-change2.html

   1 <!DOCTYPE HTML>
   2 <html>
   3     <head>
   4         <style>
   5             div { width:100px; height:100px;}
   6             div#outsideDiv:before       { content:"> "; }
   7             div#outsideDiv:hover:before { display: block; content:"< "; }
   8         </style>
   9         <p>
  10             Test for <a href="https://bugs.webkit.org/show_bug.cgi?id=56401">https://bugs.webkit.org/show_bug.cgi?id=56401</a>
  11             Hover the mouse over the "Block" text. The test passes if the "Block" text is not moved above ">". This test ensures
  12             that the "before" element after hover is inserted in the same position.
  13         </p>
  14     </head>
  15     <body>
  16         <div id="console"></div>
  17         <div id="outsideDiv" onmouseover="checkTestResult()"><span id="span">Inline</span><div id="insideDiv">Block</p></div>
  18         <script>
  19             function getElementTop(elementId)
  20             {
  21                 var elem = document.getElementById(elementId);
  22                 return elem.getBoundingClientRect().top;
  23             }
  24
  25             function simulateMouseMove()
  26             {
  27                 var outsideDivTop = getElementTop("outsideDiv");
  28                 if (window.eventSender)
  29                     eventSender.mouseMoveTo(50, outsideDivTop);
  30             }
  31
  32             function checkTestResult()
  33             {
  34                 var outsideDivTop = getElementTop("outsideDiv");
  35                 var insideDivTop = getElementTop("insideDiv");
  36                 document.getElementById("console").innerText = (insideDivOriginalTop != insideDivTop) ? "FAIL" : "PASS";
  37                 if (window.testRunner)
  38                     document.getElementById("outsideDiv").style.visibility = 'hidden';
  39             }
  40
  41             if (window.testRunner)
  42                 testRunner.dumpAsText();
  43
  44             document.body.offsetTop;
  45             // Capture the initial values for inside div top
  46             var insideDivOriginalTop = getElementTop("insideDiv");
  47
  48             // Remove the span so that the "before" element is the only remaining child of the anonymous block
  49             // that initially contained "before" and span.
  50             var span = document.getElementById("span");
  51             var outsideDiv = document.getElementById("outsideDiv");
  52             outsideDiv.removeChild(span);
  53
  54             if (window.testRunner) {
  55                 simulateMouseMove();
  56                 checkTestResult();
  57             }
  58         </script>
  59     </body>
  60 </html>