third_party/WebKit/LayoutTests/fast/forms/week-multiple-fields/week-multiple-fields-keyboard-events.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <script src="../../../resources/js-test.js"></script>
   5 </head>
   6 <body>
   7 <p id="description"></p>
   8 <p>
   9 Please run this with DumpRenderTree.
  10 </p>
  11 Test following keys:
  12 <ul>
  13     <li>Digits</li>
  14     <li>Left/Right - Move focus field inside element</li>
  15     <li>Up/Down - Increment/decrement value of focus field</li>
  16     <li>Tab - Move focus field</li>
  17     <li>Backspace - Make value empty</li>
  18 </ul>
  19 <input id="before">
  20 <input id="input" type="week">
  21 <input id="after">
  22 <div id="console"></div>
  23 <script>
  24 description('Multiple fields UI of week input type with keyboard events');
  25 if (window.internals)
  26     internals.settings.setLangAttributeAwareFormControlUIEnabled(true);
  27 var input = document.getElementById('input');
  28
  29 function keyDown(key, modifiers)
  30 {
  31     if (!window.eventSender)
  32         return;
  33     eventSender.keyDown(key, modifiers);
  34 }
  35
  36 function beginTest(title, opt_value, opt_min, opt_max)
  37 {
  38     debug('== ' + title + ' ==');
  39     input.value = opt_value || '';
  40     input.min = opt_min ? opt_min : '';
  41     input.max = opt_max ? opt_max : '';
  42     input.blur();
  43     input.focus();
  44 }
  45
  46 // We assume the date format is Week ww, yyyy.
  47
  48 beginTest('Digit keys');
  49 keyDown('9'); // -> Week 09, yyyy
  50 keyDown('1'); // -> Week 09, [0001]
  51 keyDown('2'); // -> Week 09, [0012]
  52 keyDown('A'); // Ignored.
  53 shouldBeEqualToString('input.value', '0012-W09');
  54
  55 beginTest('Digit keys starting with zero');
  56 keyDown('0'); // -> Week [00], yyyy
  57 keyDown('2'); // -> Week 02, [yyyy]
  58 keyDown('0'); // -> Week 02, [0000]
  59 keyDown('3'); // -> Week 02, [0003]
  60 keyDown('0'); // -> Week 02, [0030]
  61 keyDown('0'); // -> Week 02, [0300]
  62 shouldBeEqualToString('input.value', '0300-W02');
  63
  64 beginTest('Digit keys and backspace key');
  65 keyDown('0'); // -> Week [00], yyyy
  66 keyDown('\b'); // -> Week [ww], yyyy
  67 keyDown('0'); // -> Week [00], yyyy
  68 keyDown('0'); // -> Week 01, [yyyy]
  69 keyDown('0'); // -> Week 01, [0000]
  70 keyDown('6'); // -> Week 05, [0006]
  71 shouldBeEqualToString('input.value', '0006-W01');
  72
  73 beginTest('Left/Right keys', '2012-W09');
  74 keyDown('rightArrow'); // -> Week 09, [2012]
  75 keyDown('5'); // -> Week 09, [0005]
  76 keyDown('leftArrow'); // -> Week [09], 0005
  77 keyDown('6'); // -> Week [06], 0005
  78 shouldBeEqualToString('input.value', '0005-W06');
  79 keyDown('leftArrow'); // -> Week 06, [0005]
  80 keyDown('leftArrow'); // -> Week [06], 0005
  81 keyDown('leftArrow'); // -> Week [06], 0005
  82 shouldBeEqualToString('document.activeElement.id', 'input');
  83
  84 beginTest('Up/Down keys', '2012-W09');
  85 keyDown('upArrow'); // -> Week [10], 2012
  86 shouldBeEqualToString('input.value', '2012-W10');
  87 keyDown('downArrow'); // -> Week [09], 2012
  88 keyDown('downArrow'); // -> Week [08], 2012
  89 shouldBeEqualToString('input.value', '2012-W08');
  90
  91 beginTest('Up/Down keys on empty value');
  92 keyDown('downArrow'); //  -> Week [53], yyyy
  93 keyDown('downArrow'); //  -> Week [52], yyyy
  94 keyDown('upArrow'); //    -> Week [53], yyyy
  95 keyDown('downArrow'); //  -> Week [52], yyyy
  96 keyDown('rightArrow'); // -> Week 52, [yyyy]
  97 var currentYear = new Date().getFullYear();
  98 keyDown('upArrow'); // -> Week 52, [current year]
  99 shouldBe('input.value', 'currentYear + "-W52"');
 100
 101 beginTest('Up/Down keys on empty value 2');
 102 keyDown('upArrow'); //    -> Week [01], yyyy
 103 keyDown('upArrow'); //    -> Week [02], yyyy
 104 keyDown('rightArrow'); // -> Week 02, [yyyy]
 105 currentYear = new Date().getFullYear();
 106 keyDown('downArrow'); // -> Week 02, [current year]
 107 shouldBe('input.value', 'currentYear + "-W02"');
 108
 109 beginTest('Tab key', '2012-W09');
 110 keyDown('\t'); // -> Week 09, [2012]
 111 keyDown('5'); // -> Week 09, [0005]
 112 shouldBeEqualToString('input.value', '0005-W09');
 113 keyDown('\t', ['shiftKey']); // -> Week [09], 0005
 114 keyDown('7'); // -> Week [07], 0005
 115 shouldBeEqualToString('input.value', '0005-W07');
 116 keyDown('\t'); // -> Focus out.
 117 shouldBeEqualToString('document.activeElement.id', 'after');
 118
 119 beginTest('Shfit+Tab key', '2012-W09');
 120 after.focus();
 121 keyDown('\t', ['shiftKey']); // -> Week 09, [2012]
 122 keyDown('3'); // -> Week 09, [0003]
 123 shouldBeEqualToString('input.value', '0003-W09');
 124 keyDown('\t', ['shiftKey']); // -> Week [09], 0003
 125 keyDown('\t', ['shiftKey']); // -> Focus out.
 126 shouldBeEqualToString('document.activeElement.id', 'before');
 127
 128 beginTest('Up key on maximum value', '275760-W09');
 129 keyDown('upArrow'); // -> Week [10], 275760
 130 keyDown('\t'); //      -> Week 10, [275760]
 131 keyDown('upArrow'); // -> Week 10, [0001]
 132 shouldBeEqualToString('input.value', '0001-W10');
 133 beginTest('Up key with a maximum attribute', '1999-W12', '1000-W01', '1999-W12');
 134 keyDown('upArrow'); // -> Week [13], 1999
 135 keyDown('\t'); //      -> Week 13, [1999]
 136 keyDown('upArrow'); // -> Week 13, [1000]
 137 shouldBeEqualToString('input.value', '1000-W13');
 138
 139 beginTest('Down key on minimum value', '0001-W01', 'bad min', 'wrong max');
 140 keyDown('downArrow'); // -> Week [53], 0001
 141 keyDown('\t'); //        -> Week 01, [0001]
 142 keyDown('downArrow'); // -> Week 53, [275760], which is greater than the hard limit.
 143 shouldBeEqualToString('input.value', '');
 144 beginTest('Down key with a minimum attribute', '1000-W01', '1000-W01');
 145 keyDown('downArrow'); // -> Week [53], 1000
 146 keyDown('\t'); //        -> Week 53, [1000]
 147 keyDown('downArrow'); // -> Week 53, [275760], which is greater than the hard limit.
 148 shouldBeEqualToString('input.value', '');
 149
 150 beginTest('Inconsistent min-max attributes', '1999-W12', '1999-W12', '1000-W01');
 151 keyDown('upArrow'); // -> Week [13], 1999.
 152 keyDown('\t'); // -> Week 13, [1999]
 153 keyDown('upArrow'); // -> Week 13, [1000].  1000 is the swapped minimum year.
 154 shouldBeEqualToString('input.value', '1000-W13');
 155 keyDown('downArrow'); // -> Week 01, [1999]
 156 shouldBeEqualToString('input.value', '1999-W13');
 157
 158 beginTest('Make an invalid date', '2012-W01');
 159 keyDown('downArrow'); // -> Week [53], 2012
 160 shouldBeEqualToString('input.value', ''); // 2012-W53 is not a valid date.
 161
 162 beginTest('Backspace key', '2012-W09');
 163 keyDown("\b"); // -> Week [ww], 2012
 164 shouldBeEqualToString('input.value', '');
 165
 166 beginTest('Delete key', '2012-W09');
 167 keyDown("delete"); // -> Week [ww], 2012
 168 shouldBeEqualToString('input.value', '');
 169
 170 beginTest('Typeahead', '2012-W12');
 171 keyDown('rightArrow'); // -> Week 12, [2012]
 172 keyDown('1'); //          -> Week 01, [0001]
 173 shouldBeEqualToString('input.value', '0001-W12');
 174 keyDown('leftArrow'); //  -> Week [12], 0001
 175 keyDown('rightArrow'); // -> Week 12, [0001]
 176 keyDown('2'); //          -> Week 12, [0002]
 177 shouldBeEqualToString('input.value', '0002-W12');
 178
 179 beginTest('Disabled/readonly', '2012-W10');
 180 input.disabled = true;
 181 keyDown('upArrow'); // Week 10, 2012
 182 shouldBeEqualToString('input.value', '2012-W10');
 183 input.disabled = false;
 184 input.focus();
 185 keyDown('upArrow'); // Week [11], 2012
 186 shouldBeEqualToString('input.value', '2012-W11');
 187 input.readOnly = true;
 188 keyDown('upArrow'); // Week [11], 2012
 189 shouldBeEqualToString('input.value', '2012-W11');
 190 input.readOnly = false;
 191 input.focus();
 192 keyDown('upArrow'); // Week [12], 2012
 193 shouldBeEqualToString('input.value', '2012-W12');
 194
 195 </script>
 196 </body>
 197 </html>