| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src="../../../../resources/js-test-pre.js"></script> |
| <script src="../../../../resources/ui-helper.js"></script> |
| </head> |
| <body> |
| |
| <input id="before" type="text"> |
| <input id="input" type="datetime-local"> |
| <input id="after" type="text"> |
| |
| <script> |
| |
| jsTestIsAsync = true; |
| |
| changeEventsFired = 0; |
| function onChangeEvent() { |
| changeEventsFired++; |
| } |
| |
| inputEventsFired = 0; |
| function onInputEvent() { |
| inputEventsFired++; |
| } |
| |
| function beginTest(title, value) { |
| debug("\n" + title); |
| input.value = value || ""; |
| input.blur(); |
| input.focus(); |
| |
| changeEventsFired = 0; |
| inputEventsFired = 0; |
| } |
| |
| input.addEventListener("change", onChangeEvent); |
| input.addEventListener("input", onInputEvent); |
| |
| addEventListener("load", async () => { |
| description("Test for keyboard operations for <input type=datetime-local>"); |
| |
| beginTest("Digit keys"); // [mm]/dd/yyyy hh:mm tt |
| UIHelper.keyDown("9"); // -> [09]/dd/yyyy hh:mm tt |
| UIHelper.keyDown("rightArrow"); // -> 09/[dd]/yyyy hh:mm tt |
| UIHelper.keyDown("2"); // -> 09/[02]/yyyy hh:mm tt |
| UIHelper.keyDown("rightArrow"); // -> 09/02/[yyyy] hh:mm tt |
| UIHelper.keyDown("2"); // -> 09/02/[0002] hh:mm tt |
| UIHelper.keyDown("0"); // -> 09/02/[0020] hh:mm tt |
| UIHelper.keyDown("1"); // -> 09/02/[0201] hh:mm tt |
| UIHelper.keyDown("2"); // -> 09/02/[2012] hh:mm tt |
| UIHelper.keyDown("rightArrow"); // -> 09/02/2012 [hh]:mm tt |
| UIHelper.keyDown("1"); // -> 09/02/2012 [01]:mm tt |
| UIHelper.keyDown("2"); // -> 09/02/2012 [12]:mm tt |
| UIHelper.keyDown("rightArrow"); // -> 09/02/2012 12:[mm] tt |
| UIHelper.keyDown("2"); // -> 09/02/2012 12:[02] tt |
| UIHelper.keyDown("rightArrow"); // -> 09/02/2012 12:02 [tt] |
| UIHelper.keyDown("A"); // -> 09/02/2012 12:02 [AM] |
| shouldBeEqualToString("input.value", "2012-09-02T00:02"); |
| shouldBe("changeEventsFired", "1"); |
| shouldBe("inputEventsFired", "1"); |
| |
| beginTest("Digit keys with timeout"); // [mm]/dd/yyyy hh:mm tt |
| UIHelper.keyDown("2"); // -> [02]/dd/yyyy hh:mm tt |
| UIHelper.keyDown("rightArrow"); // -> 02/[dd]/yyyy hh:mm tt |
| UIHelper.keyDown("4"); // -> 02/[04]/yyyy hh:mm tt |
| UIHelper.keyDown("rightArrow"); // -> 02/04/[yyyy] hh:mm tt |
| UIHelper.keyDown("4"); // -> 02/04/[0004] hh:mm tt |
| await UIHelper.delayFor(1500); // Wait. |
| UIHelper.keyDown("1"); // -> 02/04/[0001] hh:mm tt |
| UIHelper.keyDown("rightArrow"); // -> 02/04/0001 [hh]:mm tt |
| UIHelper.keyDown("2"); // -> 02/04/0001 [02]:mm tt |
| UIHelper.keyDown("rightArrow"); // -> 02/04/0001 02:[mm] tt |
| UIHelper.keyDown("4"); // -> 02/04/0001 02:[04] tt |
| await UIHelper.delayFor(1500); // Wait. |
| UIHelper.keyDown("5"); // -> 02/04/0001 02:[05] tt |
| UIHelper.keyDown("rightArrow"); // -> 02/04/0001 02:05 [tt] |
| UIHelper.keyDown("P"); // -> 02/04/0001 02:05 [PM] |
| shouldBeEqualToString("input.value", "0001-02-04T14:05"); |
| shouldBe("changeEventsFired", "1"); |
| shouldBe("inputEventsFired", "1"); |
| |
| beginTest("Digit keys clamp value", "2018-07-06T12:22"); // [07]/06/2018 12:22 PM |
| UIHelper.keyDown("9"); // -> [09]/06/2018 12:22 PM |
| shouldBeEqualToString("input.value", "2018-09-06T12:22"); |
| UIHelper.keyDown("9"); // -> [12]/06/2018 12:22 PM |
| shouldBeEqualToString("input.value", "2018-12-06T12:22"); |
| UIHelper.keyDown("rightArrow"); // -> 12/[06]/2018 12:22 PM |
| UIHelper.keyDown("9"); // -> 12/[09]/2018 12:22 PM |
| shouldBeEqualToString("input.value", "2018-12-09T12:22"); |
| UIHelper.keyDown("9"); // -> 12/[31]/2018 12:22 PM |
| shouldBeEqualToString("input.value", "2018-12-31T12:22"); |
| UIHelper.keyDown("rightArrow"); // -> 12/31/[2018] 12:22 PM |
| UIHelper.keyDown("9"); // -> 12/31/[0009] 12:22 PM |
| shouldBeEqualToString("input.value", "0009-12-31T12:22"); |
| UIHelper.keyDown("9"); // -> 12/31/[0099] 12:22 PM |
| shouldBeEqualToString("input.value", "0099-12-31T12:22"); |
| UIHelper.keyDown("9"); // -> 12/31/[0999] 12:22 PM |
| shouldBeEqualToString("input.value", "0999-12-31T12:22"); |
| UIHelper.keyDown("9"); // -> 12/31/[9999] 12:22 PM |
| shouldBeEqualToString("input.value", "9999-12-31T12:22"); |
| UIHelper.keyDown("rightArrow"); // -> 12/31/9999 [12]:22 PM |
| UIHelper.keyDown("1"); // -> 12/31/9999 [01]:22 PM |
| shouldBeEqualToString("input.value", "9999-12-31T13:22"); |
| UIHelper.keyDown("3"); // -> 12/31/9999 [12]:22 PM |
| shouldBeEqualToString("input.value", "9999-12-31T12:22"); |
| UIHelper.keyDown("0"); // -> 12/31/9999 [01]:22 PM |
| shouldBeEqualToString("input.value", "9999-12-31T13:22"); |
| UIHelper.keyDown("rightArrow"); // -> 12/31/9999 13:[22] PM |
| UIHelper.keyDown("6"); // -> 12/31/9999 13:[06] PM |
| shouldBeEqualToString("input.value", "9999-12-31T13:06"); |
| UIHelper.keyDown("1"); // -> 12/31/9999 13:[59] PM |
| shouldBeEqualToString("input.value", "9999-12-31T13:59"); |
| shouldBe("changeEventsFired", "13"); |
| shouldBe("inputEventsFired", "13"); |
| |
| beginTest("Left/Right arrow keys", "2007-04-30T15:27"); // [04]/30/2007 03:27 PM |
| UIHelper.keyDown("2"); // -> [02]/30/2007 03:27 PM |
| UIHelper.keyDown("rightArrow"); // -> 02/[30]/2007 03:27 PM |
| UIHelper.keyDown("2"); // -> 02/[02]/2007 03:27 PM |
| UIHelper.keyDown("rightArrow"); // -> 02/02/[2007] 03:27 PM |
| UIHelper.keyDown("2"); // -> 02/02/[0002] 03:27 PM |
| UIHelper.keyDown("rightArrow"); // -> 02/02/0002 [03]:27 PM |
| UIHelper.keyDown("2"); // -> 02/02/0002 [02]:27 PM |
| UIHelper.keyDown("rightArrow"); // -> 02/02/0002 02:[27] PM |
| UIHelper.keyDown("2"); // -> 02/02/0002 02:[02] PM |
| UIHelper.keyDown("rightArrow"); // -> 02/02/0002 02:02 [PM] |
| UIHelper.keyDown("A"); // -> 02/02/0002 02:02 [AM] |
| shouldBeEqualToString("input.value", "0002-02-02T02:02"); |
| UIHelper.keyDown("leftArrow"); // -> 02/02/0002 02:[02] AM |
| UIHelper.keyDown("3"); // -> 02/02/0002 02:[03] AM |
| UIHelper.keyDown("leftArrow"); // -> 02/02/0002 [02]:03 AM |
| UIHelper.keyDown("3"); // -> 02/02/0002 [03]:03 AM |
| UIHelper.keyDown("leftArrow"); // -> 02/02/[0002] 03:03 AM |
| UIHelper.keyDown("3"); // -> 02/02/[0003] 03:03 AM |
| UIHelper.keyDown("leftArrow"); // -> 02/[02]/0003 03:03 AM |
| UIHelper.keyDown("3"); // -> 02/[03]/0003 03:03 AM |
| UIHelper.keyDown("leftArrow"); // -> [02]/03/0003 03:03 AM |
| UIHelper.keyDown("3"); // -> [03]/03/0003 03:03 AM |
| shouldBeEqualToString("input.value", "0003-03-03T03:03"); |
| shouldBe("changeEventsFired", "11"); |
| shouldBe("inputEventsFired", "11"); |
| |
| beginTest("Advance field keys", "2020-06-05T16:27"); // [06]/05/2020 04:27 PM |
| UIHelper.keyDown("/"); // -> 06/[05]/2020 04:27 PM |
| UIHelper.keyDown("3"); // -> 06/[03]/2020 04:27 PM |
| shouldBeEqualToString("input.value", "2020-06-03T16:27"); |
| UIHelper.keyDown("leftArrow"); // -> [06]/03/2020 04:27 PM |
| UIHelper.keyDown("-"); // -> 06/[03]/2020 04:27 PM |
| UIHelper.keyDown("4"); // -> 06/[04]/2020 04:27 PM |
| shouldBeEqualToString("input.value", "2020-06-04T16:27"); |
| UIHelper.keyDown("leftArrow"); // -> [06]/04/2020 04:27 PM |
| UIHelper.keyDown("."); // -> 06/[04]/2020 04:27 PM |
| UIHelper.keyDown("5"); // -> 06/[05]/2020 04:27 PM |
| shouldBeEqualToString("input.value", "2020-06-05T16:27"); |
| UIHelper.keyDown("leftArrow"); // -> [06]/05/2020 04:27 PM |
| UIHelper.keyDown(":"); // -> 06/[05]/2020 04:27 PM |
| UIHelper.keyDown("6"); // -> 06/[06]/2020 04:27 PM |
| shouldBeEqualToString("input.value", "2020-06-06T16:27"); |
| UIHelper.keyDown("leftArrow"); // -> [06]/06/2020 04:27 PM |
| UIHelper.keyDown(";"); // -> 06/[06]/2020 04:27 PM |
| UIHelper.keyDown("7"); // -> 06/[07]/2020 04:27 PM |
| shouldBeEqualToString("input.value", "2020-06-07T16:27"); |
| UIHelper.keyDown("leftArrow"); // -> [06]/07/2020 04:27 PM |
| UIHelper.keyDown(","); // -> 06/[07]/2020 04:27 PM |
| UIHelper.keyDown("8"); // -> 06/[08]/2020 04:27 PM |
| shouldBeEqualToString("input.value", "2020-06-08T16:27"); |
| shouldBe("changeEventsFired", "6"); |
| shouldBe("inputEventsFired", "6"); |
| |
| beginTest("Up/Down arrow keys", "2020-12-20T23:59"); // [12]/20/2020 11:59 PM |
| UIHelper.keyDown("upArrow"); // -> [01]/20/2020 11:59 PM |
| shouldBeEqualToString("input.value", "2020-01-20T23:59"); |
| UIHelper.keyDown("upArrow"); // -> [02]/20/2020 11:59 PM |
| shouldBeEqualToString("input.value", "2020-02-20T23:59"); |
| UIHelper.keyDown("downArrow"); // -> [01]/20/2020 11:59 PM |
| shouldBeEqualToString("input.value", "2020-01-20T23:59"); |
| UIHelper.keyDown("downArrow"); // -> [12]/20/2020 11:59 PM |
| shouldBeEqualToString("input.value", "2020-12-20T23:59"); |
| UIHelper.keyDown("rightArrow"); // -> 12/[20]/2020 11:59 PM |
| UIHelper.keyDown("rightArrow"); // -> 12/20/[2020] 11:59 PM |
| UIHelper.keyDown("rightArrow"); // -> 12/20/2020 [11]:59 PM |
| UIHelper.keyDown("upArrow"); // -> 12/20/2020 [12]:59 PM |
| shouldBeEqualToString("input.value", "2020-12-20T12:59"); |
| UIHelper.keyDown("upArrow"); // -> 12/20/2020 [01]:59 PM |
| shouldBeEqualToString("input.value", "2020-12-20T13:59"); |
| UIHelper.keyDown("downArrow"); // -> 12/20/2020 [12]:59 PM |
| shouldBeEqualToString("input.value", "2020-12-20T12:59"); |
| UIHelper.keyDown("downArrow"); // -> 12/20/2020 [11]:59 PM |
| shouldBeEqualToString("input.value", "2020-12-20T23:59"); |
| UIHelper.keyDown("rightArrow"); // -> 12/20/2020 11:[59] PM |
| UIHelper.keyDown("rightArrow"); // -> 12/20/2020 11:59 [PM] |
| UIHelper.keyDown("upArrow"); // -> 12/20/2020 11:59 [AM] |
| shouldBeEqualToString("input.value", "2020-12-20T11:59"); |
| UIHelper.keyDown("downArrow"); // -> 12/20/2020 11:59 [PM] |
| shouldBeEqualToString("input.value", "2020-12-20T23:59"); |
| UIHelper.keyDown("downArrow"); // -> 12/20/2020 11:59 [AM] |
| shouldBeEqualToString("input.value", "2020-12-20T11:59"); |
| shouldBe("changeEventsFired", "11"); |
| shouldBe("inputEventsFired", "11"); |
| |
| beginTest("Tab key"); // [mm]/dd/yyyy hh:mm tt |
| UIHelper.keyDown("2"); // -> [02]/dd/yyyy hh:mm tt |
| UIHelper.keyDown("\t"); // -> 02/[dd]/yyyy hh:mm tt |
| UIHelper.keyDown("2"); // -> 02/[02]/yyyy hh:mm tt |
| UIHelper.keyDown("\t"); // -> 02/02/[yyyy] hh:mm tt |
| UIHelper.keyDown("2"); // -> 02/02/[0002] hh:mm tt |
| UIHelper.keyDown("\t"); // -> 02/02/0002 [hh]:mm tt |
| UIHelper.keyDown("2"); // -> 02/02/0002 [02]:mm tt |
| UIHelper.keyDown("\t"); // -> 02/02/0002 02:[mm] tt |
| UIHelper.keyDown("2"); // -> 02/02/0002 02:[02] tt |
| UIHelper.keyDown("\t"); // -> 02/02/0002 02:02 [tt] |
| UIHelper.keyDown("A"); // -> 02/02/0002 02:02 [AM] |
| shouldBeEqualToString("input.value", "0002-02-02T02:02"); |
| UIHelper.keyDown("\t"); // Focus out. |
| shouldBeEqualToString("document.activeElement.id", "after"); |
| UIHelper.keyDown("\t", ["shiftKey"]); // -> 02/02/0002 02:02 [AM] |
| UIHelper.keyDown("\t", ["shiftKey"]); // -> 02/02/0002 02:[02] AM |
| UIHelper.keyDown("3"); // -> 02/02/0002 02:[03] AM |
| UIHelper.keyDown("\t", ["shiftKey"]); // -> 02/02/0002 [02]:03 AM |
| UIHelper.keyDown("3"); // -> 02/02/0002 [03]:03 AM |
| UIHelper.keyDown("\t", ["shiftKey"]); // -> 02/02/[0002] 03:03 AM |
| UIHelper.keyDown("3"); // -> 02/02/[0003] 03:03 AM |
| UIHelper.keyDown("\t", ["shiftKey"]); // -> 02/[02]/0003 03:03 AM |
| UIHelper.keyDown("3"); // -> 02/[03]/0003 03:03 AM |
| UIHelper.keyDown("\t", ["shiftKey"]); // -> [02]/03/0003 03:03 AM |
| UIHelper.keyDown("3"); // -> [03]/03/0003 03:03 AM |
| shouldBeEqualToString("input.value", "0003-03-03T03:03"); |
| UIHelper.keyDown("\t", ["shiftKey"]); // Focus out. |
| shouldBeEqualToString("document.activeElement.id", "before"); |
| shouldBe("changeEventsFired", "6"); |
| shouldBe("inputEventsFired", "6"); |
| |
| beginTest("Backspace key", "2016-11-12T16:30"); // [11]/12/2016 04:30 PM |
| UIHelper.keyDown("\b"); // -> [mm]/12/2016 04:30 PM |
| shouldBeEqualToString("input.value", ""); |
| UIHelper.keyDown("7"); // -> [07]/12/2016 04:30 PM |
| shouldBeEqualToString("input.value", "2016-07-12T16:30"); |
| shouldBe("changeEventsFired", "2"); |
| shouldBe("inputEventsFired", "2"); |
| |
| beginTest("Delete key", "2018-05-20T18:20"); // [05]/20/2018 06:20 PM |
| UIHelper.keyDown("rightArrow"); // -> 05/[20]/2018 06:20 PM |
| UIHelper.keyDown("rightArrow"); // -> 05/20/[2018] 06:20 PM |
| UIHelper.keyDown("rightArrow"); // -> 05/20/2018 [06]:20 PM |
| UIHelper.keyDown("delete"); // -> 05/20/2018 [hh]:20 PM |
| shouldBeEqualToString("input.value", ""); |
| shouldBe("changeEventsFired", "1"); |
| shouldBe("inputEventsFired", "1"); |
| |
| beginTest("Disabled/readonly", "2020-09-01T09:01"); |
| input.disabled = true; |
| UIHelper.keyDown("1"); |
| shouldBeEqualToString("input.value", "2020-09-01T09:01"); |
| input.disabled = false; |
| input.focus(); |
| UIHelper.keyDown("1"); |
| shouldBeEqualToString("input.value", "2020-01-01T09:01"); |
| input.readOnly = true; |
| UIHelper.keyDown("rightArrow"); |
| UIHelper.keyDown("2"); |
| shouldBeEqualToString("input.value", "2020-01-01T09:01"); |
| input.readOnly = false; |
| UIHelper.keyDown("2"); |
| shouldBeEqualToString("input.value", "2020-09-02T09:01"); |
| shouldBe("changeEventsFired", "2"); |
| shouldBe("inputEventsFired", "2"); |
| |
| finishJSTest(); |
| }); |
| |
| </script> |
| |
| <script src="../../../../resources/js-test-post.js"></script> |
| </body> |
| </html> |
