third_party/WebKit/LayoutTests/fast/forms/date-multiple-fields/date-multiple-fields-mouse-events.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <script src="../../../resources/ahem.js"></script>
   5 <script src="../../../resources/js-test.js"></script>
   6 </head>
   7 <body>
   8 <p id="description"></p>
   9 <p>
  10 Please run this with DRT or WTR.
  11 </p>
  12 Test following mouse actions:
  13 <ul>
  14     <li>Mouse click to focus each of sub-fields</li>
  15     <li>Mouse click on the spin button to update each of sub-fields</li>
  16 </ul>
  17 <input id="input" type="date" style="font-family:ahem; font-size:16px;">
  18 <div id="console"></div>
  19 <script>
  20 function keyDown(key, modifiers)
  21 {
  22     if (!window.eventSender)
  23         return;
  24     eventSender.keyDown(key, modifiers);
  25 }
  26
  27 function mouseClickOn(x, y)
  28 {
  29     if (!window.eventSender)
  30         return;
  31     eventSender.mouseMoveTo(x + input.offsetLeft, y + input.offsetTop);
  32     eventSender.mouseDown();
  33     eventSender.mouseUp();
  34 }
  35
  36 onload = function() {
  37     description('Multiple fields UI of date input type with mouse events');
  38     var input = document.getElementById('input');
  39
  40     input.value = '2345-07-19';
  41     var center = input.offsetHeight / 2;
  42     var spinButtonOffset = 26;
  43     var clearButtonOffset = 41;
  44
  45     debug('==> Focus on the month field.');
  46     mouseClickOn(12, center);
  47     keyDown('upArrow');
  48     shouldBeEqualToString('input.value', '2345-08-19');
  49     mouseClickOn(input.offsetWidth - spinButtonOffset, center - 1);
  50     shouldBeEqualToString('input.value', '2345-09-19');
  51     mouseClickOn(input.offsetWidth - spinButtonOffset, center + 1);
  52     shouldBeEqualToString('input.value', '2345-08-19');
  53     shouldBeZero('window.getSelection().rangeCount'); // No text selection.
  54
  55     debug('');
  56     debug('==> Focus on the day field.');
  57     mouseClickOn(60, center);
  58     keyDown('upArrow');
  59     shouldBeEqualToString('input.value', '2345-08-20');
  60     mouseClickOn(input.offsetWidth - spinButtonOffset, center - 1);
  61     shouldBeEqualToString('input.value', '2345-08-21');
  62     mouseClickOn(input.offsetWidth - spinButtonOffset, center + 1);
  63     shouldBeEqualToString('input.value', '2345-08-20');
  64     shouldBeZero('window.getSelection().rangeCount'); // No text selection.
  65
  66     debug('');
  67     debug('==> Focus on the year field.');
  68     mouseClickOn(input.offsetWidth - 115, center);
  69     keyDown('upArrow');
  70     shouldBeEqualToString('input.value', '2346-08-20');
  71     mouseClickOn(input.offsetWidth - spinButtonOffset, center - 1);
  72     shouldBeEqualToString('input.value', '2347-08-20');
  73     mouseClickOn(input.offsetWidth - spinButtonOffset, center + 1);
  74     shouldBeEqualToString('input.value', '2346-08-20');
  75     shouldBeZero('window.getSelection().rangeCount'); // No text selection.
  76
  77     debug('');
  78     debug('==> Click on a disabled field.');
  79     input.disabled = true;
  80     mouseClickOn(12, center);
  81     keyDown('upArrow');
  82     shouldBeEqualToString('input.value', '2346-08-20');
  83     input.disabled = false;
  84
  85     debug('');
  86     debug('==> Click on a read-only field.');
  87     input.readOnly = true;
  88     mouseClickOn(12, center);
  89     keyDown('upArrow');
  90     shouldBeEqualToString('input.value', '2346-08-20');
  91     input.readOnly = false;
  92
  93     debug('');
  94     debug('==> Click on clear button.');
  95     input.readOnly = true;
  96     mouseClickOn(input.offsetWidth - clearButtonOffset, center);
  97     shouldBeEqualToString('input.value', '2346-08-20');
  98     input.disabled = true;
  99     input.readOnly = false;
 100     mouseClickOn(input.offsetWidth - clearButtonOffset, center);
 101     shouldBeEqualToString('input.value', '2346-08-20');
 102     input.disabled = false;
 103     mouseClickOn(input.offsetWidth - clearButtonOffset, center);
 104     shouldBeEqualToString('input.value', '');
 105
 106     debug('');
 107 };
 108 </script>
 109 </body>
 110 </html>