Skip to content

GitLab

T
tangled
Commit 4bd9b3c0 authored by zeeshanq@chromium.org's avatar zeeshanq@chromium.org
Browse files
Options

A few touch hit-testing hover/active tests use the same setup code. This patch 

consolidates that into a separate file and also updates the generated gesture
sequences to be valid.

BUG=352164

Review URL: https://codereview.chromium.org/197923006

git-svn-id: svn://svn.chromium.org/blink/trunk@169858 bbb929c8-8fbe-4397-9dbb-9b2b20218538
parent eaa4feb3
Hide whitespace changes
Inline Side-by-side
Showing with 150 additions and 177 deletions
third_party/WebKit/LayoutTests/fast/events/touch/gesture/gesture-tap-active-state-expected.txt
View file @ 4bd9b3c0
...@@ -6,26 +6,30 @@ On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE ...@@ -6,26 +6,30 @@ On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE
See https://bugs.webkit.org/show_bug.cgi?id=96060 for details See https://bugs.webkit.org/show_bug.cgi?id=96060 for details
PASS successfullyParsed is true
TEST COMPLETE
Verify active isn't initially set Verify active isn't initially set
PASS isBoxActive() is false PASS getHoverActiveState(box) is "default"
Verify tapdown,tap sets and clears active Verify showPress, tap sets and clears active
PASS isBoxActive() is true PASS getHoverActiveState(box) is "hoveredAndActive"
PASS isBoxActive() is false PASS getHoverActiveState(box) is "hovered"
Verify tapdown,tapcancel on the element sets and clears active Verify showPress, tapCancel on the element sets and clears active
PASS isBoxActive() is true PASS getHoverActiveState(box) is "hoveredAndActive"
PASS isBoxActive() is false PASS getHoverActiveState(box) is "hovered"
Verify tap elsewhere still clears active Verify tap elsewhere still clears active
PASS isBoxActive() is true PASS getHoverActiveState(box) is "hoveredAndActive"
PASS isBoxActive() is false PASS getHoverActiveState(box) is "default"
Verify tapCancel elsewhere still clears active Verify tapCancel elsewhere still clears active
PASS isBoxActive() is true PASS getHoverActiveState(box) is "hoveredAndActive"
PASS isBoxActive() is false PASS getHoverActiveState(box) is "default"
Verify that touchstart doesn't trigger active state Verify that touchStart doesn't trigger active state
PASS isBoxActive() is false PASS getHoverActiveState(box) is "default"
Verify that touchstart/touchend doesn't cancel active Verify that touchStart/touchEnd doesn't cancel active
PASS isBoxActive() is true PASS getHoverActiveState(box) is "hoveredAndActive"
PASS isBoxActive() is true PASS getHoverActiveState(box) is "hoveredAndActive"
PASS isBoxActive() is true PASS getHoverActiveState(box) is "hoveredAndActive"
PASS getHoverActiveState(box) is "hovered"
PASS successfullyParsed is true PASS successfullyParsed is true
TEST COMPLETE TEST COMPLETE
......
third_party/WebKit/LayoutTests/fast/events/touch/gesture/gesture-tap-active-state-iframe-expected.txt
View file @ 4bd9b3c0
...@@ -7,10 +7,10 @@ On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE ...@@ -7,10 +7,10 @@ On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE
See https://bugs.webkit.org/show_bug.cgi?id=96060 for details See https://bugs.webkit.org/show_bug.cgi?id=96060 for details
Verify active isn't initially set Verify active isn't initially set
PASS isBoxActive() is false PASS getHoverActiveState(box) is "default"
Verify tapdown,tap sets and clears active Verify showPress, tap sets and clears active
PASS isBoxActive() is true PASS getHoverActiveState(box) is "hoveredAndActive"
PASS isBoxActive() is false PASS getHoverActiveState(box) is "hovered"
PASS successfullyParsed is true PASS successfullyParsed is true
TEST COMPLETE TEST COMPLETE
......
third_party/WebKit/LayoutTests/fast/events/touch/gesture/gesture-tap-active-state-iframe.html
View file @ 4bd9b3c0
...@@ -8,7 +8,6 @@ ...@@ -8,7 +8,6 @@
left: 400px; left: 400px;
height: 3000px; height: 3000px;
} }
</style> </style>
<body> <body>
<iframe src='resources/gesture-tap-active-state-iframe-inner.html' id='frame'> <iframe src='resources/gesture-tap-active-state-iframe-inner.html' id='frame'>
...@@ -19,15 +18,14 @@ ...@@ -19,15 +18,14 @@
<div id="console"></div> <div id="console"></div>
<script src="../resources/touch-hover-active-tests.js"></script>
<script> <script>
var box;
description("Tests that tap gesture events set and clear the active state of elements, even when inside an iframe and the document is scrolled."); description("Tests that tap gesture events set and clear the active state of elements, even when inside an iframe and the document is scrolled.");
var isBoxActive; function runTests()
function runTests(ba)
{ {
isBoxActive = ba;
if (!window.eventSender) { if (!window.eventSender) {
debug('This test requires DRT.'); debug('This test requires DRT.');
return; return;
...@@ -38,15 +36,18 @@ function runTests(ba) ...@@ -38,15 +36,18 @@ function runTests(ba)
return; return;
} }
box = document.getElementById("frame").contentDocument.getElementById('box');
// Scroll so the box is at the top // Scroll so the box is at the top
window.scrollTo(0, 400); window.scrollTo(0, 400);
debug("Verify active isn't initially set"); debug("Verify active isn't initially set");
shouldBeFalse("isBoxActive()"); shouldBeDefault("getHoverActiveState(box)");
debug("Verify tapdown,tap sets and clears active"); debug("Verify showPress, tap sets and clears active");
eventSender.gestureTapDown(450, 50);
eventSender.gestureShowPress(450, 50); eventSender.gestureShowPress(450, 50);
shouldBeTrue("isBoxActive()"); shouldBeHoveredAndActive("getHoverActiveState(box)");
eventSender.gestureTap(450, 50); eventSender.gestureTap(450, 50);
// FIXME: Enable after implementing mocked timers (http://crbug.com/319529) // FIXME: Enable after implementing mocked timers (http://crbug.com/319529)
// shouldBeTrue("isBoxActive()"); // shouldBeTrue("isBoxActive()");
...@@ -55,11 +56,11 @@ function runTests(ba) ...@@ -55,11 +56,11 @@ function runTests(ba)
function waitUntilActiveCleared() function waitUntilActiveCleared()
{ {
if(isBoxActive()) { if(getHoverActiveState(box) == "hoveredAndActive") {
return setTimeout(waitUntilActiveCleared, 10); return setTimeout(waitUntilActiveCleared, 10);
} }
shouldBeFalse("isBoxActive()"); shouldBeOnlyHovered("getHoverActiveState(box)");
finishJSTest(); finishJSTest();
} }
...@@ -68,6 +69,7 @@ if (window.testRunner) { ...@@ -68,6 +69,7 @@ if (window.testRunner) {
testRunner.waitUntilDone(); testRunner.waitUntilDone();
} }
window.onload = runTests;
</script> </script>
</body> </body>
</html> </html>
third_party/WebKit/LayoutTests/fast/events/touch/gesture/gesture-tap-active-state.html
View file @ 4bd9b3c0
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<script src="../../../../resources/js-test.js"></script> <script src="../../../../resources/js-test.js"></script>
<link rel="stylesheet" href="../resources/touch-hover-active-tests.css">
<style type="text/css"> <style type="text/css">
#box { #box {
background-color: blue;
width: 300px; width: 300px;
height: 100px; height: 100px;
} }
#box:active {
background-color: red;
}
</style> </style>
<body> <body>
<div id="box">Gestures go here</div> <div id="box" class="touch-interactive">Gestures go here</div>
<p id="description"></p> <p id="description"></p>
<p>See https://bugs.webkit.org/show_bug.cgi?id=96060 for details</p> <p>See https://bugs.webkit.org/show_bug.cgi?id=96060 for details</p>
<div id="console"></div> <div id="console"></div>
<script src="../resources/touch-hover-active-tests.js"></script>
<script> <script>
var color; var box = document.getElementById("box");
function isBoxActive()
{
// These need to match the background-color used above, after round-tripping.
var defaultColor = "rgb(0, 0, 255)";
var activeColor = "rgb(255, 0, 0)";
var b = document.getElementById('box');
color = window.getComputedStyle(b).backgroundColor;
if (color == activeColor)
return true;
if (color != defaultColor)
testFailed('Got unexpected backgroundColor: ' + color);
return false;
}
description("Tests that tap gesture events set and clear the active state of elements."); description("Tests that tap gesture events set and clear the active state of elements.");
function runTests() function runTests()
...@@ -58,34 +39,37 @@ function runTests() ...@@ -58,34 +39,37 @@ function runTests()
} }
debug("Verify active isn't initially set"); debug("Verify active isn't initially set");
shouldBeFalse("isBoxActive()"); shouldBeDefault("getHoverActiveState(box)");
debug("Verify tapdown,tap sets and clears active"); debug("Verify showPress, tap sets and clears active");
eventSender.gestureTapDown(50, 50);
eventSender.gestureShowPress(50, 50); eventSender.gestureShowPress(50, 50);
shouldBeTrue("isBoxActive()"); shouldBeHoveredAndActive("getHoverActiveState(box)");
eventSender.gestureTap(50, 50); eventSender.gestureTap(50, 50);
// FIXME: Enable after implementing mocked timers (http://crbug.com/319529) // FIXME: Enable after implementing mocked timers (http://crbug.com/319529)
// shouldBeTrue("isBoxActive()"); // shouldBeHoveredAndActive("getHoverActiveState(box)");
waitUntilActiveCleared(); waitUntilActiveCleared();
} }
function waitUntilActiveCleared() function waitUntilActiveCleared()
{ {
if (isBoxActive()) { if (getHoverActiveState(box) == "hoveredAndActive") {
return setTimeout(waitUntilActiveCleared, 10); return setTimeout(waitUntilActiveCleared, 10);
} }
shouldBeFalse("isBoxActive()"); shouldBeOnlyHovered("getHoverActiveState(box)");
debug("Verify tapdown,tapcancel on the element sets and clears active"); debug("Verify showPress, tapCancel on the element sets and clears active");
eventSender.gestureTapDown(50, 50);
eventSender.gestureShowPress(50, 50); eventSender.gestureShowPress(50, 50);
shouldBeTrue("isBoxActive()"); shouldBeHoveredAndActive("getHoverActiveState(box)");
eventSender.gestureTapCancel(50, 50); eventSender.gestureTapCancel(50, 50);
shouldBeFalse("isBoxActive()"); shouldBeOnlyHovered("getHoverActiveState(box)");
debug("Verify tap elsewhere still clears active"); debug("Verify tap elsewhere still clears active");
eventSender.gestureTapDown(50, 50);
eventSender.gestureShowPress(50, 50); eventSender.gestureShowPress(50, 50);
shouldBeTrue("isBoxActive()"); shouldBeHoveredAndActive("getHoverActiveState(box)");
eventSender.gestureTap(400, 250); eventSender.gestureTap(400, 250);
// FIXME: Remove after mocked timers added (http://crbug.com/319529) // FIXME: Remove after mocked timers added (http://crbug.com/319529)
waitUntilAnotherActiveCleared(); waitUntilAnotherActiveCleared();
...@@ -93,39 +77,43 @@ function waitUntilActiveCleared() ...@@ -93,39 +77,43 @@ function waitUntilActiveCleared()
function waitUntilAnotherActiveCleared() function waitUntilAnotherActiveCleared()
{ {
if (isBoxActive()) { if (getHoverActiveState(box) == "hoveredAndActive") {
return setTimeout(waitUntilAnotherActiveCleared, 10); return setTimeout(waitUntilAnotherActiveCleared, 10);
} }
shouldBeFalse("isBoxActive()"); shouldBeDefault("getHoverActiveState(box)");
debug("Verify tapCancel elsewhere still clears active"); debug("Verify tapCancel elsewhere still clears active");
eventSender.gestureTapDown(50, 50);
eventSender.gestureShowPress(50, 50); eventSender.gestureShowPress(50, 50);
shouldBeTrue("isBoxActive()"); shouldBeHoveredAndActive("getHoverActiveState(box)");
eventSender.gestureTapCancel(400, 250); eventSender.gestureTapCancel(400, 250);
shouldBeFalse("isBoxActive()"); shouldBeDefault("getHoverActiveState(box)");
debug("Verify that touchstart doesn't trigger active state"); debug("Verify that touchStart doesn't trigger active state");
eventSender.addTouchPoint(50, 50); eventSender.addTouchPoint(50, 50);
eventSender.touchStart(); eventSender.touchStart();
shouldBeFalse("isBoxActive()"); shouldBeDefault("getHoverActiveState(box)");
eventSender.releaseTouchPoint(0); eventSender.releaseTouchPoint(0);
eventSender.touchEnd(); eventSender.touchEnd();
debug("Verify that touchstart/touchend doesn't cancel active"); debug("Verify that touchStart/touchEnd doesn't cancel active");
eventSender.gestureTapDown(50, 50);
eventSender.gestureShowPress(50, 50); eventSender.gestureShowPress(50, 50);
shouldBeTrue("isBoxActive()"); shouldBeHoveredAndActive("getHoverActiveState(box)");
eventSender.addTouchPoint(50, 50); eventSender.addTouchPoint(50, 50);
eventSender.touchStart(); eventSender.touchStart();
shouldBeTrue("isBoxActive()"); shouldBeHoveredAndActive("getHoverActiveState(box)");
eventSender.releaseTouchPoint(0); eventSender.releaseTouchPoint(0);
eventSender.touchEnd(); eventSender.touchEnd();
shouldBeTrue("isBoxActive()"); shouldBeHoveredAndActive("getHoverActiveState(box)");
eventSender.gestureTapCancel(50, 50);
shouldBeOnlyHovered("getHoverActiveState(box)");
finishJSTest(); finishJSTest();
} }
runTests(); window.onload = runTests;
</script> </script>
</body> </body>
</html> </html>
third_party/WebKit/LayoutTests/fast/events/touch/gesture/gesture-tap-cancel-hover-state-expected.txt
View file @ 4bd9b3c0
...@@ -6,21 +6,21 @@ On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE ...@@ -6,21 +6,21 @@ On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE
See http://crbug.com/316974 for details See http://crbug.com/316974 for details
Verify hover, active aren't initially set
PASS isBoxDefault() is true
tapcancel on element when it is Active should keep hover
PASS isBoxHoverActive() is true
PASS isBoxHovered() is true
tapcancel outside element when it is Active should clear it
PASS isBoxHoverActive() is true
PASS isBoxDefault() is true
tapcancel on element when it is hovered but not active should keep hover
PASS isBoxHovered() is true
PASS isBoxHovered() is true
tapcancel outside element when it is hovered but not active should keep hover
PASS isBoxHovered() is true
PASS isBoxHovered() is true
PASS successfullyParsed is true PASS successfullyParsed is true
TEST COMPLETE TEST COMPLETE
Verify hover, active aren't initially set
PASS getHoverActiveState(box) is "default"
tapCancel on element when it is Active should keep hover
PASS getHoverActiveState(box) is "hoveredAndActive"
PASS getHoverActiveState(box) is "hovered"
tapCancel outside element when it is Active should clear it
PASS getHoverActiveState(box) is "hoveredAndActive"
PASS getHoverActiveState(box) is "default"
tapCancel on element when it is hovered but not active should keep hover
PASS getHoverActiveState(box) is "hovered"
PASS getHoverActiveState(box) is "hovered"
tapCancel outside element when it is hovered but not active should keep hover
PASS getHoverActiveState(box) is "hovered"
PASS getHoverActiveState(box) is "hovered"
third_party/WebKit/LayoutTests/fast/events/touch/gesture/gesture-tap-cancel-hover-state.html
View file @ 4bd9b3c0
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<script src="../../../../resources/js-test.js"></script> <script src="../../../../resources/js-test.js"></script>
<link rel="stylesheet" href="../resources/touch-hover-active-tests.css">
<style type="text/css"> <style type="text/css">
#box { #box {
background-color: blue;
width: 300px; width: 300px;
height: 100px; height: 100px;
} }
#box:hover {
background-color: red;
}
#box:active {
background-color: green;
}
#box:hover:active {
background-color: yellow;
}
</style> </style>
<body> <body>
<div id="box">Gestures go here</div> <div id="box" class="touch-interactive">Gestures go here</div>
<p id="description"></p> <p id="description"></p>
<p>See http://crbug.com/316974 for details</p> <p>See http://crbug.com/316974 for details</p>
<div id="console"></div> <div id="console"></div>
<script src="../resources/touch-hover-active-tests.js"></script>
<script> <script>
var color; var box = document.getElementById("box");
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)");
}
description("Tests that gesture tapcancel clears hover properly"); description("Tests that gesture tapcancel clears hover properly");
function runTests() function runTests()
...@@ -79,34 +35,36 @@ function runTests() ...@@ -79,34 +35,36 @@ function runTests()
} }
debug("Verify hover, active aren't initially set"); debug("Verify hover, active aren't initially set");
shouldBeTrue("isBoxDefault()"); shouldBeDefault("getHoverActiveState(box)");
debug("tapcancel on element when it is Active should keep hover"); debug("tapCancel on element when it is Active should keep hover");
eventSender.gestureTapDown(50, 50);
eventSender.gestureShowPress(50, 50); eventSender.gestureShowPress(50, 50);
shouldBeTrue("isBoxHoverActive()"); shouldBeHoveredAndActive("getHoverActiveState(box)");
eventSender.gestureTapCancel(50, 50); eventSender.gestureTapCancel(50, 50);
shouldBeTrue("isBoxHovered()"); shouldBeOnlyHovered("getHoverActiveState(box)");
debug("tapcancel outside element when it is Active should clear it"); debug("tapCancel outside element when it is Active should clear it");
eventSender.gestureTapDown(50, 50);
eventSender.gestureShowPress(50, 50); eventSender.gestureShowPress(50, 50);
shouldBeTrue("isBoxHoverActive()"); shouldBeHoveredAndActive("getHoverActiveState(box)");
eventSender.gestureTapCancel(400, 250); eventSender.gestureTapCancel(400, 250);
shouldBeTrue("isBoxDefault()"); shouldBeDefault("getHoverActiveState(box)");
debug("tapcancel on element when it is hovered but not active should keep hover"); debug("tapCancel on element when it is hovered but not active should keep hover");
eventSender.mouseMoveTo(50, 50); eventSender.mouseMoveTo(50, 50);
shouldBeTrue("isBoxHovered()"); shouldBeOnlyHovered("getHoverActiveState(box)");
eventSender.gestureTapCancel(50, 50); eventSender.gestureTapCancel(50, 50);
shouldBeTrue("isBoxHovered()"); shouldBeOnlyHovered("getHoverActiveState(box)");
debug("tapcancel outside element when it is hovered but not active should keep hover"); debug("tapCancel outside element when it is hovered but not active should keep hover");
eventSender.mouseMoveTo(50, 50); eventSender.mouseMoveTo(50, 50);
shouldBeTrue("isBoxHovered()"); shouldBeOnlyHovered("getHoverActiveState(box)");
eventSender.gestureTapCancel(400, 250); eventSender.gestureTapCancel(400, 250);
shouldBeTrue("isBoxHovered()"); shouldBeOnlyHovered("getHoverActiveState(box)");
} }
runTests(); window.onload = runTests;
</script> </script>
</body> </body>
</html> </html>
......
third_party/WebKit/LayoutTests/fast/events/touch/gesture/resources/gesture-tap-active-state-iframe-inner.html
View file @ 4bd9b3c0
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<link rel="stylesheet" href="../../resources/touch-hover-active-tests.css">
<style type="text/css"> <style type="text/css">
#box { #box {
position: absolute; position: absolute;
background-color: blue;
width: 300px; width: 300px;
height: 100px; height: 100px;
top: 100px; top: 100px;
} }
#box:active {
background-color: red;
}
</style> </style>
<script> <body>
var color; <div id='box' class='touch-interactive'>Gestures go here</div>
function isBoxActive()
{
// These need to match the background-color used above, after round-tripping.
var defaultColor = "rgb(0, 0, 255)";
var activeColor = "rgb(255, 0, 0)";
var b = document.getElementById('box');
color = getComputedStyle(b).backgroundColor;
if (color == activeColor)
return true;
if (color != defaultColor)
throw "Got unexpected backgroundColor: " + color;
return false;
}
</script>
<body onload='parent.runTests(isBoxActive)'>
<div id='box'>Gestures go here</div>
</body> </body>
</html> </html>
third_party/WebKit/LayoutTests/fast/events/touch/resources/touch-hover-active-tests.css 0 → 100644
View file @ 4bd9b3c0
.touch-interactive {
background-color: blue;
}
.touch-interactive:hover {
background-color: red
}
.touch-interactive:active {
background-color: green;
}
.touch-interactive:hover:active {
background-color: yellow;
}
third_party/WebKit/LayoutTests/fast/events/touch/resources/touch-hover-active-tests.js 0 → 100644
View file @ 4bd9b3c0
function getHoverActiveState(e)
{
var states = {
"rgb(0, 0, 255)": "default",
"rgb(0, 255, 0)": "active",
"rgb(255, 0, 0)": "hovered",
"rgb(255, 255, 0)": "hoveredAndActive"
};
var color = window.getComputedStyle(e).backgroundColor;
var result = states[color];
if (!result)
result = "unknown: " + color;
return result;
}
function elementCenter(e)
{
return {
x: e.offsetLeft + e.offsetWidth / 2,
y: e.offsetTop + e.offsetHeight / 2
}
}
function shouldBeDefault(e) { shouldBeEqualToString(e, "default"); }
function shouldBeOnlyActive(e) { shouldBeEqualToString(e, "active"); }
function shouldBeOnlyHovered(e) { shouldBeEqualToString(e, "hovered"); }
function shouldBeHoveredAndActive(e) { shouldBeEqualToString(e, "hoveredAndActive"); }
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment