third_party/WebKit/LayoutTests/fast/forms/datetimelocal-multiple-fields/datetimelocal-multiple-fields-change-layout-by-value.html

   1 <!DOCTYPE html>
   2 <html>
   3 <body>
   4 <script src="../../../resources/js-test.js"></script>
   5 <script>
   6 description('Change multiple fields datetime-local input UI layout by value');
   7 var testInput = document.createElement('input');
   8 testInput.type = 'datetime-local';
   9 testInput.max = '9999-12-31T23:59';
  10 document.body.appendChild(testInput);
  11 var widthOfEmptyValue = testInput.offsetWidth;
  12
  13 testInput.value = '10000-01-01T00:00';
  14 var widthOfOverflowValue = testInput.offsetWidth;
  15 shouldBeTrue('widthOfEmptyValue < widthOfOverflowValue');
  16
  17 testInput.value = '2012-10-05T12:00';
  18 var widthOfValidValue = testInput.offsetWidth;
  19 shouldBe('widthOfEmptyValue', 'widthOfValidValue');
  20
  21 testInput.value = '2012-10-05T12:00:01';
  22 var widthWithSecond = testInput.offsetWidth;
  23 shouldBeTrue('widthOfEmptyValue < widthWithSecond');
  24
  25 testInput.value = '2012-10-05T12:00:01.234';
  26 var widthWithMillisecond = testInput.offsetWidth;
  27 shouldBeTrue('widthWithSecond < widthWithMillisecond');
  28
  29 document.body.removeChild(testInput);
  30 </script>
  31 </body>
  32 </html>