Diff
Modified: trunk/LayoutTests/ChangeLog (130110 => 130111)
--- trunk/LayoutTests/ChangeLog 2012-10-02 01:51:22 UTC (rev 130110)
+++ trunk/LayoutTests/ChangeLog 2012-10-02 01:55:29 UTC (rev 130111)
@@ -1,3 +1,28 @@
+2012-10-01 Keishi Hattori <kei...@webkit.org>
+
+ Add more tests for calendar picker
+ https://bugs.webkit.org/show_bug.cgi?id=98034
+
+ Reviewed by Kent Tamura.
+
+ This adds basic tests for all key bindings and simple mouse operations.
+
+ * fast/forms/date/calendar-picker-common.js: Added.
+ (currentMonth): Returns month that the picker is currently showing.
+ (selectedDate):
+ (openPicker): Opens the calendar picker and updates popupWindow.
+ (sendKey):
+ * fast/forms/date/calendar-picker-key-operations-expected.txt:
+ * fast/forms/date/calendar-picker-key-operations.html:
+ * fast/forms/date/calendar-picker-mouse-operations-expected.txt: Added.
+ * fast/forms/date/calendar-picker-mouse-operations.html: Added.
+ * fast/forms/resources/common.js:
+ (cumulativeOffset):
+ (hoverOverElement):
+ (clickElement):
+ * platform/chromium/fast/forms/date/date-suggestion-picker-mouse-operations.html:
+ * platform/gtk/TestExpectations: Added calendar-picker-mouse-operations.html.
+
2012-10-01 Tony Chang <t...@chromium.org>
flexbox does wrong baseline item alignment in columns
Added: trunk/LayoutTests/fast/forms/date/calendar-picker-common.js (0 => 130111)
--- trunk/LayoutTests/fast/forms/date/calendar-picker-common.js (rev 0)
+++ trunk/LayoutTests/fast/forms/date/calendar-picker-common.js 2012-10-02 01:55:29 UTC (rev 130111)
@@ -0,0 +1,42 @@
+window.jsTestIsAsync = true;
+if (window.internals)
+ internals.settings.setEnableMockPagePopup(true);
+
+var popupWindow = null;
+
+function currentMonth() {
+ var element = popupWindow.document.querySelector(".selected-month-year");
+ if (!element)
+ return null;
+ return element.dataset.value;
+}
+
+function availableDatesInCurrentMonth() {
+ return Array.prototype.map.call(popupWindow.document.querySelectorAll(".day.available:not(.not-this-month)"), function(element) {
+ return element.dataset.submitValue;
+ }).sort();
+}
+
+function selectedDate() {
+ var selected = selectedDates();
+ if (selected.length > 1)
+ testFailed("selectedDate expects single selected date. Found " + selected.length);
+ return selected[0];
+}
+
+function selectedDates() {
+ return Array.prototype.map.call(popupWindow.document.querySelectorAll(".day.day-selected"), function(element) {
+ return element.dataset.submitValue;
+ }).sort();
+}
+
+function openPicker(input) {
+ sendKey(input, "Down");
+ popupWindow = document.getElementById('mock-page-popup').contentWindow;
+}
+
+function sendKey(input, keyName) {
+ var event = document.createEvent('KeyboardEvent');
+ event.initKeyboardEvent('keydown', true, true, document.defaultView, keyName);
+ input.dispatchEvent(event);
+}
Modified: trunk/LayoutTests/fast/forms/date/calendar-picker-key-operations-expected.txt (130110 => 130111)
--- trunk/LayoutTests/fast/forms/date/calendar-picker-key-operations-expected.txt 2012-10-02 01:51:22 UTC (rev 130110)
+++ trunk/LayoutTests/fast/forms/date/calendar-picker-key-operations-expected.txt 2012-10-02 01:55:29 UTC (rev 130111)
@@ -6,31 +6,54 @@
Check that page popup doesn't exist at first.
PASS document.getElementById("mock-page-popup") is null
Check that page popup exists.
-PASS pickerWindow.pagePopupController.toString() is "[object PagePopupController]"
+PASS popupWindow.pagePopupController.toString() is "[object PagePopupController]"
PASS selectedDate() is "2000-01-02"
-PASS selectedMonthYear() is "2000-0"
+PASS currentMonth() is "2000-0"
Check that arrow keys work properly even when going between weeks and months.
PASS selectedDate() is "1999-12-26"
-PASS selectedMonthYear() is "2000-0"
+PASS currentMonth() is "2000-0"
PASS selectedDate() is "2000-01-02"
-PASS selectedMonthYear() is "1999-11"
+PASS currentMonth() is "1999-11"
PASS selectedDate() is "1999-12-26"
-PASS selectedMonthYear() is "2000-0"
+PASS currentMonth() is "2000-0"
PASS selectedDate() is "2000-01-02"
-PASS selectedMonthYear() is "2000-0"
+PASS currentMonth() is "2000-0"
PASS selectedDate() is "1999-12-26"
-PASS selectedMonthYear() is "2000-0"
+PASS currentMonth() is "2000-0"
PASS selectedDate() is "2000-01-08"
-PASS selectedMonthYear() is "1999-11"
+PASS currentMonth() is "1999-11"
PASS selectedDate() is "1999-12-26"
-PASS selectedMonthYear() is "2000-0"
+PASS currentMonth() is "2000-0"
+press m
+FAIL selectedDate() should be 2000-01-26. Was 2000-01-30.
+PASS currentMonth() is "2000-1"
+press shift + m
+PASS selectedDate() is "1999-12-26"
+PASS currentMonth() is "2000-0"
+press y
+PASS selectedDate() is "2000-12-31"
+PASS currentMonth() is "2001-0"
+press shift + y
+PASS selectedDate() is "1999-12-26"
+PASS currentMonth() is "2000-0"
+press d
+PASS selectedDate() is "2009-12-27"
+PASS currentMonth() is "2010-0"
+press shift + d
+PASS selectedDate() is "1999-12-26"
+PASS currentMonth() is "2000-0"
+PASS document.getElementById("mock-page-popup") is null
+PASS document.getElementById("date").value is "1999-12-26"
+PASS testToday() || testToday() is true
Check if tabbing works.
PASS focusedElement() is ".days-area-container"
PASS focusedElement() is ".today-button[value=Today]"
PASS focusedElement() is ".clear-button[value=Clear]"
PASS focusedElement() is ".year-month-button[value=<<]"
PASS focusedElement() is ".clear-button[value=Clear]"
+PASS document.getElementById("mock-page-popup") is null
+PASS document.getElementById("date").value is "1999-12-26"
PASS successfullyParsed is true
TEST COMPLETE
-
+
Modified: trunk/LayoutTests/fast/forms/date/calendar-picker-key-operations.html (130110 => 130111)
--- trunk/LayoutTests/fast/forms/date/calendar-picker-key-operations.html 2012-10-02 01:51:22 UTC (rev 130110)
+++ trunk/LayoutTests/fast/forms/date/calendar-picker-key-operations.html 2012-10-02 01:55:29 UTC (rev 130111)
@@ -2,6 +2,7 @@
<html>
<head>
<script src=""
+<script src=""
</head>
<body>
<p id="description"></p>
@@ -9,53 +10,97 @@
<input type=date id=date value="2000-01-02">
<script>
description("Tests if calendar picker key bindings work as expected.");
-window.jsTestIsAsync = true;
-if (window.internals)
- internals.settings.setEnableMockPagePopup(true);
debug('Check that page popup doesn\'t exist at first.');
shouldBeNull('document.getElementById("mock-page-popup")');
-sendKey(document.getElementById('date'), 'Down');
+openPicker(document.getElementById('date'));
-var pickerWindow = document.getElementById('mock-page-popup').contentWindow;
-pickerWindow.addEventListener("resize", function() {
+popupWindow.addEventListener("resize", test1, false);
+
+function test1() {
+ popupWindow.removeEventListener("resize", test1, false);
+
debug('Check that page popup exists.');
- shouldBe('pickerWindow.pagePopupController.toString()', '"[object PagePopupController]"');
+ shouldBe('popupWindow.pagePopupController.toString()', '"[object PagePopupController]"');
shouldBe('selectedDate()', '"2000-01-02"');
- shouldBe('selectedMonthYear()', '"2000-0"');
+ shouldBe('currentMonth()', '"2000-0"');
debug('Check that arrow keys work properly even when going between weeks and months.');
eventSender.keyDown('upArrow');
shouldBe('selectedDate()', '"1999-12-26"');
- shouldBe('selectedMonthYear()', '"2000-0"');
+ shouldBe('currentMonth()', '"2000-0"');
// Move from first row of January 2000 to last row of December 1999.
eventSender.keyDown('upArrow');
shouldBe('selectedDate()', '"2000-01-02"');
- shouldBe('selectedMonthYear()', '"1999-11"');
+ shouldBe('currentMonth()', '"1999-11"');
eventSender.keyDown('downArrow');
shouldBe('selectedDate()', '"1999-12-26"');
- shouldBe('selectedMonthYear()', '"2000-0"');
+ shouldBe('currentMonth()', '"2000-0"');
eventSender.keyDown('downArrow');
shouldBe('selectedDate()', '"2000-01-02"');
- shouldBe('selectedMonthYear()', '"2000-0"');
+ shouldBe('currentMonth()', '"2000-0"');
eventSender.keyDown('upArrow');
shouldBe('selectedDate()', '"1999-12-26"');
- shouldBe('selectedMonthYear()', '"2000-0"');
+ shouldBe('currentMonth()', '"2000-0"');
// Move from top left of January 2000 to bottom right of December 1999.
eventSender.keyDown('leftArrow');
shouldBe('selectedDate()', '"2000-01-08"');
- shouldBe('selectedMonthYear()', '"1999-11"');
+ shouldBe('currentMonth()', '"1999-11"');
eventSender.keyDown('rightArrow');
shouldBe('selectedDate()', '"1999-12-26"');
- shouldBe('selectedMonthYear()', '"2000-0"');
+ shouldBe('currentMonth()', '"2000-0"');
+ debug("press m");
+ eventSender.keyDown('m');
+ shouldBe('selectedDate()', '"2000-01-26"');
+ shouldBe('currentMonth()', '"2000-1"');
+
+ debug("press shift + m");
+ eventSender.keyDown('M');
+ shouldBe('selectedDate()', '"1999-12-26"');
+ shouldBe('currentMonth()', '"2000-0"');
+
+ debug("press y");
+ eventSender.keyDown('y');
+ shouldBe('selectedDate()', '"2000-12-31"');
+ shouldBe('currentMonth()', '"2001-0"');
+
+ debug("press shift + y");
+ eventSender.keyDown('Y');
+ shouldBe('selectedDate()', '"1999-12-26"');
+ shouldBe('currentMonth()', '"2000-0"');
+
+ debug("press d");
+ eventSender.keyDown('d');
+ shouldBe('selectedDate()', '"2009-12-27"');
+ shouldBe('currentMonth()', '"2010-0"');
+
+ debug("press shift + d");
+ eventSender.keyDown('D');
+ shouldBe('selectedDate()', '"1999-12-26"');
+ shouldBe('currentMonth()', '"2000-0"');
+
+ eventSender.keyDown('\n');
+ shouldBeNull('document.getElementById("mock-page-popup")');
+ shouldBe('document.getElementById("date").value', '"1999-12-26"');
+
+ openPicker(document.getElementById('date'));
+ popupWindow.addEventListener("resize", test2, false);
+}
+
+function test2() {
+ popupWindow.removeEventListener("resize", test2, false);
+
+ // Test twice in case midnight.
+ shouldBeTrue('testToday() || testToday()');
+
debug('Check if tabbing works.');
shouldBe('focusedElement()', '".days-area-container"');
eventSender.keyDown('\t');
@@ -67,25 +112,30 @@
eventSender.keyDown('\t', ['shiftKey']);
shouldBe('focusedElement()', '".clear-button[value=Clear]"');
+ eventSender.keyDown('\x1B');
+ shouldBeNull('document.getElementById("mock-page-popup")');
+ shouldBe('document.getElementById("date").value', '"1999-12-26"');
+
finishJSTest();
-}, false);
+}
-function selectedDate() {
- var element = pickerWindow.document.querySelector(".day-selected");
- if (!element)
- return null;
- return element.dataset.submitValue;
+function testToday() {
+ eventSender.keyDown('t');
+ var now = new Date();
+ var expectedDate = serializeDate(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate());
+ var expectedMonth = now.getUTCFullYear() + "-" + now.getMonth();
+ return selectedDate() === expectedDate && currentMonth() === expectedMonth;
}
-function selectedMonthYear() {
- var element = pickerWindow.document.querySelector(".selected-month-year");
- if (!element)
- return null;
- return element.dataset.value;
+function serializeDate(year, month, day) {
+ var yearString = String(year);
+ if (yearString.length < 4)
+ yearString = ("000" + yearString).substr(-4, 4);
+ return yearString + "-" + ("0" + (month + 1)).substr(-2, 2) + "-" + ("0" + day).substr(-2, 2);
}
function focusedElement() {
- var element = pickerWindow.document.activeElement;
+ var element = popupWindow.document.activeElement;
if (!element)
return null;
var identifier = "." + element.className;
@@ -94,11 +144,6 @@
return identifier;
}
-function sendKey(input, keyName) {
- var event = document.createEvent('KeyboardEvent');
- event.initKeyboardEvent('keydown', true, true, document.defaultView, keyName);
- input.dispatchEvent(event);
-}
</script>
<script src=""
</body>
Added: trunk/LayoutTests/fast/forms/date/calendar-picker-mouse-operations-expected.txt (0 => 130111)
--- trunk/LayoutTests/fast/forms/date/calendar-picker-mouse-operations-expected.txt (rev 0)
+++ trunk/LayoutTests/fast/forms/date/calendar-picker-mouse-operations-expected.txt 2012-10-02 01:55:29 UTC (rev 130111)
@@ -0,0 +1,26 @@
+Tests if calendar picker key bindings work as expected.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+Check that page popup doesn't exist at first.
+PASS document.getElementById("mock-page-popup") is null
+PASS selectedDate() is "2000-01-02"
+PASS currentMonth() is "2000-0"
+Check that hovering over an entry highlights it.
+PASS selectedDate() is "1999-12-31"
+PASS currentMonth() is "2000-0"
+PASS selectedDate() is "2000-01-04"
+PASS currentMonth() is "2000-0"
+Check that navigating between months maintains selection position.
+PASS selectedDate() is "2000-02-08"
+PASS currentMonth() is "2000-1"
+Check that moving the mouse outside the popup de-highlights entries.
+PASS selectedDate() is undefined.
+Check that mouse click closes the popup and sets the value.
+PASS document.getElementById("mock-page-popup") is null
+PASS document.getElementById("date").value is "2000-02-05"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
Added: trunk/LayoutTests/fast/forms/date/calendar-picker-mouse-operations.html (0 => 130111)
--- trunk/LayoutTests/fast/forms/date/calendar-picker-mouse-operations.html (rev 0)
+++ trunk/LayoutTests/fast/forms/date/calendar-picker-mouse-operations.html 2012-10-02 01:55:29 UTC (rev 130111)
@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<html>
+<head>
+<script src=""
+<script src=""
+<script src=""
+</head>
+<body>
+<p id="description"></p>
+<div id="console"></div>
+<input type=date id=date value="2000-01-02">
+<script>
+description("Tests if calendar picker key bindings work as expected.");
+
+debug('Check that page popup doesn\'t exist at first.');
+shouldBeNull('document.getElementById("mock-page-popup")');
+
+openPicker(document.getElementById('date'));
+
+popupWindow.addEventListener("resize", test, false);
+
+function test() {
+ popupWindow.removeEventListener("resize", test, false);
+
+ shouldBe('selectedDate()', '"2000-01-02"');
+ shouldBe('currentMonth()', '"2000-0"');
+
+ debug('Check that hovering over an entry highlights it.');
+ hoverOverElement(popupWindow.document.getElementsByClassName("day")[5]);
+ shouldBe('selectedDate()', '"1999-12-31"');
+ shouldBe('currentMonth()', '"2000-0"');
+
+ hoverOverElement(popupWindow.document.getElementsByClassName("day")[9]);
+ shouldBe('selectedDate()', '"2000-01-04"');
+ shouldBe('currentMonth()', '"2000-0"');
+
+ debug('Check that navigating between months maintains selection position.');
+ eventSender.keyDown('m');
+ shouldBe('selectedDate()', '"2000-02-08"');
+ shouldBe('currentMonth()', '"2000-1"');
+
+ debug('Check that moving the mouse outside the popup de-highlights entries.');
+ hoverOverElement(document.getElementById('description'));
+ shouldBeUndefined('selectedDate()');
+
+ debug('Check that mouse click closes the popup and sets the value.');
+ clickElement(popupWindow.document.getElementsByClassName("day")[6]);
+ shouldBeNull('document.getElementById("mock-page-popup")');
+ shouldBe('document.getElementById("date").value', '"2000-02-05"');
+
+ finishJSTest();
+}
+</script>
+<script src=""
+</body>
+
Modified: trunk/LayoutTests/fast/forms/resources/common.js (130110 => 130111)
--- trunk/LayoutTests/fast/forms/resources/common.js 2012-10-02 01:51:22 UTC (rev 130110)
+++ trunk/LayoutTests/fast/forms/resources/common.js 2012-10-02 01:55:29 UTC (rev 130111)
@@ -119,3 +119,35 @@
function getUserAgentShadowTextContent(element) {
return internals.youngestShadowRoot(element).textContent;
};
+
+function cumulativeOffset(element) {
+ var x = 0;
+ var y = 0;
+ var parentFrame = element.ownerDocument.defaultView.frameElement;
+ if (parentFrame) {
+ var parentFrameOffset = cumulativeOffset(parentFrame);
+ x = parentFrameOffset[0];
+ y = parentFrameOffset[1];
+ }
+ if (element.parentNode) {
+ do {
+ x += element.offsetLeft || 0;
+ y += element.offsetTop || 0;
+ element = element.offsetParent;
+ } while (element);
+ }
+ return [x, y];
+}
+
+function hoverOverElement(element) {
+ var offset = cumulativeOffset(element);
+ var centerX = offset[0] + element.offsetWidth / 2;
+ var centerY = offset[1] + element.offsetHeight / 2;
+ eventSender.mouseMoveTo(centerX, centerY);
+}
+
+function clickElement(element) {
+ hoverOverElement(element);
+ eventSender.mouseDown();
+ eventSender.mouseUp();
+}
Modified: trunk/LayoutTests/platform/chromium/fast/forms/date/date-suggestion-picker-mouse-operations.html (130110 => 130111)
--- trunk/LayoutTests/platform/chromium/fast/forms/date/date-suggestion-picker-mouse-operations.html 2012-10-02 01:51:22 UTC (rev 130110)
+++ trunk/LayoutTests/platform/chromium/fast/forms/date/date-suggestion-picker-mouse-operations.html 2012-10-02 01:55:29 UTC (rev 130111)
@@ -2,6 +2,7 @@
<html>
<head>
<script src=""
+<script src=""
</head>
<body style="background-color: #bbbbbb;">
<p id="description"></p>
@@ -124,38 +125,6 @@
return null;
}
-function cumulativeOffset(element) {
- var x = 0;
- var y = 0;
- var parentFrame = element.ownerDocument.defaultView.frameElement;
- if (parentFrame) {
- var parentFrameOffset = cumulativeOffset(parentFrame);
- x = parentFrameOffset[0];
- y = parentFrameOffset[1];
- }
- if (element.parentNode) {
- do {
- x += element.offsetLeft || 0;
- y += element.offsetTop || 0;
- element = element.offsetParent;
- } while (element);
- }
- return [x, y];
-}
-
-function hoverOverElement(element) {
- var offset = cumulativeOffset(element);
- var centerX = offset[0] + element.offsetWidth / 2;
- var centerY = offset[1] + element.offsetHeight / 2;
- eventSender.mouseMoveTo(centerX, centerY);
-}
-
-function clickElement(element) {
- hoverOverElement(element);
- eventSender.mouseDown();
- eventSender.mouseUp();
-}
-
function sendMousedown(element) {
var event = document.createEvent('MouseEvent');
event.initEvent('click', true, true);
Modified: trunk/LayoutTests/platform/gtk/TestExpectations (130110 => 130111)
--- trunk/LayoutTests/platform/gtk/TestExpectations 2012-10-02 01:51:22 UTC (rev 130110)
+++ trunk/LayoutTests/platform/gtk/TestExpectations 2012-10-02 01:55:29 UTC (rev 130111)
@@ -200,6 +200,7 @@
webkit.org/b/29359 fast/forms/date/calendar-picker-appearance-with-step.html [ Skip ]
webkit.org/b/29359 fast/forms/date/calendar-picker-appearance.html [ Skip ]
webkit.org/b/29359 fast/forms/date/calendar-picker-key-operations.html [ Skip ]
+webkit.org/b/29359 fast/forms/date/calendar-picker-mouse-operations.html [ Skip ]
webkit.org/b/29359 fast/forms/date/calendar-picker-type-change-onclick.html [ Pass ]
webkit.org/b/29359 fast/forms/date/date-stepup-stepdown-from-renderer.html [ Pass ]
webkit.org/b/29359 fast/forms/date/no-page-popup-controller.html [ Pass ]
