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
See https://bugs.webkit.org/show_bug.cgi?id=96060 for details
PASS successfullyParsed is true
TEST COMPLETE
Verify active isn't initially set
PASS isBoxActive() is false
Verify tapdown,tap sets and clears active
PASS isBoxActive() is true
PASS isBoxActive() is false
Verify tapdown,tapcancel on the element sets and clears active
PASS isBoxActive() is true
PASS isBoxActive() is false
PASS getHoverActiveState(box) is "default"
Verify showPress, tap sets and clears active
PASS getHoverActiveState(box) is "hoveredAndActive"
PASS getHoverActiveState(box) is "hovered"
Verify showPress, tapCancel on the element sets and clears active
PASS getHoverActiveState(box) is "hoveredAndActive"
PASS getHoverActiveState(box) is "hovered"
Verify tap elsewhere still clears active
PASS isBoxActive() is true
PASS isBoxActive() is false
PASS getHoverActiveState(box) is "hoveredAndActive"
PASS getHoverActiveState(box) is "default"
Verify tapCancel elsewhere still clears active
PASS isBoxActive() is true
PASS isBoxActive() is false
Verify that touchstart doesn't trigger active state
PASS isBoxActive() is false
Verify that touchstart/touchend doesn't cancel active
PASS isBoxActive() is true
PASS isBoxActive() is true
PASS isBoxActive() is true
PASS getHoverActiveState(box) is "hoveredAndActive"
PASS getHoverActiveState(box) is "default"
Verify that touchStart doesn't trigger active state
PASS getHoverActiveState(box) is "default"
Verify that touchStart/touchEnd doesn't cancel active
PASS getHoverActiveState(box) is "hoveredAndActive"
PASS getHoverActiveState(box) is "hoveredAndActive"
PASS getHoverActiveState(box) is "hoveredAndActive"
PASS getHoverActiveState(box) is "hovered"
PASS successfullyParsed is true
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
See https://bugs.webkit.org/show_bug.cgi?id=96060 for details
Verify active isn't initially set
PASS isBoxActive() is false
Verify tapdown,tap sets and clears active
PASS isBoxActive() is true
PASS isBoxActive() is false
PASS getHoverActiveState(box) is "default"
Verify showPress, tap sets and clears active
PASS getHoverActiveState(box) is "hoveredAndActive"
PASS getHoverActiveState(box) is "hovered"
PASS successfullyParsed is true
TEST COMPLETE
......
third_party/WebKit/LayoutTests/fast/events/touch/gesture/gesture-tap-active-state-iframe.html
View file @ 4bd9b3c0
......@@ -8,7 +8,6 @@
left: 400px;
height: 3000px;
}
</style>
<body>
<iframe src='resources/gesture-tap-active-state-iframe-inner.html' id='frame'>
......@@ -19,15 +18,14 @@
<div id="console"></div>
<script src="../resources/touch-hover-active-tests.js"></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.");
var isBoxActive;
function runTests(ba)
function runTests()
{
isBoxActive = ba;
if (!window.eventSender) {
debug('This test requires DRT.');
return;
......@@ -38,15 +36,18 @@ function runTests(ba)
return;
}
box = document.getElementById("frame").contentDocument.getElementById('box');
// Scroll so the box is at the top
window.scrollTo(0, 400);
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);
shouldBeTrue("isBoxActive()");
shouldBeHoveredAndActive("getHoverActiveState(box)");
eventSender.gestureTap(450, 50);
// FIXME: Enable after implementing mocked timers (http://crbug.com/319529)
// shouldBeTrue("isBoxActive()");
......@@ -55,11 +56,11 @@ function runTests(ba)
function waitUntilActiveCleared()
{
if(isBoxActive()) {
if(getHoverActiveState(box) == "hoveredAndActive") {
return setTimeout(waitUntilActiveCleared, 10);
}
shouldBeFalse("isBoxActive()");
shouldBeOnlyHovered("getHoverActiveState(box)");
finishJSTest();
}
......@@ -68,6 +69,7 @@ if (window.testRunner) {
testRunner.waitUntilDone();
}
window.onload = runTests;
</script>
</body>
</html>
third_party/WebKit/LayoutTests/fast/events/touch/gesture/gesture-tap-active-state.html
View file @ 4bd9b3c0
<!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:active {
background-color: red;
}
</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 https://bugs.webkit.org/show_bug.cgi?id=96060 for details</p>
<div id="console"></div>
<script src="../resources/touch-hover-active-tests.js"></script>
<script>
var color;
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;
}
var box = document.getElementById("box");
description("Tests that tap gesture events set and clear the active state of elements.");
function runTests()
......@@ -58,34 +39,37 @@ function runTests()
}
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);
shouldBeTrue("isBoxActive()");
shouldBeHoveredAndActive("getHoverActiveState(box)");
eventSender.gestureTap(50, 50);
// FIXME: Enable after implementing mocked timers (http://crbug.com/319529)
// shouldBeTrue("isBoxActive()");
// shouldBeHoveredAndActive("getHoverActiveState(box)");
waitUntilActiveCleared();
}
function waitUntilActiveCleared()
{
if (isBoxActive()) {
if (getHoverActiveState(box) == "hoveredAndActive") {
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);
shouldBeTrue("isBoxActive()");
shouldBeHoveredAndActive("getHoverActiveState(box)");
eventSender.gestureTapCancel(50, 50);
shouldBeFalse("isBoxActive()");
shouldBeOnlyHovered("getHoverActiveState(box)");
debug("Verify tap elsewhere still clears active");
eventSender.gestureTapDown(50, 50);
eventSender.gestureShowPress(50, 50);
shouldBeTrue("isBoxActive()");
shouldBeHoveredAndActive("getHoverActiveState(box)");
eventSender.gestureTap(400, 250);
// FIXME: Remove after mocked timers added (http://crbug.com/319529)
waitUntilAnotherActiveCleared();
......@@ -93,39 +77,43 @@ function waitUntilActiveCleared()
function waitUntilAnotherActiveCleared()
{
if (isBoxActive()) {
if (getHoverActiveState(box) == "hoveredAndActive") {
return setTimeout(waitUntilAnotherActiveCleared, 10);
}
shouldBeFalse("isBoxActive()");
shouldBeDefault("getHoverActiveState(box)");
debug("Verify tapCancel elsewhere still clears active");
eventSender.gestureTapDown(50, 50);
eventSender.gestureShowPress(50, 50);
shouldBeTrue("isBoxActive()");
shouldBeHoveredAndActive("getHoverActiveState(box)");
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.touchStart();
shouldBeFalse("isBoxActive()");
shouldBeDefault("getHoverActiveState(box)");
eventSender.releaseTouchPoint(0);
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);
shouldBeTrue("isBoxActive()");
shouldBeHoveredAndActive("getHoverActiveState(box)");
eventSender.addTouchPoint(50, 50);
eventSender.touchStart();
shouldBeTrue("isBoxActive()");
shouldBeHoveredAndActive("getHoverActiveState(box)");
eventSender.releaseTouchPoint(0);
eventSender.touchEnd();
shouldBeTrue("isBoxActive()");
shouldBeHoveredAndActive("getHoverActiveState(box)");
eventSender.gestureTapCancel(50, 50);
shouldBeOnlyHovered("getHoverActiveState(box)");
finishJSTest();
}
runTests();
window.onload = runTests;
</script>
</body>
</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
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
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>
<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()");
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);
shouldBeTrue("isBoxHoverActive()");
shouldBeHoveredAndActive("getHoverActiveState(box)");
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);
shouldBeTrue("isBoxHoverActive()");
shouldBeHoveredAndActive("getHoverActiveState(box)");
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);
shouldBeTrue("isBoxHovered()");
shouldBeOnlyHovered("getHoverActiveState(box)");
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);
shouldBeTrue("isBoxHovered()");
shouldBeOnlyHovered("getHoverActiveState(box)");
eventSender.gestureTapCancel(400, 250);
shouldBeTrue("isBoxHovered()");
shouldBeOnlyHovered("getHoverActiveState(box)");
}
runTests();
window.onload = runTests;
</script>
</body>
</html>
......
third_party/WebKit/LayoutTests/fast/events/touch/gesture/resources/gesture-tap-active-state-iframe-inner.html
View file @ 4bd9b3c0
<!DOCTYPE html>
<html>
<link rel="stylesheet" href="../../resources/touch-hover-active-tests.css">
<style type="text/css">
#box {
position: absolute;
background-color: blue;
width: 300px;
height: 100px;
top: 100px;
}
#box:active {
background-color: red;
}
</style>
<script>
var color;
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>
<div id='box' class='touch-interactive'>Gestures go here</div>
</body>
</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