<!DOCTYPE html>
<meta name=fuzzy content="maxDifference=0-3; totalPixels=0-1000">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../resources/testdriver.js"></script>
<script src="../../../resources/testdriver-vendor.js"></script>
<script src="../resources/common.js"></script>
<script src="../resources/picker-common.js"></script>
<script src="../calendar-picker/resources/calendar-picker-common.js"></script>
<input type="date" id="date-0" value="2019-02-14">
<script>
promise_test(() => {
let dateElement = document.getElementById('date-0');
return openPicker(dateElement)
.then(() => {
eventSender.keyDown('PageDown');
assert_equals(dateElement.value, "2019-03-14", "Next month hotkey should have incremented month");
eventSender.keyDown('PageUp');
assert_equals(dateElement.value, "2019-02-14", "Previous month hotkey should have decremented month");
eventSender.keyDown('Home');
assert_equals(dateElement.value, "2019-02-01", "Home hotkey should go to the first of the month");
eventSender.keyDown('Home');
assert_equals(dateElement.value, "2019-01-01", "Home hotkey should go to the first of the previous month");
eventSender.keyDown('Home');
assert_equals(dateElement.value, "2018-12-01", "Home hotkey should wrap to previous year");
eventSender.keyDown('End');
assert_equals(dateElement.value, "2018-12-31", "End hotkey should go to the end of the month");
eventSender.keyDown('End');
assert_equals(dateElement.value, "2019-01-31", "End hotkey hotkey should wrap to next year");
eventSender.keyDown('End');
assert_equals(dateElement.value, "2019-02-28", "End hotkey should go to the end of the next month");
eventSender.keyDown('Enter');
assert_equals(internals.pagePopupWindow, null, "Enter key should have closed popup.");
});
}, "Date picker: Previous/next month hotkey (PageDown/PageUp)");
</script>