third_party/WebKit/LayoutTests/fast/events/touch/gesture/gesture-tap-hover-clear.html

   1 <!DOCTYPE html>
   2 <html>
   3 <script src="../../../../resources/js-test.js"></script>
   4
   5 <style type="text/css">
   6 ::-webkit-scrollbar {
   7     width: 0px;
   8     height: 0px;
   9 }
  10
  11 div {
  12     line-height: 100px;
  13 }
  14
  15 #hoverme {
  16     background-color: lightblue;
  17 }
  18
  19 #clickme {
  20     background-color: lightgreen;
  21 }
  22
  23 #dontclickme {
  24     background-color: yellow;
  25     display: none;
  26 }
  27
  28 #hoverme:hover #dontclickme {
  29     display: block;
  30 }
  31 </style>
  32
  33 <body style="margin:0">
  34
  35 <div id='hoverme'>Hover over me
  36   <div id='dontclickme'>Don't click me</div>
  37 </div>
  38 <div id='clickme'>Click me</div>
  39
  40 <p id="description"></p>
  41 <p>See https://bugs.webkit.org/show_bug.cgi?id=103283 for details.</p>
  42
  43 <div id="console"></div>
  44
  45 <script>
  46 description("Tests that hover effects from a gesture tap down can be cleared by a gesture tap or mousemove outside of the hovered element.");
  47
  48 var clickMe = document.getElementById('clickme');
  49 var dontClickMe = document.getElementById('dontclickme');
  50
  51 function runTests()
  52 {
  53     if (!window.eventSender) {
  54         debug('This test requires DRT.');
  55         return;
  56     }
  57
  58     if (!eventSender.gestureShowPress || !eventSender.gestureTap || !eventSender.mouseMoveTo) {
  59         debug('GestureShowPress, GestureTap, or MouseMoveTo is not supported by this platform');
  60         return;
  61     }
  62
  63     debug("The Don't Click Me div should not be visible.");
  64     shouldBe("dontClickMe.offsetTop", "0");
  65
  66     debug("The Don't Click Me div should be visible after a GestureShowPress on the Hover Over Me div.");
  67     shouldBe(document.elementFromPoint(50, 50).id, "hoverme");
  68     eventSender.gestureShowPress(50, 50);
  69     shouldBe("dontClickMe.offsetTop", "100");
  70
  71     debug("The Don't Click Me div should not be visible after a GestureTap on the Click Me div.");
  72     shouldBe(document.elementFromPoint(250, 250).id, "clickme");
  73     eventSender.gestureTap(250, 250);
  74     waitUntilActiveCleared();
  75 }
  76
  77 function waitUntilActiveCleared()
  78 {
  79     if (dontClickMe.offsetTop != 0) {
  80         return setTimeout(waitUntilActiveCleared, 10);
  81     }
  82
  83     shouldBe("dontClickMe.offsetTop", "0");
  84
  85     debug("The Don't Click Me div should be visible after a GestureShowPress on the Hover Over Me div.");
  86     shouldBe(document.elementFromPoint(50, 50).id, "hoverme");
  87     eventSender.gestureShowPress(50, 50);
  88     shouldBe("dontClickMe.offsetTop", "100");
  89
  90     debug("The Don't Click Me div should not be visible after a mouse move to below the Click Me div.");
  91     eventSender.mouseMoveTo(350, 350);
  92     shouldBe("dontClickMe.offsetTop", "0");
  93
  94     finishJSTest();
  95 }
  96
  97 if (window.testRunner) {
  98     window.jsTestIsAsync = true;
  99     testRunner.waitUntilDone();
 100 }
 101
 102 runTests();
 103 </script>
 104 </body>
 105 </html>