Refactor touch hit-testing hover/active tests.

LayoutTests/fast/events/touch/gesture/gesture-tap-cancel-hover-state.html

Index: LayoutTests/fast/events/touch/gesture/gesture-tap-cancel-hover-state.html
diff --git a/LayoutTests/fast/events/touch/gesture/gesture-tap-cancel-hover-state.html b/LayoutTests/fast/events/touch/gesture/gesture-tap-cancel-hover-state.html
index 5944ec0fe18dcf1b10e6087a5f5f4da3b09feeba..6723cedb2dd508344a4754dcb5c4dab42913c5c3 100644
--- a/LayoutTests/fast/events/touch/gesture/gesture-tap-cancel-hover-state.html
+++ b/LayoutTests/fast/events/touch/gesture/gesture-tap-cancel-hover-state.html
@@ -1,68 +1,24 @@
 <!DOCTYPE html>
 <html>
 <script src="../../../../resources/js-test.js"></script>
+<link rel="stylesheet" href="../resources/touch-hover-active-tests.css">
 <style type="text/css">
 #box {
-    background-color: blue;
     width: 300px;
     height: 100px;
 }
-
-#box:hover {
-    background-color: red;
-}
-
-#box:active {
-    background-color: green;
-}
-
-#box:hover:active {
-    background-color: yellow;
-}
-
 </style>
 <body>
-<div id="box">Gestures go here</div>
+<div id="box" class="touch-interactive">Gestures go here</div>
 
 <p id="description"></p>
 <p>See http://crbug.com/316974 for details</p>
 
 <div id="console"></div>
 
+<script src="../resources/touch-hover-active-tests.js"></script>
 <script>
-var color;
-
-function isBoxOfColor(givenColor)
-{
-    var b = document.getElementById('box');
-    color = window.getComputedStyle(b).backgroundColor;
-    if (color == givenColor)
-        return true;
-
-    testFailed('Box had backgroundColor: ' + color);
-    return false;
-}
-
-function isBoxHovered()
-{
-    return isBoxOfColor("rgb(255, 0, 0)");
-}
-
-function isBoxActive()
-{
-    return isBoxOfColor("rgb(0, 255, 0)");
-}
-
-function isBoxHoverActive()
-{
-    return isBoxOfColor("rgb(255, 255, 0)");
-}
-
-function isBoxDefault()
-{
-    return isBoxOfColor("rgb(0, 0, 255)");
-}
-
+var box = document.getElementById("box");
 description("Tests that gesture tapcancel clears hover properly");
 
 function runTests()
@@ -79,34 +35,36 @@ function runTests()
     }
 
     debug("Verify hover, active aren't initially set");
-    shouldBeTrue("isBoxDefault()");
+    shouldBeTrue("isBoxDefault(box)");
 
     debug("tapcancel on element when it is Active should keep hover");
+    eventSender.gestureTapDown(50, 50);
     eventSender.gestureShowPress(50, 50);
-    shouldBeTrue("isBoxHoverActive()");
+    shouldBeTrue("isBoxHoveredAndActive(box)");
     eventSender.gestureTapCancel(50, 50);
-    shouldBeTrue("isBoxHovered()");
+    shouldBeTrue("isBoxHovered(box)");
 
     debug("tapcancel outside element when it is Active should clear it");
+    eventSender.gestureTapDown(50, 50);
     eventSender.gestureShowPress(50, 50);
-    shouldBeTrue("isBoxHoverActive()");
+    shouldBeTrue("isBoxHoveredAndActive(box)");
     eventSender.gestureTapCancel(400, 250);
-    shouldBeTrue("isBoxDefault()");
+    shouldBeTrue("isBoxDefault(box)");
 
     debug("tapcancel on element when it is hovered but not active should keep hover");
     eventSender.mouseMoveTo(50, 50);
-    shouldBeTrue("isBoxHovered()");
+    shouldBeTrue("isBoxHovered(box)");
     eventSender.gestureTapCancel(50, 50);
-    shouldBeTrue("isBoxHovered()");
+    shouldBeTrue("isBoxHovered(box)");
 
     debug("tapcancel outside element when it is hovered but not active should keep hover");
     eventSender.mouseMoveTo(50, 50);
-    shouldBeTrue("isBoxHovered()");
+    shouldBeTrue("isBoxHovered(box)");
     eventSender.gestureTapCancel(400, 250);
-    shouldBeTrue("isBoxHovered()");
+    shouldBeTrue("isBoxHovered(box)");
 }
 
-runTests();
+window.onload = runTests;
 </script>
 </body>
 </html>