chromium/third_party/blink/web_tests/fast/forms/calendar-picker/datetimelocal-picker-open-to-focused-field.html

<!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>

<input type="datetime-local" id="datetime" value="2020-08-19T11:34:00" />
<input type="datetime-local" step="1" id="datetimeWithSeconds" value="2020-08-19T11:34:45" />

<script>
function runDateTimeLocalTest(input, includesSeconds)
{
  let seconds = includesSeconds ? 45 : 0;
  let secondsStr = includesSeconds ? (":" + seconds) : "";
  // Note: Assuming mm/dd/yyyy format, but it doesn't really matter.
  // Update date
  assert_equals(internals.pagePopupWindow, null);
  return openPicker(input)
  .then(() => {
    // Default focus moves the day element.
    assert_not_equals(internals.pagePopupWindow, null);
    eventSender.keyDown('ArrowUp');
    assert_equals(input.value, "2020-08-12T11:34" + secondsStr);
    eventSender.keyDown('ArrowDown');
    assert_equals(input.value, "2020-08-19T11:34" + secondsStr);
    // Update hours
    eventSender.keyDown("Tab"); // To "Clear"
    eventSender.keyDown("Tab"); // To "Today"
    eventSender.keyDown("Tab"); // To hour
    eventSender.keyDown('ArrowUp');
    assert_equals(input.value, "2020-08-19T10:34" + secondsStr);
    eventSender.keyDown('ArrowDown');
    assert_equals(input.value, "2020-08-19T11:34" + secondsStr);
    // Update minutes
    eventSender.keyDown("Tab"); // To minutes
    eventSender.keyDown('ArrowUp');
    assert_equals(input.value, "2020-08-19T11:33" + secondsStr);
    eventSender.keyDown('ArrowDown');
    assert_equals(input.value, "2020-08-19T11:34" + secondsStr);
    if (includesSeconds) {
      // Update seconds
      eventSender.keyDown("Tab"); // To seconds
      eventSender.keyDown('ArrowUp');
      seconds--;
      assert_equals(input.value, "2020-08-19T11:34:" + seconds);
      eventSender.keyDown('ArrowDown');
      seconds++;
      assert_equals(input.value, "2020-08-19T11:34:" + seconds);
    }
    // Update am/pm
    eventSender.keyDown("Tab"); // To AM/PM
    eventSender.keyDown('ArrowUp');
    assert_equals(input.value, "2020-08-19T23:34" + secondsStr);
    eventSender.keyDown('ArrowDown');
    assert_equals(input.value, "2020-08-19T11:34" + secondsStr);
    eventSender.keyDown('ArrowDown');
    assert_equals(input.value, "2020-08-19T23:34" + secondsStr);
    return attemptToClosePicker(input);
  });
}

promise_test(() => {
  var input = document.getElementById("datetime");
  return runDateTimeLocalTest(input, false);
}, "Test opening datetime-local picker to focused field.");

promise_test(() => {
  var input = document.getElementById("datetimeWithSeconds");
  return runDateTimeLocalTest(input, true);
}, "Test opening datetime-local picker to focused field with seconds.");

</script>