+2015-05-07 Martin Robinson <mrobinson@igalia.com>
+
+ Remove touchadjustment tests
+ https://bugs.webkit.org/show_bug.cgi?id=144780
+
+ Reviewed by Daniel Bates.
+
+ These tests test a feature that has been removed from WebKit entirely and all
+ ports skip the tests. This code was removed in http://trac.webkit.org/changeset/162231.
+
+ * platform/efl/TestExpectations: Remove expectations.
+ * platform/gtk/TestExpectations: Ditto.
+ * platform/ios-simulator/TestExpectations: Ditto.
+ * platform/mac/TestExpectations: Ditto.
+ * platform/win/TestExpectations: Ditto.
+ * platform/wincairo/TestExpectations:
+ * touchadjustment: Removed all files in this directory.
+
2015-05-07 Simon Fraser <simon.fraser@apple.com>
New results after r183970. Fixed elements are now always considered to intersect
webkit.org/b/49142 fast/css/style-scoped [ Skip ]
-# These tests require TOUCH_ADJUSTMENT flag to be enabled
-webkit.org/b/78801 touchadjustment
-
# Tracking corner not being painted for TextArea.
webkit.org/b/9221 fast/css/resize-corner-tracking-transformed-iframe.html [ Missing ]
webkit.org/b/85484 fast/css/resize-corner-tracking-transformed.html [ Failure ]
webkit.org/b/95582 batterystatus [ Failure ]
webkit.org/b/95582 batterystatus/event-after-navigation.html [ Timeout ]
-# Touch adjustment not enabled
-webkit.org/b/99054 touchadjustment [ Failure ]
-webkit.org/b/99054 touchadjustment/iframe.html [ Timeout ]
-
# IETC flexbox failures
webkit.org/b/85211 ietestcenter/css3/flexbox/flexbox-align-stretch-001.htm [ ImageOnlyFailure ]
webkit.org/b/85212 ietestcenter/css3/flexbox/flexbox-layout-002.htm [ ImageOnlyFailure ]
java
mhtml
proximity
-touchadjustment
vibration
# ENABLE(MEDIA_CAPTURE) is not enabled
# Needs PageClients::vibrationClient() implementation.
webkit.org/b/72010 vibration
-# Touch adjustment not enabled
-webkit.org/b/78801 touchadjustment
-
# <rdar://problem/11059777>
webkit.org/b/81289 canvas/philip/tests/2d.line.cap.round.html [ Failure ]
# TODO Vibration API is not implemented.
vibration/ [ Skip ]
-# Touch adjustment not enabled on Windows (or mac)
-webkit.org/b/78801 touchadjustment/ [ Skip ]
-
# Needs BatteryClient implementation.
webkit.org/b/62698 batterystatus/ [ Skip ]
# https://bugs.webkit.org/show_bug.cgi?id=82628
svg/hittest/svg-ellipse-non-scale-stroke.xhtml
-# Touch adjustment not enabled
-# https://bugs.webkit.org/show_bug.cgi?id=78801
-touchadjustment
-
# https://bugs.webkit.org/show_bug.cgi?id=43022
tables/mozilla_expected_failures/bugs/bug85016.html
+++ /dev/null
-Test touch adjustment on a large div. The adjusted touch point should lie inside the target element and within the touch area.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-
-Overlapping touch above the target should snap to the top of the target element.
-PASS adjustedNode.id is element.id
-PASS adjustedPoint.x >= targetBounds.left is true
-PASS adjustedPoint.x <= targetBounds.left + targetBounds.width is true
-PASS adjustedPoint.y >= targetBounds.top is true
-PASS adjustedPoint.y <= targetBounds.top + targetBounds.height is true
-PASS adjustedPoint.x >= touchBounds.x is true
-PASS adjustedPoint.x <= touchBounds.x + touchBounds.width is true
-PASS adjustedPoint.y >= touchBounds.y is true
-PASS adjustedPoint.y <= touchBounds.y + touchBounds.height is true
-
-Overlapping touch below the target should snap to the bottom of the target element.
-PASS adjustedNode.id is element.id
-PASS adjustedPoint.x >= targetBounds.left is true
-PASS adjustedPoint.x <= targetBounds.left + targetBounds.width is true
-PASS adjustedPoint.y >= targetBounds.top is true
-PASS adjustedPoint.y <= targetBounds.top + targetBounds.height is true
-PASS adjustedPoint.x >= touchBounds.x is true
-PASS adjustedPoint.x <= touchBounds.x + touchBounds.width is true
-PASS adjustedPoint.y >= touchBounds.y is true
-PASS adjustedPoint.y <= touchBounds.y + touchBounds.height is true
-
-Overlapping touch left of the target should snap to the left side of the target element.
-PASS adjustedNode.id is element.id
-PASS adjustedPoint.x >= targetBounds.left is true
-PASS adjustedPoint.x <= targetBounds.left + targetBounds.width is true
-PASS adjustedPoint.y >= targetBounds.top is true
-PASS adjustedPoint.y <= targetBounds.top + targetBounds.height is true
-PASS adjustedPoint.x >= touchBounds.x is true
-PASS adjustedPoint.x <= touchBounds.x + touchBounds.width is true
-PASS adjustedPoint.y >= touchBounds.y is true
-PASS adjustedPoint.y <= touchBounds.y + touchBounds.height is true
-
-Overlapping touch right of the target should snap to the right side of the target element.
-PASS adjustedNode.id is element.id
-PASS adjustedPoint.x >= targetBounds.left is true
-PASS adjustedPoint.x <= targetBounds.left + targetBounds.width is true
-PASS adjustedPoint.y >= targetBounds.top is true
-PASS adjustedPoint.y <= targetBounds.top + targetBounds.height is true
-PASS adjustedPoint.x >= touchBounds.x is true
-PASS adjustedPoint.x <= touchBounds.x + touchBounds.width is true
-PASS adjustedPoint.y >= touchBounds.y is true
-PASS adjustedPoint.y <= touchBounds.y + touchBounds.height is true
-
-Test touch area contained within the target element.
-PASS adjustedNode.id is element.id
-PASS adjustedPoint.x >= targetBounds.left is true
-PASS adjustedPoint.x <= targetBounds.left + targetBounds.width is true
-PASS adjustedPoint.y >= targetBounds.top is true
-PASS adjustedPoint.y <= targetBounds.top + targetBounds.height is true
-PASS adjustedPoint.x >= touchBounds.x is true
-PASS adjustedPoint.x <= touchBounds.x + touchBounds.width is true
-PASS adjustedPoint.y >= touchBounds.y is true
-PASS adjustedPoint.y <= touchBounds.y + touchBounds.height is true
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Touch Adjustment : Too aggresive adjustments for large elements - bug 91262</title>
- <script src="../resources/js-test-pre.js"></script>
- <script src="resources/touchadjustment.js"></script>
- <style>
- #targetDiv {
- background: #00f;
- height: 400px;
- width: 400px;
- }
- </style>
-</head>
-
-<body>
-
-<div id="targetDiv">
-</div>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- var element;
- var adjustedNode;
- var adjustedPoint;
- var targetBounds;
- var touchBounds;
-
- function runTouchTests() {
- element = document.getElementById("targetDiv");
- element.addEventListener('click', function() {}, false);
- document.addEventListener('click', function() {}, false);
-
- targetBounds = findAbsoluteBounds(element);
-
- var touchRadius = 10;
- var offset = touchRadius / 2;
- var midX = targetBounds.left + targetBounds.width / 2;
- var midY = targetBounds.top + targetBounds.height / 2;
-
- debug('\nOverlapping touch above the target should snap to the top of the target element.');
- testTouch(midX, targetBounds.top - offset, touchRadius, targetBounds);
- debug('\nOverlapping touch below the target should snap to the bottom of the target element.');
- testTouch(midX, targetBounds.top + targetBounds.height + offset, touchRadius, targetBounds);
- debug('\nOverlapping touch left of the target should snap to the left side of the target element.');
- testTouch(targetBounds.left - offset, midY, touchRadius, targetBounds);
- debug('\nOverlapping touch right of the target should snap to the right side of the target element.');
- testTouch(targetBounds.left + targetBounds.width + offset, midY, touchRadius, targetBounds);
- debug('\nTest touch area contained within the target element.');
- testTouch(midX, midY, touchRadius, targetBounds);
- }
-
- function testTouch(touchX, touchY, radius, targetBounds) {
-
- touchBounds = {
- x: touchX - radius,
- y: touchY - radius,
- width: 2 * radius,
- height: 2 * radius
- };
- adjustedNode = internals.touchNodeAdjustedToBestClickableNode(touchBounds.x, touchBounds.y, touchBounds.width, touchBounds.height);
- shouldBe('adjustedNode.id', 'element.id');
- adjustedPoint = internals.touchPositionAdjustedToBestClickableNode(touchBounds.x, touchBounds.y, touchBounds.width, touchBounds.height);
-
- shouldBeTrue('adjustedPoint.x >= targetBounds.left');
- shouldBeTrue('adjustedPoint.x <= targetBounds.left + targetBounds.width');
- shouldBeTrue('adjustedPoint.y >= targetBounds.top');
- shouldBeTrue('adjustedPoint.y <= targetBounds.top + targetBounds.height');
- shouldBeTrue('adjustedPoint.x >= touchBounds.x');
- shouldBeTrue('adjustedPoint.x <= touchBounds.x + touchBounds.width');
- shouldBeTrue('adjustedPoint.y >= touchBounds.y');
- shouldBeTrue('adjustedPoint.y <= touchBounds.y + touchBounds.height');
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestClickableNode) {
- description('Test touch adjustment on a large div. The adjusted touch point should lie inside the target element and within the touch area.');
- runTouchTests();
- }
- }
- runTests();
-</script>
-<script src="../resources/js-test-post.js"></script>
-</body>
-</html>
+++ /dev/null
-Test touch-adjustment on a block where we also touch the inner text and outside link.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-PASS adjusted node was DIV#div1.
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Touch Adjustment: bug 82044</title>
- <script src="../resources/js-test-pre.js"></script>
- <script src="resources/touchadjustment.js"></script>
- <style>
- #sandbox { position: absolute; left: 0px; top: 0px; width: 400px; height: 200px; }
- #div1 { position: absolute; left: 50px; top: 50px; width: 200px; height: 50px;}
- #div2 { position: absolute; left: 50px; top: 100px; width: 200px; height: 50px;}
- </style>
-</head>
-<body>
- <div id=sandbox>
- <div id=div1 onclick=onClick>
- Some text.
- </div>
-
- <div id=div2>
- Some text. <a id=a1 href="#1">A link</a>
- </div>
- </div>
-
- <p id='description'></p>
- <div id='console'></div>
-
- <script>
- function onClick() {
- }
-
- function testDirectTouches()
- {
- testTouchPoint(touchPoint(200, 90, 200), document.getElementById('div1'));
-
- }
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestClickableNode) {
- description('Test touch-adjustment on a block where we also touch the inner text and outside link.');
- testDirectTouches();
- document.getElementById('sandbox').style.display = 'none';
- }
- }
- runTests();
- </script>
- <script src="../resources/js-test-post.js"></script>
-</body>
-</html>
\ No newline at end of file
+++ /dev/null
-Test touch adjustment for context-menu gestures.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-PASS adjusted node was A#a0.
-PASS adjusted node was SPAN#span0.
-PASS adjusted node was null.
-PASS adjusted node was SPAN#span0.
-PASS adjusted node was IMG#img0.
-PASS adjusted node was A#a0.
-PASS adjusted node was null.
-PASS adjusted node was A#a0.
-PASS adjusted node was IMG#img0.
-PASS adjusted node was IMG#img0.
-PASS adjusted node was SPAN#span0.
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-Test touch adjustment for context-menu gestures with automatic select behaviour.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-PASS adjusted node was null.
-PASS adjusted node was 'Text text text.'.
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Touch Adjustment : Adjust context-menu to selectable text - bug 94101</title>
- <script src="../resources/js-test-pre.js"></script>
- <script src="resources/touchadjustment.js"></script>
- <style>
- #sandbox {
- position: absolute;
- top: 0px;
- left: 0px;
- width: 400px;
- height: 200px;
- }
- #sandbox p {
- padding: 5px;
- font: 20px Ahem;
- }
- </style>
-</head>
-<body>
-
-<div id=sandbox>
- <p id=p1><span id=span1>Text text text.</span>
-</div>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- // Set up shortcut access to elements
- var e = {};
- ['sandbox', 'p1', 'span1'].forEach(function(a) {
- e[a] = document.getElementById(a);
- });
-
- function testAdjustedTouches()
- {
- // Set editing-behaviour to win, so context-menu gesture does not trigger selections.
- internals.settings.setEditingBehavior('win');
- // Check the context-menu is not adjusted to the selectable text.
- testTouchPointContextMenu(touchPoint(100, 30, 20), null, true);
- // Set editing-behaviour mac, so context-menu gesture triggers selections.
- internals.settings.setEditingBehavior('mac');
- // Check the context-menu is adjusted to the selectable text.
- testTouchPointContextMenu(touchPoint(100, 30, 20), "'Text text text.'", true);
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestContextMenuNode) {
- description('Test touch adjustment for context-menu gestures with automatic select behaviour.');
- testAdjustedTouches();
- e.sandbox.style.display = 'none';
- }
- }
- runTests();
-</script>
-
-<script src="../resources/js-test-post.js"></script>
-
-</body>
-</html>
+++ /dev/null
-Test touch adjustment for context-menu gestures on a shadow-DOM element.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-PASS adjusted node was null.
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Touch Adjustment : Handle long press on a shadow DOM element - bug 96313</title>
- <script src="../resources/js-test-pre.js"></script>
- <script src="resources/touchadjustment.js"></script>
- <style>
- #sandbox {
- background: #00f;
- position: absolute;
- top: 0px;
- left: 0px;
- width: 100px;
- height: 100px;
- }
- #description {
- margin-top: 110px;
- }
- </style>
-</head>
-
-<body>
-
-<div id="sandbox"></div>
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- var sandbox = document.getElementById('sandbox');
-
- function addShadowDOM() {
- var targetDiv = document.getElementById("sandbox");
- var root = internals.ensureShadowRoot(targetDiv);
- var shadowDiv = document.createElement("div");
- shadowDiv.style.width = "20px";
- shadowDiv.style.height = "20px";
- shadowDiv.style.background = "#ff0";
- shadowDiv.style.position = "absolute";
- shadowDiv.style.right = "10px";
- shadowDiv.style.top = "10px";
- root.appendChild(shadowDiv);
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestContextMenuNode && internals.ensureShadowRoot) {
- description('Test touch adjustment for context-menu gestures on a shadow-DOM element.');
- addShadowDOM();
- // Test that a long press centered on a shadow-DOM element does not crash.
- testTouchPointContextMenu(touchPoint(80, 20, 10), null);
- }
- }
- runTests();
-</script>
-<script src="../resources/js-test-post.js"></script>
-</body>
-</html>
+++ /dev/null
-Test touch-adjustment to individual words or active selection.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-PASS adjusted point was within (10,10)x(80,20)
-PASS adjusted point was within (10,10)x(80,20)
-PASS adjusted point was within (170,10)x(80,20)
-PASS adjusted point was within (170,10)x(80,20)
-PASS adjusted point was within (50,10)x(80,20)
-PASS adjusted point was within (50,10)x(80,20)
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Touch Adjustment : Adjust context-menu to text-node subtargets - bug 94449</title>
- <script src="../resources/js-test-pre.js"></script>
- <script src="resources/touchadjustment.js"></script>
- <style>
- #sandbox {
- position: absolute;
- top: 0px;
- left: 0px;
- width: 400px;
- height: 200px;
- }
- #sandbox div {
- padding: 10px;
- font: 20px Ahem;
- white-space: pre-wrap;
- }
- </style>
-</head>
-<body>
-
-<div id=sandbox>
-<!-- The layout of the two words should be: (10,10)x(80,20) and (170,10)x(80,20). -->
- <div id=div1><span id=span1>Text text</span></div>
-</div>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- // Set up shortcut access to elements
- var e = {};
- ['sandbox', 'div1', 'span1'].forEach(function(a) {
- e[a] = document.getElementById(a);
- });
-
- function testAdjustedTouches()
- {
- var adjustedPoint;
- var word1Bounds = { left: 10, top: 10, width: 80, height: 20 };
- var word2Bounds = { left: 170, top: 10, width: 80, height: 20 };
-
- // Set editing-behaviour mac, so context-menu gesture triggers selections.
- internals.settings.setEditingBehavior('mac');
- // Check the context-menu is adjusted to the individual words.
- adjustedPoint = adjustTouchPointContextMenu(touchPoint(5, 5, 20, 10));
- shouldBeWithin(adjustedPoint, word1Bounds);
- adjustedPoint = adjustTouchPointContextMenu(touchPoint(100, 15, 20, 10));
- shouldBeWithin(adjustedPoint, word1Bounds);
-
- adjustedPoint = adjustTouchPointContextMenu(touchPoint(150, 15, 30, 10));
- shouldBeWithin(adjustedPoint, word2Bounds);
- adjustedPoint = adjustTouchPointContextMenu(touchPoint(260, 35, 20, 10));
- shouldBeWithin(adjustedPoint, word2Bounds);
-
- // Set editing-behaviour to win, so context-menu gesture does not trigger selections.
- internals.settings.setEditingBehavior('win');
- var range = document.createRange();
- range.setStart(e.span1.firstChild, 2);
- range.setEnd(e.span1.firstChild, 6);
- window.getSelection().addRange(range);
- var selectionBounds = { left: 50, top: 10, width: 80, height: 20 };
- adjustedPoint = adjustTouchPointContextMenu(touchPoint(25, 5, 30, 20));
- shouldBeWithin(adjustedPoint, selectionBounds);
- adjustedPoint = adjustTouchPointContextMenu(touchPoint(140, 10, 20, 10));
- shouldBeWithin(adjustedPoint, selectionBounds);
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestContextMenuNode) {
- description('Test touch-adjustment to individual words or active selection.');
- testAdjustedTouches();
- e.sandbox.style.display = 'none';
- }
- }
- runTests();
-</script>
-
-<script src="../resources/js-test-post.js"></script>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Touch Adjustment : Adjust to context menu providers - bug 94101</title>
- <script src="../resources/js-test-pre.js"></script>
- <script src="resources/touchadjustment.js"></script>
- <style>
- #sandbox {
- position: absolute;
- top: 0px;
- left: 0px;
- width: 400px;
- height: 200px;
- }
- #sandbox p {
- padding: 5px;
- font: 20px Ahem;
- }
- </style>
-</head>
-<body>
-
-<script>
- function onClick() {}
-</script>
-
-<div id=sandbox>
- <p id=p0><a id=a0 href="#a0">Link with URL.</a>
- <p id=p1><span id=span0 onclick=onClick>Text with onclick handler.</span>
- <p id=p2><img id=img0 height=20 width=100 src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPAQMAAAABGAcJAAAAA1BMVEUAgACc+aWRAAAADElEQVR42mNgIAEAAAAtAAH7KhMqAAAAAElFTkSuQmCC"></img>
-</div>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- // Set up shortcut access to elements
- var e = {};
- ['sandbox', 'a0', 'span0', 'img0', 'p0', 'p1', 'p2'].forEach(function(a) {
- e[a] = document.getElementById(a);
- });
-
- function testDirectTouches()
- {
- // Check links can be targeted with context menu gesture.
- testTouchPointContextMenu(touchPoint(100, 35, 10), e.a0);
- // Check onclick can be targeted with activate gesture.
- testTouchPoint(touchPoint(100, 100, 10), e.span0);
- // Check onclick can not be targeted with context menu.
- testTouchPointContextMenu(touchPoint(100, 100, 10), null);
- // But that the adjusted point still hits it, if no better target is available
- var adjustedPoint = adjustTouchPointContextMenu(touchPoint(100, 100, 10));
- if (adjustedPoint) {
- shouldBeNode(document.elementFromPoint(adjustedPoint.x, adjustedPoint.y), e.span0);
- }
- // Check images can be targeted with context menu.
- testTouchPointContextMenu(offsetTouchPoint(findAbsoluteBounds(e.img0), 'center', 0, 5, 5), e.img0);
- }
-
- function testAdjustedTouches()
- {
- // Check we if we adjust the context menu onto the link.
- testTouchPointContextMenu(touchPoint(100, 50, 10), e.a0);
- // Check we if we do not adjust the context menu onto the onclick element.
- testTouchPointContextMenu(touchPoint(100, 70, 10), null);
- // Check the link is strongly preferred.
- testTouchPointContextMenu(touchPoint(100, 60, 20), e.a0);
- // Check adjustment onto the image.
- testTouchPointContextMenu(touchPoint(20, 140, 10), e.img0);
- // Check the image is strongly preferred for context menu gestures.
- testTouchPointContextMenu(touchPoint(20, 120, 30), e.img0);
- // But the onclick handler would be preferred for activate gestures.
- testTouchPoint(touchPoint(20, 120, 30), e.span0);
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestContextMenuNode) {
- description('Test touch adjustment for context-menu gestures.');
- // Set editing-behaviour to win, so context-menu gesture does not trigger selections.
- internals.settings.setEditingBehavior('win');
- testDirectTouches();
- testAdjustedTouches();
- e.sandbox.style.display = 'none';
- }
- }
- runTests();
-</script>
-
-<script src="../resources/js-test-post.js"></script>
-
-</body>
-</html>
+++ /dev/null
-Touch Adjustment : Disabled form elements - bug 92093
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-Test we can hit the form elements directly.
-PASS adjusted node was null.
-PASS adjusted node was LABEL#label2.
-PASS adjusted node was null.
-PASS adjusted node was INPUT#input2.
-Test indirect touches are adjusted to the enabled form elements.
-PASS adjusted node was LABEL#label2.
-PASS adjusted node was LABEL#label2.
-PASS adjusted node was LABEL#label2.
-PASS adjusted node was INPUT#input2.
-PASS adjusted node was INPUT#input2.
-PASS adjusted node was INPUT#input2.
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Touch Adjustment : Disabled form elements - bug 92093</title>
- <script src="../resources/js-test-pre.js"></script>
- <script src="resources/touchadjustment.js"></script>
- <style type="text/css">
- #sandbox {
- position: absolute;
- left: 0px;
- top: 0px;
- width: 600px;
- height: 600px;
- }
- </style>
-</head>
-
-<body id="body">
-
-<div id=sandbox>
- <form id="form">
- <label for="input1" id="label1">Label</label> <input type="text" id="input1" value="Disabled input" disabled></input><br>
- <label for="input2" id="label2">Label</label> <input type="text" id="input2" value="Enabled input"></input>
- </form>
-</div>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- // Set up shortcut access to elements
- var e = {};
- ['sandbox', 'form,', 'label1', 'label2', 'input1', 'input2'].forEach(function(a) {
- e[a] = document.getElementById(a);
- });
-
- function testDirectTouches()
- {
- // Quick sanity check.
- debug('Test we can hit the form elements directly.');
-
- testTouchPoint(touchPoint(16, 8, 5), null);
- testTouchPoint(touchPoint(16, 38, 5), e.label2);
- testTouchPoint(touchPoint(60, 8, 5), null);
- testTouchPoint(touchPoint(60, 38, 5), e.input2);
- }
-
- function testAdjustedTouches()
- {
- debug('Test indirect touches are adjusted to the enabled form elements.');
- testTouchPoint(touchPoint(16, 25, 10), e.label2);
- testTouchPoint(touchPoint(16, 20, 15), e.label2);
- testTouchPoint(touchPoint(16, 16, 20), e.label2);
-
- testTouchPoint(touchPoint(60, 25, 10), e.input2);
- testTouchPoint(touchPoint(60, 20, 15), e.input2);
- testTouchPoint(touchPoint(60, 16, 20), e.input2);
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestClickableNode) {
- description(document.title);
- testDirectTouches();
- testAdjustedTouches();
- e.sandbox.style.display = 'none';
- }
- }
-
- runTests();
-</script>
-
-<script src="../resources/js-test-post.js"></script>
-
-</body>
-</html>
+++ /dev/null
-
-Hello
-
-World
-Tests touch adjustment on a text-area.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-test textarea
-test direct touches
-PASS Math.floor((adjustedPoint.y - origin) / rowHeight) is 0
-PASS Math.floor((adjustedPoint.y - origin) / rowHeight) is 0
-PASS Math.floor((adjustedPoint.y - origin) / rowHeight) is 0
-PASS Math.floor((adjustedPoint.y - origin) / rowHeight) is 1
-PASS Math.floor((adjustedPoint.y - origin) / rowHeight) is 1
-PASS Math.floor((adjustedPoint.y - origin) / rowHeight) is 1
-PASS Math.floor((adjustedPoint.y - origin) / rowHeight) is 2
-PASS Math.floor((adjustedPoint.y - origin) / rowHeight) is 2
-PASS Math.floor((adjustedPoint.y - origin) / rowHeight) is 2
-test indirect touches
-PASS adjusted node was TEXTAREA#text-area.
-PASS adjusted node was TEXTAREA#text-area.
-PASS adjusted node was TEXTAREA#text-area.
-PASS adjusted node was TEXTAREA#text-area.
-test richly editable div
-test direct touches
-PASS Math.floor((adjustedPoint.y - origin) / rowHeight) is 0
-PASS Math.floor((adjustedPoint.y - origin) / rowHeight) is 0
-PASS Math.floor((adjustedPoint.y - origin) / rowHeight) is 0
-PASS Math.floor((adjustedPoint.y - origin) / rowHeight) is 1
-PASS Math.floor((adjustedPoint.y - origin) / rowHeight) is 1
-PASS Math.floor((adjustedPoint.y - origin) / rowHeight) is 1
-PASS Math.floor((adjustedPoint.y - origin) / rowHeight) is 2
-PASS Math.floor((adjustedPoint.y - origin) / rowHeight) is 2
-PASS Math.floor((adjustedPoint.y - origin) / rowHeight) is 2
-test indirect touches
-PASS adjusted node was DIV#rich-text.
-PASS adjusted node was DIV#rich-text.
-PASS adjusted node was DIV#rich-text.
-PASS adjusted node was DIV#rich-text.
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Touch Adjustment : content editable div - bug 97576</title>
- <script src="../resources/js-test-pre.js"></script>
- <script src="resources/touchadjustment.js"></script>
- <style>
- body {
- font-size: 12px;
- line-height: 14px;
- }
-
- #text-area,
- #rich-text {
- background: #eee;
- border: none;
- margin: 0 5px;
- padding: 0;
- }
-
- #rich-text {
- margin-top: 50px;
- outline: none;
- width: 300px;
- }
- </style>
-</head>
-
-<body>
-
-<div id=sandbox>
- <textarea id="text-area" rows="5" cols="40">A lengthy line of text.
-
-Another line of text separated by a blank line.</textarea>
-
- <div id="rich-text" contentEditable>
- <b>Hello</b><br><br><i>World</i>
- </div>
-</div>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- var element;
- var rowHeight;
- var touchOffset = 4;
- var touchRadius = 20;
- var origin;
- var adjustedNode;
- var adjustedPoint;
-
- function testTouchOnRow(row, offset) {
- var bounds = findAbsoluteBounds(element);
- var midPoint = bounds.left + 0.5 * bounds.width;
- var x = bounds.left + 2 * touchRadius;
- var y = bounds.top + (row + 0.5) * rowHeight + offset; // Vertically centered on row when offset is zero.
- var point = touchPoint(x, y, touchRadius, touchRadius);
- adjustedPoint = adjustTouchPoint(point);
- origin = bounds.top;
- shouldEvaluateTo('Math.floor((adjustedPoint.y - origin) / rowHeight)', row);
- }
-
- function testDirectTouches() {
- debug('test direct touches');
- // Touches centered on the blank line should not be adjusted a neighboring text line.
- for (var row = 0; row < 3; row++) {
- for (var offset = -touchOffset; offset <= touchOffset; offset += touchOffset) {
- testTouchOnRow(row, offset);
- }
- }
- }
-
- function testTouchOnBoundary(position) {
- var touchpoint = offsetTouchPoint(findAbsoluteBounds(element), position, touchOffset, touchRadius, touchRadius);
- testTouchPoint(touchpoint, element);
- }
-
- function testIndirectTouches() {
- debug('test indirect touches');
- testTouchOnBoundary('bottom');
- testTouchOnBoundary('left');
- testTouchOnBoundary('right');
- testTouchOnBoundary('top');
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestClickableNode) {
- description('Tests touch adjustment on a text-area.');
- debug('test textarea');
- element = document.getElementById('text-area');
- rowHeight = 15; // Height of each row is line-height + 1
- testDirectTouches();
- testIndirectTouches();
- debug('test richly editable div');
- element = document.getElementById('rich-text');
- rowHeight = 14;
- testDirectTouches();
- testIndirectTouches();
- }
- }
- runTests();
-</script>
-<script src="../resources/js-test-post.js"></script>
-</body>
-</html>
+++ /dev/null
-Test various ways to trigger input-widgets. On a touch interface, all the actions should be triggerable with either a touch down or a touch tap.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-Testing small direct hits
-PASS adjustedNode.id is element.id
-PASS adjustedNode.id is element.id
-PASS adjustedNode.id is element.id
-PASS adjustedNode.id is not element.id
-PASS adjustedNode.id is element.id
-Testing large direct hits
-PASS adjustedNode.id is element.id
-PASS adjustedNode.id is element.id
-PASS adjustedNode.id is element.id
-PASS adjustedNode.id is not element.id
-PASS adjustedNode.id is element.id
-Testing large direct hits
-PASS adjustedNode.id is element.id
-PASS adjustedNode.id is element.id
-PASS adjustedNode.id is element.id
-PASS adjustedNode.id is not element.id
-PASS adjustedNode.id is element.id
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Touch Adjustment : Event triggered widgets - bug 78801</title>
- <script src="../resources/js-test-pre.js"></script>
- <script src="resources/touchadjustment.js"></script>
- <style>
- .box { border: 1px solid black; border-radius: 5px 5px; margin: 1em; width: 40em; }
- </style>
-</head>
-
-<body>
-
-<div id=sandbox>
- <script>
- function triggerInput() {
- var element = event.srcElement;
- if (!element.open) {
- element.innerHTML = '<input type=text style="width: 100%"></input>'
- element.open = true;
- }
- element.firstChild.focus();
- }
- </script>
-
- <div id=test1 class=box tabindex=1 onfocus='triggerInput()'>
- Focus here should give a text input-field.
- </div>
-
- <div id=test2 class=box onmouseover='triggerInput()'>
- Mouse-over here should give a text input-field.
- </div>
-
- <style>
- .box:not(:hover) .hovertriggered { visibility: hidden;}
- .box:hover .hoverfallback { display: none; }
- </style>
-
- <div id=test3 class=box>
- <span class=hoverfallback>Hovering here should give a text input-field.</span>
- <input type=text class=hovertriggered></input>
- </div>
-
- <div id=test4 class=box onfocus='triggerInput()'>
- <span tabindex=1> Focusing here should only give focus outline to this inner text.
- </span>
- </div>
-
- <div class=box>
- <span id=test5 tabindex=1> Focusing here should give a text input-field.
- </span>
- </div>
-
- <script>
- var element = document.getElementById('test5');
- element.addEventListener('DOMFocusIn', triggerInput, false);
- </script>
-</div>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- var element;
- var adjustedNode;
- function findAbsolutePosition(node) {
- var pos = new Object();
- pos.left = 0; pos.top = 0;
- do {
- pos.left += node.offsetLeft;
- pos.top += node.offsetTop;
- } while (node = node.offsetParent);
- return pos;
- }
-
- function findBestClickableNode(x, y, width, height)
- {
- var adjustedNode = internals.touchNodeAdjustedToBestClickableNode(x, y, width, height);
- if (adjustedNode && adjustedNode.nodeType == 3) // TEXT node
- adjustedNode = adjustedNode.parentNode;
- return adjustedNode;
- }
-
- function testDirectTouch(element)
- {
- var touchpoint = offsetTouchPoint(findAbsoluteBounds(element), 'center', 0, 2, 2);
- adjustedNode = findBestClickableNode(touchpoint.left, touchpoint.top, touchpoint.width, touchpoint.height);
- }
-
- function testDirectFatFinger(element)
- {
- var touchpoint = offsetTouchPoint(findAbsoluteBounds(element), 'top', -5, element.clientHeight/2, (element.clientHeight+10)/2);
- adjustedNode = findBestClickableNode(touchpoint.left, touchpoint.top, touchpoint.width, touchpoint.height);
- }
-
- function testIndirectFatFinger(element)
- {
- var touchpoint = offsetTouchPoint(findAbsoluteBounds(element), 'top', 3, 5, 5);
- adjustedNode = findBestClickableNode(touchpoint.left, touchpoint.top, touchpoint.width, touchpoint.height);
- }
-
- function testTouchHit(elementid, touchType) {
- element = document.getElementById(elementid);
- touchType(element);
- shouldBe('adjustedNode.id', 'element.id');
- }
-
- function testTouchMiss(elementid, touchType) {
- element = document.getElementById(elementid);
- touchType(element);
- shouldNotBe('adjustedNode.id', 'element.id');
- }
-
- function testDirectTouches()
- {
- debug('Testing small direct hits');
- testTouchHit('test1', testDirectTouch);
- testTouchHit('test2', testDirectTouch);
- testTouchHit('test3', testDirectTouch);
- testTouchMiss('test4', testDirectTouch);
- testTouchHit('test5', testDirectTouch);
- }
-
- function testDirectFatFingers()
- {
- debug('Testing large direct hits');
- testTouchHit('test1', testDirectFatFinger);
- testTouchHit('test2', testDirectFatFinger);
- testTouchHit('test3', testDirectFatFinger);
- testTouchMiss('test4', testDirectFatFinger);
- testTouchHit('test5', testDirectFatFinger);
- }
-
- function testIndirectFatFingers()
- {
- debug('Testing large direct hits');
- testTouchHit('test1', testIndirectFatFinger);
- testTouchHit('test2', testIndirectFatFinger);
- testTouchHit('test3', testIndirectFatFinger);
- testTouchMiss('test4', testIndirectFatFinger);
- testTouchHit('test5', testIndirectFatFinger);
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestClickableNode) {
- description('Test various ways to trigger input-widgets. On a touch interface, all the actions should be triggerable with either a touch down or a touch tap.');
- testDirectTouches();
- testDirectFatFingers();
- testIndirectFatFingers();
- document.getElementById('sandbox').style.display = 'none';
- }
- }
- runTests();
-</script>
-<script src="../resources/js-test-post.js"></script>
-</body>
-</html>
+++ /dev/null
-ALERT: PASS!
-You should see "ALERT: PASS!"
-
+++ /dev/null
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-<html>
-<head>
-<title>Touch Adjustment : Fake mouse events not delivered when touching on a non-interactable node - bug 91012</title>
-<style type="text/css">
-div {
- width: 400px;
- height: 400px;
-}
-</style>
-<script type="text/javascript">
-function runTest()
-{
-/*
- WebKit generates fake mouse events on each touch event, here we test if
- the touch adjustment doesn't caused an early return not firing the fake
- mouse events used here to unfocus a simple text input.
-*/
- if (!window.eventSender || !window.testRunner)
- return;
-
- testRunner.dumpAsText();
-
- // Focus the text field
- var textInput = document.getElementById("textInput");
- if (document.activeElement === textInput)
- alert("FAILED!");
- textInput.focus();
- if (document.activeElement != textInput)
- alert("FAILED!");
-
- // Try to loose the focus touching on a non-editable element.
- var theDiv = document.getElementById("theDiv");
- var w = theDiv.clientWidth;
- var h = theDiv.clientHeight;
- var x = theDiv.offsetLeft + w/2;
- var y = theDiv.offsetTop + h/2;
-
- eventSender.clearTouchPoints();
- eventSender.setTouchPointRadius(10, 10);
- eventSender.addTouchPoint(x, y);
- eventSender.touchStart();
- eventSender.releaseTouchPoint(0);
- eventSender.touchEnd();
-
- // Need to wait a bit so the gesture recognizer will be sure this isn't a double tap.
- setTimeout(function() {
- if (document.activeElement == document.body)
- alert("PASS!")
- else
- alert("FAILED, " + document.activeElement.id + " is focused.");
- testRunner.notifyDone();
- }, 800);
-
- // Wait and see...
- testRunner.waitUntilDone();
-
-}
-
-</script>
-</head>
-<body onload="runTest()">
-<div id="theDiv">You should see "ALERT: PASS!"</div>
-<input id="textInput" type="text" value="Touch me please!" />
-</body>
-</html>
\ No newline at end of file
+++ /dev/null
-Tests if labels are treated as clickable if the input they control is.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-Testing small direct hits.
-PASS adjusted node was A#mylink.
-PASS adjusted node was LABEL#mylabel.
-PASS adjusted node was INPUT#myinput.
-Testing indirect hits.
-PASS adjusted node was A#mylink.
-PASS adjusted node was LABEL#mylabel.
-PASS adjusted node was INPUT#myinput.
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Touch Adjustment : HTML Label and form fields - bug 78801</title>
- <script src="../resources/js-test-pre.js"></script>
- <script src="resources/touchadjustment.js"></script>
- <style>
- #sandbox {
- position: absolute;
- left: 0px;
- top: 0px;
- font: 16px Ahem;
- }
- </style>
-</head>
-
-<body>
-
-<div id=sandbox>
- <a href="#myform" id="mylink">Do not click here</a><br>
- <form id="myform">
- <label for="myinput" id="mylabel">Click here,</label>
- <span id="myspan">but not here.</span>
- <input type="text" id="myinput" value="To focus this."></input>
- </form>
-</div>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- var element;
- var adjustedNode;
- // Set up shortcut access to elements
- var e = {};
- ['sandbox', 'mylink', 'myform', 'myinput', 'mylabel', 'myspan'].forEach(function(a) {
- e[a] = document.getElementById(a);
- });
-
- function testDirectTouch(element)
- {
- var touchpoint = offsetTouchPoint(findAbsoluteBounds(element), 'center', 0, 20, 30);
- testTouchPoint(touchpoint, element);
- }
-
- function testIndirectTouch(element, offset)
- {
- // Touch just right of the element.
- var touchpoint = offsetTouchPoint(findAbsoluteBounds(element), 'right', offset, 30, 20);
- testTouchPoint(touchpoint, element);
- }
-
- function testDirectTouches()
- {
- debug('Testing small direct hits.');
-
- testDirectTouch(e.mylink);
- testDirectTouch(e.mylabel);
- testDirectTouch(e.myinput);
- }
-
- function testIndirectTouches()
- {
- debug('Testing indirect hits.');
-
- testIndirectTouch(e.mylink, 10);
-
- // This case is very borderline - there's not much reason to adjust
- // left to the label instead of up to the link (it's closer to
- // the label, but overlaps with more of the link).
- testIndirectTouch(e.mylabel, 1);
-
- testIndirectTouch(e.myinput, 10);
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestClickableNode) {
- description('Tests if labels are treated as clickable if the input they control is.');
- testDirectTouches();
- testIndirectTouches();
- e.sandbox.style.display = 'none';
- }
- }
- runTests();
-</script>
-<script src="../resources/js-test-post.js"></script>
-</body>
-</html>
+++ /dev/null
-
-Test touch-adjustment on links in an iframe. Making sure we iframe position is correctly adjusted for.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-Test fat direct touches.
-PASS adjustedNode.id is "a1"
-PASS adjustedNode.id is "a2"
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Touch Adjustment : Correct for frame positions - bug 82043</title>
- <script src="../resources/js-test-pre.js"></script>
- <style>
- #myframe { position: absolute; left: 200px; top: 100px; width: 400px; height: 300px;}
- </style>
-</head>
-<body onload="runTests()">
-
-<iframe id=myframe src="resources/inner-frame.html"></iframe>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- function testRoundTouch(x, y, radius)
- {
- var x = x - radius;
- var y = y - radius;
- var width = radius * 2;
- var height = radius * 2;
- var adjustedNode = internals.touchNodeAdjustedToBestClickableNode(x, y, width, height);
- if (adjustedNode.nodeType == 3) // TEXT node
- adjustedNode = adjustedNode.parentNode;
- return adjustedNode;
- }
- function testDirectTouches()
- {
- debug('Test fat direct touches.');
-
- adjustedNode = testRoundTouch(260, 200, 200);
- shouldBeEqualToString('adjustedNode.id', 'a1');
-
- adjustedNode = testRoundTouch(340, 200, 200);
- shouldBeEqualToString('adjustedNode.id', 'a2');
-
- }
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestClickableNode) {
- description('Test touch-adjustment on links in an iframe. Making sure we iframe position is correctly adjusted for.');
- testDirectTouches();
- finishJSTest();
- }
- }
- jsTestIsAsync = true;
-</script>
-<script src="../resources/js-test-post.js"></script>
-</body>
-</html>
+++ /dev/null
-Test the case where a clickable target contains a shadow-DOM element. The adjusted point should snap to the location of the shadow-DOM element if close enough to the original touch position.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-PASS adjustedNode.id is element.id
-PASS adjustedPoint.x is within 10 of 88
-PASS adjustedPoint.y is within 10 of 28
-PASS adjustedNode.id is element.id
-PASS adjustedPoint.x is within 10 of 88
-PASS adjustedPoint.y is within 10 of 28
-PASS adjustedNode.id is element.id
-PASS adjustedPoint.x is within 10 of 88
-PASS adjustedPoint.y is within 10 of 28
-PASS adjustedNode.id is element.id
-PASS adjustedPoint.x is within 10 of 88
-PASS adjustedPoint.y is within 10 of 28
-PASS adjustedNode.id is element.id
-PASS adjustedPoint.x is within 1 of 58
-PASS adjustedPoint.y is within 1 of 58
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Touch Adjustment : Touch adjustment does not target shadow DOM elements - bug 89556</title>
- <script src="../resources/js-test-pre.js"></script>
- <style>
- #targetDiv {
- background: #00f;
- height: 100px;
- position: relative;
- width: 100px;
- }
- </style>
-
-</head>
-
-<body>
-
-<div id="targetDiv">
-</div>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- var element;
- var adjustedNode;
- var adjustedPoint;
-
- function findAbsolutePosition(node) {
- var pos = {left: 0, top: 0};
- do {
- pos.left += node.offsetLeft;
- pos.top += node.offsetTop;
- } while (node = node.offsetParent);
- return pos;
- }
-
- function addShadowDOM() {
- var targetDiv = document.getElementById("targetDiv");
- var root = internals.ensureShadowRoot(targetDiv);
- var shadowDiv = document.createElement("div");
- shadowDiv.style.width = "20px";
- shadowDiv.style.height = "20px";
- shadowDiv.style.background = "#ff0";
- shadowDiv.style.position = "absolute";
- shadowDiv.style.right = "10px";
- shadowDiv.style.top = "10px";
- shadowDiv.addEventListener('click', function() {}, false);
- root.appendChild(shadowDiv);
- }
-
- function runTouchTests() {
- element = document.getElementById("targetDiv");
- element.addEventListener('click', function() {}, false);
- document.addEventListener('click', function() {}, false);
-
- var pos = findAbsolutePosition(element);
- var x = pos.left;
- var y = pos.top;
- var width = element.clientWidth;
- var height = element.clientHeight;
- var midX = x + width / 2;
- var midY = y + height / 2;
- var border = 10;
- var targetRadius = 10;
- var padding = 30;
- var targetX = x + width - targetRadius - border;
- var targetY = y + targetRadius + border;
- var offset = 2;
-
- // Test touches that are just outside the bounds of the shadow-DOM. The adjusted point should be pulled within the bounds of the shadow-DOM node.
- testTouch(targetX + targetRadius + offset, targetY, padding, targetX, targetY, targetRadius);
- testTouch(targetX - targetRadius - offset, targetY, padding, targetX, targetY, targetRadius);
- testTouch(targetX, targetY + targetRadius + offset, padding, targetX, targetY, targetRadius);
- testTouch(targetX, targetY - targetRadius - offset, padding, targetX, targetY, targetRadius);
-
- // A touch in the center of targetDiv is sufficient distance from the shadow-DOM element that the position should not snap.
- testTouch(midX, midY, padding, midX, midY, 1);
- }
-
- function testTouch(touchX, touchY, padding, adjustedX, adjustedY, tolerance) {
- var left = touchX - padding / 2;
- var top = touchY - padding / 2;
- adjustedNode = internals.touchNodeAdjustedToBestClickableNode(left, top, padding, padding);
- shouldBe('adjustedNode.id', 'element.id');
- adjustedPoint = internals.touchPositionAdjustedToBestClickableNode(left, top, padding, padding);
- shouldBeCloseTo('adjustedPoint.x', adjustedX, tolerance);
- shouldBeCloseTo('adjustedPoint.y', adjustedY, tolerance);
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestClickableNode && internals.ensureShadowRoot) {
- description('Test the case where a clickable target contains a shadow-DOM element. The adjusted point should snap to the location of the shadow-DOM element if close enough to the original touch position.')
- addShadowDOM();
- runTouchTests();
- }
- }
- runTests();
-</script>
-<script src="../resources/js-test-post.js"></script>
-</body>
-</html>
+++ /dev/null
-Test the case where a clickable target is nested inside a document that is monitoring clicks. The target with the local event-handler should be chosen if multiple targets are touched.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-Testing small direct hits.
-PASS adjusted node was DIV#mybox1.
-PASS adjusted node was DIV#mybox2.
-Testing prefered hits.
-PASS adjusted node was DIV#mybox1.
-PASS adjusted node was DIV#mybox1.
-PASS adjusted node was DIV#mybox1.
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Touch Adjustment : Prefer deepest event handler - bug 78801</title>
- <script src="../resources/js-test-pre.js"></script>
- <script src="resources/touchadjustment.js"></script>
- <style>
- #sandbox { font: 16px Ahem; }
- .box { border: 1px solid black; border-radius: 5px 5px; margin: 12px; max-width: 40em; }
- </style>
-</head>
-
-<body>
-
-<div id=sandbox>
- <div class=box id=mybox1>
- Box with a local click handler.
- </div>
-
- <div class=box id=mybox2>
- Box without a local click handler.
- </div>
-</div>
-
-<script>
- function monitor(e) { alert(e.target +( e.target.id ? ( ' #' + e.target.id) : '')); };
- function doSomething(e) {};
-
- var element = document.getElementById('mybox1');
- element.addEventListener('click', doSomething, false);
- element = document.body;
- element.addEventListener('click', monitor, false);
-</script>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- var e = {};
- ['sandbox', 'mybox1', 'mybox2'].forEach(function(a) {
- e[a] = document.getElementById(a);
- });
-
- function touchPointDoubleTouch(element1, element2, offset)
- {
- var bounds1 = findAbsoluteBounds(element1);
- var bounds2 = findAbsoluteBounds(element2);
- var bounds = new Object();
- // We assume the elements have the same x coord and width.
- bounds.left = bounds1.left + bounds1.width/2 - 1;
- var y1 = bounds1.top + bounds1.height/2 + offset;
- var y2 = bounds2.top + bounds2.height/2 - 1;
- bounds.top = y1;
- bounds.width = y2 - y1;
- bounds.height = y2 - y1;
- return bounds;
- }
-
- function testDirectTouches()
- {
- debug('Testing small direct hits.');
-
- var touchpoint = offsetTouchPoint(findAbsoluteBounds(e.mybox1), 'center', 0, 2);
- testTouchPoint(touchpoint, e.mybox1);
-
- touchpoint = offsetTouchPoint(findAbsoluteBounds(e.mybox2), 'center', 0, 2);
- testTouchPoint(touchpoint, e.mybox2);
- }
-
- function testPreferedTouch()
- {
- debug('Testing prefered hits.');
-
- testTouchPoint(touchPointDoubleTouch(e.mybox1, e.mybox2, 0), e.mybox1);
-
- // First test was centered, now move the test closer to the wrong node, and ensure we still get the prefered node.
- testTouchPoint(touchPointDoubleTouch(e.mybox1, e.mybox2, 5), e.mybox1);
-
- testTouchPoint(touchPointDoubleTouch(e.mybox1, e.mybox2, 8), e.mybox1);
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestClickableNode) {
- description('Test the case where a clickable target is nested inside a document that is monitoring clicks. The target with the local event-handler should be chosen if multiple targets are touched.');
- testDirectTouches();
- testPreferedTouch();
- e['sandbox'].style.display = 'none';
- }
- }
- runTests();
-</script>
-<script src="../resources/js-test-post.js"></script>
-</body>
-</html>
+++ /dev/null
-Tests touch-adjustment at a plugin boundary.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-Test direct hits.
-PASS adjusted node was EMBED#plugin.
-PASS adjusted node was BUTTON#button1.
-PASS adjusted node was BUTTON#button2.
-PASS adjusted node was BUTTON#button3.
-Test hits spanning the plugin boundary.
-PASS adjusted node was EMBED#plugin.
-PASS adjusted node was BUTTON#button1.
-PASS adjusted node was EMBED#plugin.
-PASS adjusted node was BUTTON#button2.
-PASS adjusted node was EMBED#plugin.
-PASS adjusted node was BUTTON#button3.
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Touch Adjustment : Plugin boundary - bug ????</title>
- <script src="../resources/js-test-pre.js"></script>
- <script src="resources/touchadjustment.js"></script>
- <style>
- #plugin {
- height: 160px;
- margin-left: 10px;
- margin-top: 10px;
- width: 320px;
- }
- #toolbar {
- -webkit-box-align: stretch;
- -webkit-box-orient: horizontal;
- display: -webkit-box;
- margin-left: 10px;
- }
- </style>
-</head>
-<body>
-
-<div id=sandbox>
- <embed id="plugin" type="Application/x-webkit-test-webplugin">
- <div id="toolbar" onckick="function(){}">
- <button id="button1">A</button>
- <button id="button2">B</button>
- <button id="button3">C</button>
- </div>
-</div>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- // Set up shortcut access to elements
- var ids = ['sandbox', 'plugin', 'toolbar', 'button1', 'button2', 'button3'];
- var e = {};
- ids.forEach(function(a) {
- e[a] = document.getElementById(a);
- });
- var bounds = {};
- ids.forEach(function(a) {
- bounds[a] = findAbsoluteBounds(e[a]);
- });
-
- function testMidpoint(id)
- {
- var x = bounds[id].left + bounds[id].width / 2;
- var y = bounds[id].top + bounds[id].height / 2;
- testTouchPoint(touchPoint(x, y, 10), e[id]);
- }
-
- function testBoundary(buttonId)
- {
- var x = bounds[buttonId].left + bounds[buttonId].width / 2;
- var y = (bounds['plugin'].top + bounds['plugin'].height + bounds[buttonId].top) / 2;
- testTouchPoint(touchPoint(x, y - 5, 10), e['plugin']);
- testTouchPoint(touchPoint(x, y + 5, 10), e[buttonId]);
- }
-
- function testDirectTouches()
- {
- debug('Test direct hits.');
- testMidpoint('plugin');
- testMidpoint('button1');
- testMidpoint('button2');
- testMidpoint('button3');
- }
-
- function testIndirectTouches()
- {
- debug('Test hits spanning the plugin boundary.');
- testBoundary('button1');
- testBoundary('button2');
- testBoundary('button3');
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestClickableNode) {
- description('Tests touch-adjustment at a plugin boundary.');
- testDirectTouches();
- testIndirectTouches();
- e['sandbox'].style.display = 'none';
- }
- }
- runTests();
-</script>
-<script src="../resources/js-test-post.js"></script>
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <style>
- div {position: absolute; }
- </style>
-</head>
-<body>
-<div id=d1 style="width:200px;">
- <a href="#1" id=a1>Link 1</a>
-</div>
-<div id=d2 style="left:200px;width:200px;">
- <a href="#2" id=a2>Link 2</a>
-</div>
-</table>
-</body>
-</html>
\ No newline at end of file
+++ /dev/null
-/* function for finding the absolute bounds of a node (both inline and block) */
-function findAbsoluteBounds(node)
-{
- var bounds = node.getBoundingClientRect();
- return {
- left: bounds.left,
- top: bounds.top,
- width: bounds.right - bounds.left,
- height: bounds.bottom - bounds.top
- };
-}
-
-function nodeToString(node)
-{
- if (node === undefined)
- return 'undefined';
- if (node === null)
- return 'null';
- if (!node.nodeName)
- return 'not a node';
- if (node.nodeType == 3)
- return "'"+node.nodeValue+"'";
- return node.nodeName + (node.id ? ('#' + node.id) : '');
-}
-
-function boundsToString(bounds)
-{
- return "("+bounds.left+","+bounds.top+")x("+bounds.width+","+bounds.height+")";
-}
-
-function pointToString(point)
-{
- return "("+point.x+","+point.y+")";
-}
-
-
-function shouldBeNode(adjustedNode, targetNode) {
- if (typeof targetNode == "string") {
- var adjustedNodeString = nodeToString(adjustedNode);
- if (targetNode == adjustedNodeString) {
- testPassed("adjusted node was " + targetNode + ".");
- }
- else {
- testFailed("adjusted node should be " + targetNode + ". Was " + adjustedNodeString + ".");
- }
- return;
- }
- if (targetNode == adjustedNode) {
- testPassed("adjusted node was " + nodeToString(targetNode) + ".");
- }
- else {
- testFailed("adjusted node should be " + nodeToString(targetNode) + ". Was " + nodeToString(adjustedNode) + ".");
- }
-}
-
-function shouldBeWithin(adjustedPoint, targetArea) {
- if (adjustedPoint.x >= targetArea.left && adjustedPoint.y >= targetArea.top
- && adjustedPoint.x <= (targetArea.left + targetArea.width)
- && adjustedPoint.y <= (targetArea.top + targetArea.height)) {
- testPassed("adjusted point was within " + boundsToString(targetArea));
- } else {
- testFailed("adjusted node should be within " + boundsToString(targetArea) + ". Was " + pointToString(adjustedPoint));
- }
-}
-
-function testTouchPoint(touchpoint, targetNode, allowTextNodes)
-{
- var adjustedNode = internals.touchNodeAdjustedToBestClickableNode(touchpoint.left, touchpoint.top, touchpoint.width, touchpoint.height);
- if (!allowTextNodes && adjustedNode && adjustedNode.nodeType == 3)
- adjustedNode = adjustedNode.parentNode;
- shouldBeNode(adjustedNode, targetNode);
-}
-
-function testTouchPointContextMenu(touchpoint, targetNode, allowTextNodes)
-{
- var adjustedNode = internals.touchNodeAdjustedToBestContextMenuNode(touchpoint.left, touchpoint.top, touchpoint.width, touchpoint.height);
- if (!allowTextNodes && adjustedNode && adjustedNode.nodeType == 3)
- adjustedNode = adjustedNode.parentNode;
- shouldBeNode(adjustedNode, targetNode);
-}
-
-function adjustTouchPoint(touchpoint)
-{
- var adjustedPoint = internals.touchPositionAdjustedToBestClickableNode(touchpoint.left, touchpoint.top, touchpoint.width, touchpoint.height);
- return adjustedPoint;
-}
-
-function adjustTouchPointContextMenu(touchpoint)
-{
- var adjustedPoint = internals.touchPositionAdjustedToBestContextMenuNode(touchpoint.left, touchpoint.top, touchpoint.width, touchpoint.height);
- return adjustedPoint;
-}
-
-function touchPoint(x, y, radiusX, radiusY)
-{
- if (!radiusY)
- radiusY = radiusX;
-
- return {
- left: x - radiusX,
- top: y - radiusY,
- width: radiusX * 2,
- height: radiusY * 2,
- get x() { return this.left + this.width/2; },
- get y() { return this.top + this.height/2; }
- };
-}
-
-function offsetTouchPoint(bounds, relativePosition, touchOffset, touchRadiusX, touchRadiusY)
-{
- if (!touchRadiusY)
- touchRadiusY = touchRadiusX;
-
- // Start with the center of the touch at the top-left of the bounds.
- var touchpoint = touchPoint(bounds.left, bounds.top, touchRadiusX, touchRadiusY);
-
- // Adjust the touch point as requested.
- switch (relativePosition) {
- case 'center':
- touchpoint.left += bounds.width / 2;
- touchpoint.top += bounds.height / 2;
- break;
- case 'left':
- touchpoint.left -= touchOffset;
- touchpoint.top += bounds.height / 2;
- break;
- case 'right':
- touchpoint.left += bounds.width + touchOffset;
- touchpoint.top += bounds.height / 2;
- break;
- case 'top-left':
- touchpoint.left -= touchOffset;
- touchpoint.top -= touchOffset;
- break;
- case 'top-right':
- touchpoint.left += bounds.width + touchOffset;
- touchpoint.top -= touchOffset;
- break;
- case 'bottom-left':
- touchpoint.left -= touchOffset;
- touchpoint.top += bounds.height + touchOffset;
- break;
- case 'bottom-right':
- touchpoint.left += bounds.width + touchOffset;
- touchpoint.top += bounds.height + touchOffset;
- break;
- case 'top':
- touchpoint.left += bounds.width / 2;
- touchpoint.top -= touchOffset;
- break;
- case 'bottom':
- touchpoint.left += bounds.width / 2;
- touchpoint.top += bounds.height + touchOffset;
- }
-
- return touchpoint;
-}
+++ /dev/null
-Test touch adjustment to a non-rectilinear element.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-Direct Touches
-PASS adjusted node was DIV#rotated.
-PASS adjusted node was DIV#rotated.
-PASS adjusted node was DIV#rotated.
-PASS adjusted node was DIV#rotated.
-PASS adjusted node was DIV#rotated.
-PASS adjusted node was DIV#container.
-PASS adjusted node was DIV#container.
-PASS adjusted node was DIV#container.
-
-Adjusted Touches
-PASS adjusted node was DIV#rotated.
-PASS adjusted node was DIV#rotated.
-
-Near Misses
-PASS adjusted node was DIV#container.
-PASS adjusted node was DIV#container.
-
-Adjusted point within bounds
-PASS adjusted point was within (0,-20)x(40,40)
-PASS adjusted point was within (40,40)x(40,40)
-PASS adjusted point was within (-40,40)x(80,40)
-PASS adjusted point was within (50,-20)x(40,80)
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Test touch adjustment to a non-rectilinear element.</title>
- <script src="../resources/js-test-pre.js"></script>
- <script src="resources/touchadjustment.js"></script>
- <style>
- body { margin: 0px; padding: 0px; }
- #container {
- -webkit-box-sizing: border-box;
- position: relative;
- border: 1px solid black;
- height: 100px;
- width: 100px;
- }
- #rotated {
- -webkit-box-sizing: border-box;
- -webkit-transform: rotate(45deg);
- border: 1px solid black;
- height: 40px;
- left: 10px;
- position: absolute;
- top: 10px;
- width: 40px;
- }
- </style>
-
-</head>
-
-<body>
-
-<div id="container">
- <div id="rotated"></div>
-</div>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- // Set up shortcut access to elements
- var e = {};
- ['container', 'rotated'].forEach(function(a) {
- e[a] = document.getElementById(a);
- e[a].addEventListener('click', function() {}, false);
- });
-
- function testDirectTouches()
- {
- debug('Direct Touches');
-
- testTouchPoint(touchPoint(30, 30, 20), e.rotated);
- testTouchPoint(touchPoint(20, 30, 20), e.rotated);
- testTouchPoint(touchPoint(40, 30, 20), e.rotated);
- testTouchPoint(touchPoint(30, 20, 20), e.rotated);
- testTouchPoint(touchPoint(30, 40, 20), e.rotated);
-
- testTouchPoint(touchPoint(80, 80, 20), e.container);
- testTouchPoint(touchPoint(80, 20, 20), e.container);
- testTouchPoint(touchPoint(20, 80, 20), e.container);
- }
-
- function testAdjustedTouches()
- {
- debug('\nAdjusted Touches');
-
- // Touch overlaps center of element.
- testTouchPoint(touchPoint(10, 10, 30), e.rotated);
-
- // Touch overlaps corner of element.
- testTouchPoint(touchPoint(20, 0, 20), e.rotated);
-
- debug('\nNear Misses');
-
- // Touch overlaps bounding-box of element, but not the actual bounds.
- testTouchPoint(touchPoint(71, 0, 20), e.container);
- testTouchPoint(touchPoint(71, 60, 20), e.container);
- }
-
- function testAdjustedPoints()
- {
- debug('\nAdjusted point within bounds');
- var adjustedPoint = adjustTouchPoint(touchPoint(20, 0, 20))
- shouldBeWithin(adjustedPoint, touchPoint(20, 0, 20));
-
- adjustedPoint = adjustTouchPoint(touchPoint(60, 60, 20))
- shouldBeWithin(adjustedPoint, touchPoint(60, 60, 20));
-
- adjustedPoint = adjustTouchPoint(touchPoint(0, 60, 40, 20))
- shouldBeWithin(adjustedPoint, touchPoint(0, 60, 40, 20));
-
- adjustedPoint = adjustTouchPoint(touchPoint(70, 20, 20, 40))
- shouldBeWithin(adjustedPoint, touchPoint(70, 20, 20, 40));
- }
-
- function runTests()
- {
- document.addEventListener('click', function() {}, false);
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestClickableNode) {
- description(document.title);
- testDirectTouches();
- testAdjustedTouches();
- testAdjustedPoints()
- e.container.style.display = 'none';
- }
- }
- runTests();
-</script>
-<script src="../resources/js-test-post.js"></script>
-
-</body>
-</html>
+++ /dev/null
-
-Test iframe with main frame scroll offset case of tap-to-zoom mechanics.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-PASS zoomableArea.top is 600
-PASS zoomableArea.left is 100
-PASS zoomableArea.width is 200
-PASS zoomableArea.height is 100
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<html>
-<head>
- <script src="../../resources/js-test-pre.js"></script>
- <style>
- #scrolloffsetcontainer {
- position: absolute;
- top: 500px;
- height: 1000px;
- }
- body {
- margin: 0px;
- }
- </style>
-</head>
-<body onload="runTests()">
-
-<div id=scrolloffsetcontainer>
- <iframe frameborder='0px' src='data:text/html,
- <html>
- <head>
- <style>
- #div0 { position: absolute; left: 50px; top: 50px; width: 300px; height: 300px; box-sizing: border-box; }
- #div1 { position: absolute; left: 50px; top: 50px; width: 200px; height: 100px; box-sizing: border-box; }
- </style>
- </head>
- <body>
- <div id=div0>
- <div id=div1></div>
- </div>
- </body>
- </html>'>
- </iframe>
- <p id='description'></p>
- <div id='console'></div>
-</div>
-
-<script>
- function testRoundTouch(x, y, radius)
- {
- var x = x - radius;
- var y = y - radius;
- var width = radius * 2;
- var height = radius * 2;
- var zoomableRect = internals.bestZoomableAreaForTouchPoint(x, y, width, height);
- return zoomableRect;
- }
-
- function testDirectTouches()
- {
- zoomableArea = testRoundTouch(100, 600, 10);
- shouldEvaluateTo('zoomableArea.top', 600);
- shouldEvaluateTo('zoomableArea.left', 100);
- shouldEvaluateTo('zoomableArea.width', 200);
- shouldEvaluateTo('zoomableArea.height', 100);
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestClickableNode && internals.setDelegatesScrolling) {
- description('Test iframe with main frame scroll offset case of tap-to-zoom mechanics.');
- window.scrollBy(0,500);
- internals.setDelegatesScrolling(true);
- testRunner.dumpAsText();
- testRunner.waitUntilDone();
- testDirectTouches();
- isSuccessfullyParsed();
- testRunner.notifyDone();
- }
- }
-</script>
-</body>
-</html>
+++ /dev/null
-Test touch adjustment when main frame is scroll offset.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-PASS adjusted node was A#a0.
-PASS adjusted node was A#a1.
-PASS adjustedPoint is non-null.
-PASS adjustedNode is e.a0
-PASS adjustedPoint is non-null.
-PASS adjustedNode is e.a1
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Touch Adjustment : Adjust correctly for scroll offset - bug 86205</title>
- <script src="../resources/js-test-pre.js"></script>
- <script src="resources/touchadjustment.js"></script>
- <style>
- #scrolloffsetcontainer {
- position: absolute;
- top: 500px;
- height: 1000px;
- }
- body {
- margin: 0px;
- }
- #div0 { margin-left: 20px; height: 100px; box-sizing: border-box; }
- #div1 { margin-left: 10px; height: 100px; box-sizing: border-box; }
- </style>
-</head>
-<body>
-
-<div id=scrolloffsetcontainer>
- <div id=div0>
- <a id=a0 href="#div0">Link 0</a>
- </div>
- <div id=div1>
- <a id=a1 href="#div1">Link 1</a>
- </div>
-</div>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- var adjustedNode;
- var adjustedPoint;
- // Set up shortcut access to elements
- var e = {};
- ['scrolloffsetcontainer', 'div0', 'div1', 'a0', 'a1'].forEach(function(a) {
- e[a] = document.getElementById(a);
- });
-
- function adjustedPointAtTouch(x, y, radius)
- {
- var x = x - radius;
- var y = y - radius;
- var width = radius * 2;
- var height = radius * 2;
- var position = internals.touchPositionAdjustedToBestClickableNode(x, y, width, height);
- return position;
- }
-
- function testDirectTouches()
- {
- testTouchPoint(touchPoint(40, 130, 50), e.a0);
- testTouchPoint(touchPoint(30, 230, 50), e.a1);
- }
- function testAdjustedTouches()
- {
- adjustedPoint = adjustedPointAtTouch(10, 120, 80);
- shouldBeNonNull('adjustedPoint');
- adjustedNode = document.elementFromPoint(adjustedPoint.x, adjustedPoint.y);
- shouldBe('adjustedNode', 'e.a0');
-
- adjustedPoint = adjustedPointAtTouch(5, 220, 80);
- shouldBeNonNull('adjustedPoint');
- adjustedNode = document.elementFromPoint(adjustedPoint.x, adjustedPoint.y);
- shouldBe('adjustedNode', 'e.a1');
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestClickableNode) {
- description('Test touch adjustment when main frame is scroll offset.');
- window.scrollBy(0,400);
- testDirectTouches();
- testAdjustedTouches();
- e.scrolloffsetcontainer.style.display = 'none';
- }
- }
- runTests();
-</script>
-
-<script src="../resources/js-test-post.js"></script>
-
-</body>
-</html>
+++ /dev/null
-
-Test touch adjustment on a search field with a visible cancel button.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-
-Touch centered on cancel button but overlapping neighboring candidate.
-PASS targetContainsPoint is true
-PASS touchContainsPoint is true
-
-Off-center touches enclosing cancel button.
-PASS targetContainsPoint is true
-PASS touchContainsPoint is true
-PASS targetContainsPoint is true
-PASS touchContainsPoint is true
-PASS targetContainsPoint is true
-PASS touchContainsPoint is true
-
-Touches clipping left edge of cancel-button.
-PASS targetContainsPoint is true
-PASS touchContainsPoint is true
-PASS targetContainsPoint is true
-PASS touchContainsPoint is true
-PASS targetContainsPoint is true
-PASS touchContainsPoint is true
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Touch Adjustment : Shadow DOM Element Search Cancel Button - bug 91894</title>
- <script src="../resources/js-test-pre.js"></script>
- <script src="resources/touchadjustment.js"></script>
- <style>
- input[type='search'] {
- -webkit-appearance: none;
- -webkit-box-sizing: border-box;
- border: 1px solid #999;
- padding: 5px;
- }
-
- input[type='search']::-webkit-search-cancel-button {
- -webkit-appearance: none;
- -webkit-box-sizing: border-box;
- background: #999;
- height: 10px;
- margin: 0;
- padding: 0;
- width: 10px;
- }
- </style>
-</head>
-
-<body>
-
-<div>
- <input id="target" type="search" value="abcd">
-</div>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- var element;
- var adjustedNode;
- var adjustedPoint;
- var inputBounds;
- var cancelBounds;
- var textContentBounds;
- var touchBounds;
- var targetBounds;
- var targetContainsPoint;
- var touchContainsPoint;
-
- function runTouchTests() {
- document.addEventListener('click', function() {}, false);
-
- element = document.getElementById('target');
-
- inputBounds = findAbsoluteBounds(element);
-
- var touchRadius = 20;
- var offset = touchRadius / 2;
-
- // Center of cancel button.
- var midX = inputBounds.left + inputBounds.width - 11;
- var midY = inputBounds.top + inputBounds.height / 2;
-
- cancelBounds = {
- left: midX - 5,
- top: midY - 5,
- width: 10,
- height: 10
- };
-
- textContentBounds = {
- left: inputBounds.left,
- top: inputBounds.top,
- width: inputBounds.width - 16,
- height: inputBounds.height
- };
-
- debug('\nTouch centered on cancel button but overlapping neighboring candidate.');
- testTouch(midX, midY, touchRadius, cancelBounds);
-
- debug('\nOff-center touches enclosing cancel button.');
- testTouch(midX - offset, midY, touchRadius, cancelBounds);
- testTouch(midX - offset, midY + offset, touchRadius, cancelBounds);
- testTouch(midX - offset, midY - offset, touchRadius, cancelBounds);
-
- debug('\nTouches clipping left edge of cancel-button.');
- testTouch(midX - touchRadius - 2, midY, touchRadius, textContentBounds);
- testTouch(midX - touchRadius - 2, midY - offset, touchRadius, textContentBounds);
- testTouch(midX - touchRadius - 2, midY + offset, touchRadius, textContentBounds);
- }
-
- function testTouch(touchX, touchY, radius, bounds) {
-
- targetBounds = bounds;
-
- touchBounds = {
- left: touchX - radius,
- top: touchY - radius,
- width: 2 * radius,
- height: 2 * radius
- };
- adjustedPoint = internals.touchPositionAdjustedToBestClickableNode(touchBounds.left, touchBounds.top, touchBounds.width, touchBounds.height);
- targetContainsPoint = containsPoint(targetBounds, adjustedPoint);
- touchContainsPoint = containsPoint(touchBounds, adjustedPoint);
- shouldBeTrue('targetContainsPoint');
- shouldBeTrue('touchContainsPoint');
- }
-
- function containsPoint(bounds, point) {
- return bounds.left <= point.x && bounds.top <= point.y && bounds.left + bounds.width >= point.x && bounds.left + bounds.height >= point.y;
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestClickableNode) {
- description('Test touch adjustment on a search field with a visible cancel button.');
- runTouchTests();
- }
- }
- runTests();
-</script>
-<script src="../resources/js-test-post.js"></script>
-</body>
-</html>
+++ /dev/null
-Tests if small clickable targets adjacent to larger clickable controls are properly targetted with touch adjustment.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-Testing small direct hits.
-PASS adjusted node was DIV#check.
-PASS adjusted node was INPUT#task.
-PASS adjusted node was INPUT#item-label.
-PASS adjusted node was DIV#remove-button.
-PASS adjusted node was DIV#combo-label.
-PASS adjusted node was DIV#drop-down-selector.
-Testing indirect hits.
-PASS adjusted node was DIV#check.
-PASS adjusted node was DIV#check.
-PASS adjusted node was DIV#check.
-PASS adjusted node was DIV#check.
-PASS adjusted node was DIV#check.
-PASS adjusted node was DIV#check.
-PASS adjusted node was DIV#check.
-PASS adjusted node was DIV#check.
-PASS adjusted node was DIV#remove-button.
-PASS adjusted node was DIV#remove-button.
-PASS adjusted node was DIV#remove-button.
-PASS adjusted node was DIV#remove-button.
-PASS adjusted node was DIV#remove-button.
-PASS adjusted node was DIV#remove-button.
-PASS adjusted node was DIV#remove-button.
-PASS adjusted node was DIV#remove-button.
-PASS adjusted node was DIV#drop-down-selector.
-PASS adjusted node was DIV#drop-down-selector.
-PASS adjusted node was DIV#drop-down-selector.
-PASS adjusted node was DIV#drop-down-selector.
-PASS adjusted node was DIV#drop-down-selector.
-PASS adjusted node was DIV#drop-down-selector.
-PASS adjusted node was DIV#drop-down-selector.
-PASS adjusted node was DIV#drop-down-selector.
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
-<title>Touch Adjustment : Improved targetting for small controls - bug 92293</title>
-<script src="../resources/js-test-pre.js"></script>
-<script src="resources/touchadjustment.js"></script>
-
-<style>
- body {
- -webkit-margin-start: 20px;
- margin-top: 20px;
- }
- .control-pair {
- margin-bottom: 30px;
- }
-
- #check {
- border: 1px solid black;
- display: inline-block;
- padding: 5px;
- vertical-align: middle;
- }
-
- #remove-button {
- border: none;
- background: #999;
- display: inline-block;
- padding: 5px;
- vertical-align: middle;
- }
-
- #combo-button {
- border: 1px solid #777;
- padding: 5px;
- margin-top: 20px;
- }
-
- #combo-label {
- border: 1px solid #777;
- height: 1em;
- width: 4em;
- }
-
- #combo-button,
- #combo-label,
- #drop-down-selector {
- display: inline-block;
- vertical-align: middle;
- }
-
- #drop-down-selector {
- -webkit-box-sizing: content-box;
- width: 0;
- height: 0;
- border-left: 5px solid transparent;
- border-right: 5px solid transparent;
- border-top: 10px solid #777;
- }
-
-</style>
-
-</head>
-
-<body id="mybody">
-
-<div id=sandbox>
- <div class="control-pair">
- <!-- Small checkbox to the left of another control -->
- <div id="check" onclick="onClick();"></div>
- <input id="task" type="text" value="Task 1">
- </div>
- <div class="control-pair">
- <!-- Small remove button to the right of another control -->
- <input id = "item-label" type="text" value = "Option 1">
- <div id = "remove-button" onclick="onClick();"></div>
- </div>
- <div>
- <div id="combo-button">
- <!-- Combo-button controls -->
- <div id = "combo-label" onclick="function() {};"></div>
- <div id = "drop-down-selector" onclick="onClick();"></div>
- </div>
- </div>
-</div>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- var touchRadius = 20;
- var touchOffset = 8;
-
- var element;
- var adjustedNode;
-
- function onClick()
- {
- }
-
- function testDirectTouch(id)
- {
- testTouch(id, 'center');
- }
-
- function testIndirectTouch(id)
- {
- testTouch(id, 'left');
- testTouch(id, 'right');
- testTouch(id, 'top-left');
- testTouch(id, 'top-right');
- testTouch(id, 'bottom-left');
- testTouch(id, 'bottom-right');
- testTouch(id, 'top');
- testTouch(id, 'bottom');
- }
-
- function testTouch(id, relativePosition)
- {
- var element = document.getElementById(id);
- testTouchPoint(offsetTouchPoint(findAbsoluteBounds(element), relativePosition, touchOffset, touchRadius), element);
- }
-
- function testDirectTouches()
- {
- debug('Testing small direct hits.');
-
- testDirectTouch('check');
- testDirectTouch('task');
- testDirectTouch('item-label');
- testDirectTouch('remove-button');
- testDirectTouch('combo-label');
- testDirectTouch('drop-down-selector');
- }
-
- function testIndirectTouches()
- {
- debug('Testing indirect hits.');
-
- testIndirectTouch('check');
- testIndirectTouch('remove-button');
- testIndirectTouch('drop-down-selector');
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestClickableNode) {
- description('Tests if small clickable targets adjacent to larger clickable controls are properly targetted with touch adjustment.');
- testDirectTouches();
- testIndirectTouches();
- document.getElementById('sandbox').style.display = 'none';
- }
- }
- runTests();
-</script>
-<script src="../resources/js-test-post.js"></script>
-</body>
-</html>
+++ /dev/null
-Tests touch-adjustment on inline links. Making sure we can hit over line-breaks, and can miss when tapping between parts of a line-broken link.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-Test some direct hits.
-PASS adjusted node was A#1.
-PASS adjusted node was A#2.
-PASS adjusted node was A#4.
-PASS adjusted node was A#6.
-Test a few direct misses.
-PASS adjusted node was null.
-PASS adjusted node was null.
-Test some indirect hits.
-PASS adjusted node was A#2.
-PASS adjusted node was A#3.
-PASS adjusted node was A#4.
-PASS adjusted node was A#4.
-PASS adjusted node was A#6.
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Touch Adjustment : Inlines and line-breaks - bug 78801</title>
- <script src="../resources/js-test-pre.js"></script>
- <script src="resources/touchadjustment.js"></script>
- <style>
- #sandbox { position: absolute; top: 0px; left: 0px; font: 16px Ahem; line-height: 20px }
- </style>
-</head>
-<body>
-
-<div id=sandbox>
- <p style="width: 22em;">
- <a id="1" href="#1">some link</a><br>
- <a id="2" href="#2">some link breaking lines</a> and <a id="3" href="#3">link</a><br>
- hola mundo! <a id="4" href="#4">a split up link</a><br>
- hello world <a id="5" href="#5">some link also breaking</a><br>
- hi there <a id="6" href="#6">some link that is breaking multiple lines just for the very fun of it</a><br><br>
- </p>
-</div>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- // Set up shortcut access to elements
- var e = {};
- ['sandbox', '1', '2', '3', '4', '5', '6'].forEach(function(a) {
- e[a] = document.getElementById(a);
- });
-
- function testDirectTouches()
- {
- debug('Test some direct hits.');
- testTouchPoint(touchPoint(30, 25, 10), e['1']);
- testTouchPoint(touchPoint(20, 65, 10), e['2']);
- testTouchPoint(touchPoint(220, 85, 10), e['4']);
- testTouchPoint(touchPoint(80, 195, 10), e['6']);
- }
-
- function testDirectMisses()
- {
- debug('Test a few direct misses.');
- // Hit 'and' betwen link 2 and 3
- testTouchPoint(touchPoint(120, 75, 6), null);
- // Hit 'hi there' above and to the left of link 6.
- testTouchPoint(touchPoint(72, 166, 6), null);
- }
-
- function testIndirectTouches()
- {
- debug('Test some indirect hits.');
-
- testTouchPoint(touchPoint(50, 60, 20), e['2']);
- testTouchPoint(touchPoint(172, 83, 20), e['3']);
- testTouchPoint(touchPoint(230, 74, 20), e['4']);
- testTouchPoint(touchPoint(30, 100, 20), e['4']);
- testTouchPoint(touchPoint(24, 170, 20), e['6']);
-
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestClickableNode) {
- description('Tests touch-adjustment on inline links. Making sure we can hit over line-breaks, and can miss when tapping between parts of a line-broken link.');
- testDirectTouches();
- testDirectMisses();
- testIndirectTouches();
- e['sandbox'].style.display = 'none';
- }
- }
- runTests();
-</script>
-<script src="../resources/js-test-post.js"></script>
-</body>
-</html>
+++ /dev/null
-Tests that tapDown will trigger the active state.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-Testing indirect hits.
-PASS isLinkActive() is true
-PASS isLinkActive() is true
-PASS isLinkActive() is true
-Testing direct hits.
-PASS isLinkActive() is true
-PASS isLinkActive() is true
-PASS isLinkActive() is true
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Touch Adjustment : Testing that active will be set on a tapDown - bug 96677</title>
- <script src="../resources/js-test-pre.js"></script>
- <script src="resources/touchadjustment.js"></script>
- <style>
- #sandbox {
- position: absolute;
- left: 0px;
- top: 100px;
- }
- a {
- background-color: rgb(255,255,255);
- }
- a:active {
- background-color: rgb(0,0,255);
- }
- </style>
-</head>
-
-<body>
-
-<div id="sandbox">
-<p><a href="" id="link1">I</a> propose to consider <a href="" id="link2">the question</a>, "Can machines think?"<br>This should begin with definitions of the meaning of the terms "machine" and <a href="" id="link3">"think."</a></p>
-</div>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- var element;
- var adjustedNode;
- // Set up shortcut access to elements
- var e = {};
- ['sandbox', 'link1', 'link2', 'link3'].forEach(function(a) {
- e[a] = document.getElementById(a);
- });
-
- var curElement;
-
- function isLinkActive()
- {
- // These need to match the background-color used above, after round-tripping.
- var defaultColor = "rgb(255, 255, 255)";
- var activeColor = "rgb(0, 0, 255)";
-
- color = window.getComputedStyle(curElement).backgroundColor;
- if (color == activeColor)
- return true;
- if (color != defaultColor)
- testFailed('Got unexpected backgroundColor: ' + color);
- return false;
- }
-
- function testTapDown(touchpoint, element)
- {
- curElement = element;
- if (isLinkActive()) testFailed('Link unexpectedly active on entry');
- eventSender.gestureTapDown(touchpoint.x, touchpoint.y, touchpoint.width, touchpoint.height);
- shouldBeTrue("isLinkActive()");
- eventSender.gestureTapCancel(touchpoint.x, touchpoint.y);
- if (isLinkActive()) testFailed('Link unexpectedly active on exit');
- }
-
- function testDirectTouch(element)
- {
- // Touch directly in the center of the element.
- var touchpoint = offsetTouchPoint(findAbsoluteBounds(element), 'center', 0, 20, 30);
- if (document.elementFromPoint(touchpoint.x, touchpoint.y) != element)
- testFailed('Direct touch ended up on some other element');
- testTapDown(touchpoint, element);
- }
-
- function isDescendantOf(parent, child)
- {
- var n = child;
- while(n) {
- if(n==parent)
- return true;
- n = n.parentNode;
- }
- return false;
- }
-
- function testIndirectTouch(element)
- {
- // Touch just right of the element.
- var touchpoint = offsetTouchPoint(findAbsoluteBounds(element), 'right', 10, 30, 20);
- if (isDescendantOf(element, document.elementFromPoint(touchpoint.x, touchpoint.y)))
- testFailed('Indirect touch ended up still on top of the element');
- testTapDown(touchpoint, element);
- }
-
- function testDirectTouches()
- {
- debug('Testing direct hits.');
- testDirectTouch(e.link1);
- testDirectTouch(e.link2);
- testDirectTouch(e.link3);
- }
-
- function testIndirectTouches()
- {
- debug('Testing indirect hits.');
- testIndirectTouch(e.link1);
- testIndirectTouch(e.link2);
- testIndirectTouch(e.link3);
- }
-
- function runTests()
- {
- if (!window.eventSender) {
- debug('This test requires DumpRenderTree');
- return;
- }
- if (!window.eventSender.gestureTapDown) {
- debug('GestureTapDown not supported by this platform');
- return;
- }
-
- description('Tests that tapDown will trigger the active state.');
- testIndirectTouches();
- testDirectTouches();
- e.sandbox.style.display = 'none';
- }
- runTests();
-</script>
-<script src="../resources/js-test-post.js"></script>
-</body>
-</html>
+++ /dev/null
-Tests if a long press gesture on links will trigger a drag/drop when touch adjustment is used.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-Testing direct hits.
-PASS
-PASS
-PASS
-Testing indirect hits.
-PASS
-PASS
-PASS
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Touch Adjustment : Testing that a drag/drop will start on a long press - bug 92914</title>
- <script src="../resources/js-test-pre.js"></script>
- <script src="resources/touchadjustment.js"></script>
- <style>
- #sandbox {
- position: absolute;
- left: 0px;
- top: 0px;
- }
- </style>
-</head>
-
-<body>
-
-<div id="sandbox">
-<p><a href="" id="link1">I</a> propose to consider <a href="" id="link2">the question</a>, "Can machines think?"<br>This should begin with definitions of the meaning of the terms "machine" and <a href="" id="link3">"think."</a></p>
-</div>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- var element;
- var adjustedNode;
- // Set up shortcut access to elements
- var e = {};
- ['sandbox', 'link1', 'link2', 'link3'].forEach(function(a) {
- e[a] = document.getElementById(a);
- });
-
- document.ondragstart = function(e) { debug("PASS"); e.preventDefault();}
-
- function testLongPress(touchpoint)
- {
- if (eventSender.gestureLongPress)
- eventSender.gestureLongPress(touchpoint.x, touchpoint.y, touchpoint.width, touchpoint.height);
- else
- debug("gestureLongPress not implemented by this platform.");
- }
-
- function testDirectTouch(element)
- {
- // Touch directly in the center of the element.
- var touchpoint = offsetTouchPoint(findAbsoluteBounds(element), 'center', 0, 20, 30);
- if (document.elementFromPoint(touchpoint.x, touchpoint.y) != element)
- testFailed('Direct touch ended up on some other element');
- testLongPress(touchpoint);
- }
-
- function testIndirectTouch(element)
- {
- // Touch just right of the element.
- var touchpoint = offsetTouchPoint(findAbsoluteBounds(element), 'right', 10, 30, 20);
- if (isDescendantOf(element, document.elementFromPoint(touchpoint.x, touchpoint.y)))
- testFailed('Indirect touch ended up still on top of the element');
- testLongPress(touchpoint);
- }
-
- function isDescendantOf(parent, child)
- {
- var n = child;
- while(n) {
- if(n==parent)
- return true;
- n = n.parentNode;
- }
- return false;
- }
-
- function testDirectTouches()
- {
- debug('Testing direct hits.');
- testDirectTouch(e.link1);
- testDirectTouch(e.link2);
- testDirectTouch(e.link3);
- }
-
- function testIndirectTouches()
- {
- debug('Testing indirect hits.');
- testIndirectTouch(e.link1);
- testIndirectTouch(e.link2);
- testIndirectTouch(e.link3);
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestClickableNode) {
- internals.settings.setTouchDragDropEnabled(true);
- description('Tests if a long press gesture on links will trigger a drag/drop when touch adjustment is used.');
- testDirectTouches();
- testIndirectTouches();
- e.sandbox.style.display = 'none';
- }
- }
- runTests();
-</script>
-<script src="../resources/js-test-post.js"></script>
-</body>
-</html>
+++ /dev/null
-Tests if a two finger tap gesture on links will trigger a context menu when touch adjustment is used.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-Testing direct hits.
-PASS
-PASS
-PASS
-Testing indirect hits.
-PASS
-PASS
-PASS
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<!DOCTYPE html>
-<html>
-<head>
- <title>Touch Adjustment : Testing that a context menu will appear on a two-finger tap - bug 99947</title>
- <script src="../resources/js-test-pre.js"></script>
- <script src="resources/touchadjustment.js"></script>
- <style>
- #sandbox {
- position: absolute;
- left: 0px;
- top: 0px;
- }
- </style>
-</head>
-
-<body>
-
-<div id="sandbox">
-<p><a href="" id="link1">I</a> propose to consider <a href="" id="link2">the question</a>, "Can machines think?"<br>This should begin with definitions of the meaning of the terms "machine" and <a href="" id="link3">"think."</a></p>
-</div>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- var element;
- var adjustedNode;
- // Set up shortcut access to elements
- var e = {};
- ['sandbox', 'link1', 'link2', 'link3'].forEach(function(a) {
- e[a] = document.getElementById(a);
- });
-
- document.oncontextmenu = function() { debug("PASS"); }
-
- function testTwoFingerTap(touchpoint)
- {
- if (eventSender.gestureTwoFingerTap)
- eventSender.gestureTwoFingerTap(touchpoint.x, touchpoint.y, touchpoint.width, touchpoint.height);
- else
- debug("gestureTwoFingerTap not implemented by this platform.");
- }
-
- function testDirectTouch(element)
- {
- // Touch directly in the center of the element.
- var touchpoint = offsetTouchPoint(findAbsoluteBounds(element), 'center', 0, 20, 30);
- if (document.elementFromPoint(touchpoint.x, touchpoint.y) != element)
- testFailed('Direct touch ended up on some other element');
- testTwoFingerTap(touchpoint);
- }
-
- function testIndirectTouch(element)
- {
- // Touch just right of the element.
- var touchpoint = offsetTouchPoint(findAbsoluteBounds(element), 'right', 10, 30, 20);
- if (isDescendantOf(element, document.elementFromPoint(touchpoint.x, touchpoint.y)))
- testFailed('Indirect touch ended up still on top of the element');
- testTwoFingerTap(touchpoint);
- }
-
- function isDescendantOf(parent, child)
- {
- var n = child;
- while (n) {
- if (n == parent)
- return true;
- n = n.parentNode;
- }
- return false;
- }
-
- function testDirectTouches()
- {
- debug('Testing direct hits.');
- testDirectTouch(e.link1);
- testDirectTouch(e.link2);
- testDirectTouch(e.link3);
- }
-
- function testIndirectTouches()
- {
- debug('Testing indirect hits.');
- testIndirectTouch(e.link1);
- testIndirectTouch(e.link2);
- testIndirectTouch(e.link3);
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestClickableNode) {
- description('Tests if a two finger tap gesture on links will trigger a context menu when touch adjustment is used.');
- testDirectTouches();
- testIndirectTouches();
- e.sandbox.style.display = 'none';
- }
- }
- runTests();
-</script>
-<script src="../resources/js-test-post.js"></script>
-</body>
-</html>
+++ /dev/null
-Test basic cases of tap-to-zoom mechanics.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-PASS zoomableArea.top is 100
-PASS zoomableArea.left is 100
-PASS zoomableArea.width is 200
-PASS zoomableArea.height is 100
-PASS zoomableArea.top is 210
-PASS zoomableArea.left is 110
-PASS zoomableArea.width is 180
-PASS zoomableArea.height is 80
-PASS zoomableArea.top is 200
-PASS zoomableArea.left is 100
-PASS zoomableArea.width is 200
-PASS zoomableArea.height is 100
-PASS zoomableArea.top is 50
-PASS zoomableArea.left is 50
-PASS zoomableArea.width is 300
-PASS zoomableArea.height is 300
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<html>
-<head>
- <script src="../resources/js-test-pre.js"></script>
- <style>
- #div0 { position: absolute; left: 50px; top: 50px; width: 300px; height: 300px; box-sizing: border-box; }
- #div1 { position: absolute; left: 50px; top: 50px; width: 200px; height: 100px; box-sizing: border-box; }
- #div2 { position: absolute; left: 50px; top: 150px; width: 200px; height: 100px; padding: 10px; box-sizing: border-box; }
- </style>
-</head>
-<body onload="runTests()">
-
-<div id=div0>
- <div id=div1></div>
- <div id=div2></div>
-</div>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- function testRoundTouch(x, y, radius)
- {
- var x = x - radius;
- var y = y - radius;
- var width = radius * 2;
- var height = radius * 2;
- var zoomableRect = internals.bestZoomableAreaForTouchPoint(x, y, width, height);
- return zoomableRect;
- }
-
- function testDirectTouches()
- {
- zoomableArea = testRoundTouch(130, 130, 10);
- shouldEvaluateTo('zoomableArea.top', 100);
- shouldEvaluateTo('zoomableArea.left', 100);
- shouldEvaluateTo('zoomableArea.width', 200);
- shouldEvaluateTo('zoomableArea.height', 100);
-
- zoomableArea = testRoundTouch(130, 230, 10);
- shouldEvaluateTo('zoomableArea.top', 210);
- shouldEvaluateTo('zoomableArea.left', 110);
- shouldEvaluateTo('zoomableArea.width', 180);
- shouldEvaluateTo('zoomableArea.height', 80);
-
- zoomableArea = testRoundTouch(120, 220, 20);
- shouldEvaluateTo('zoomableArea.top', 200);
- shouldEvaluateTo('zoomableArea.left', 100);
- shouldEvaluateTo('zoomableArea.width', 200);
- shouldEvaluateTo('zoomableArea.height', 100);
-
- zoomableArea = testRoundTouch(80, 100, 20);
- shouldEvaluateTo('zoomableArea.top', 50);
- shouldEvaluateTo('zoomableArea.left', 50);
- shouldEvaluateTo('zoomableArea.width', 300);
- shouldEvaluateTo('zoomableArea.height',300);
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.bestZoomableAreaForTouchPoint) {
- description('Test basic cases of tap-to-zoom mechanics.');
- testRunner.dumpAsText();
- testRunner.waitUntilDone();
- testDirectTouches();
- isSuccessfullyParsed();
- testRunner.notifyDone();
- }
- }
-</script>
-</body>
-</html>
+++ /dev/null
-Test that targetted area is picked even if the touch area is not fully contained.
-
-On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-
-
-PASS zoomableArea.top is 100
-PASS zoomableArea.left is 100
-PASS zoomableArea.width is 200
-PASS zoomableArea.height is 20
-PASS successfullyParsed is true
-
-TEST COMPLETE
-
+++ /dev/null
-<html>
-<head>
- <script src="../resources/js-test-pre.js"></script>
- <style>
- #div1 { position: absolute; left: 100px; top: 100px; width: 200px; height: 20px; }
- </style>
-</head>
-<body onload="runTests()">
-
-<div id=div1></div>
-
-<p id='description'></p>
-<div id='console'></div>
-
-<script>
- function testRoundTouch(x, y, radius)
- {
- var x = x - radius;
- var y = y - radius;
- var width = radius * 2;
- var height = radius * 2;
- var zoomableRect = internals.bestZoomableAreaForTouchPoint(x, y, width, height);
- return zoomableRect;
- }
-
- function testDirectTouches()
- {
- zoomableArea = testRoundTouch(200, 110, 20);
- shouldEvaluateTo('zoomableArea.top', 100);
- shouldEvaluateTo('zoomableArea.left', 100);
- shouldEvaluateTo('zoomableArea.width', 200);
- shouldEvaluateTo('zoomableArea.height', 20);
-
- }
-
- function runTests()
- {
- if (window.testRunner && window.internals && internals.bestZoomableAreaForTouchPoint) {
- description('Test that targetted area is picked even if the touch area is not fully contained.');
- testRunner.dumpAsText();
- testRunner.waitUntilDone();
- testDirectTouches();
- isSuccessfullyParsed();
- testRunner.notifyDone();
- }
- }
-</script>
-</body>
-</html>
git://git.webkit.org / WebKit-https.git / commitdiff