third_party/WebKit/LayoutTests/fast/css/hover-after-clicking-embed.html

   1 <!DOCTYPE html>
   2 <style>
   3 #test {
   4   color: blue;
   5 }
   6 #test:hover {
   7   color: green;
   8 }
   9 </style>
  10 <script src="../../resources/js-test.js"></script>
  11 <script>
  12
  13 function verify(expectedColor)
  14 {
  15     shouldBeEqualToString('window.getComputedStyle(document.getElementById("test")).color', expectedColor);
  16 }
  17
  18 function runTest()
  19 {
  20     if (!window.eventSender)
  21         return false;
  22
  23     document.onclick = function () { testFailed("Click should not have bubbled from embed!"); };
  24     var pluginElement = document.getElementById('plugin');
  25     var x = pluginElement.offsetLeft + pluginElement.offsetWidth / 2;
  26     var y = pluginElement.offsetTop + pluginElement.offsetHeight / 2;
  27     eventSender.mouseMoveTo(x, y);
  28     eventSender.mouseDown();
  29     eventSender.mouseUp();
  30
  31     var testElement = document.getElementById('test');
  32     x = testElement.offsetLeft + testElement.offsetWidth / 2;
  33     y = testElement.offsetTop + testElement.offsetHeight / 2;
  34
  35     // Due to how mouse press / hover state is updated, the first mouse move is expected to generate incorrect hover state.
  36     eventSender.mouseMoveTo(x, y);
  37     verify('rgb(0, 0, 255)');
  38
  39     eventSender.mouseMoveTo(x - 100, y);
  40     eventSender.mouseMoveTo(x, y);
  41     verify('rgb(0, 128, 0)');
  42 }
  43 </script>
  44 <body onload="runTest()">
  45 <p>Test that mouse state is correctly reset after clicking on a node that captures mouse events. To run this test, first click on the embed element, then mouse over "Hover me". It should change from blue to green.
  46 <embed id="plugin" type="application/x-shockwave-flash"></embed>
  47 <p><a id="test" href="#">Hover me</a>
  48 <div id="console"></div>
  49 </body>