third_party/WebKit/LayoutTests/fast/forms/number/number-appearance-datalist-dynamic.html

   1 <!DOCTYPE html>
   2 <html>
   3 <body>
   4 <script src="../resources/common.js"></script>
   5 <style>
   6 input::-webkit-calendar-picker-indicator,
   7 input::-webkit-inner-spin-button {
   8     opacity: 1;
   9 }
  10 </style>
  11 <dl>
  12 <dt>Datalist follows:
  13 <dd><input type="number" list="dl1">
  14 <dt>Empty datalist:
  15 <dd><input type="number" list="dl-empty">
  16 <dt>Datalist without valid options:
  17 <dd><input type="number" list="dl-invalid">
  18 <dt>Empty datalist becomes non-empty:
  19 <dd><input type="number" list="dl-empty-valid">
  20 <dt>Datalist becomes empty:
  21 <dd><input type="number" list="dl-valid-empty">
  22 <dt>Datalist disappears:
  23 <dd><input type="number" list="dl-disappear">
  24 <dt>No datalist with the speicified ID:
  25 <dd><input type="number" list="dl-no-id">
  26 <dt>No datalist with the speicified ID, then it appears:
  27 <dd><input type="number" list="dl-no-id-then-added">
  28 </dl>
  29
  30 <datalist id="dl1">
  31 <option>2</option>
  32 </datalist>
  33 <datalist id="dl-empty">
  34 </datalist>
  35 <datalist id="dl-invalid">
  36 <option>Suggestion</option>
  37 </datalist>
  38 <datalist id="dl-empty-valid">
  39 </datalist>
  40 <datalist id="dl-valid-empty">
  41 <option>3</option>
  42 </datalist>
  43 <datalist id="dl-disappear">
  44 <option>4</option>
  45 </datalist>
  46 <datalist id="dl-no-id-then-added-pre">
  47 <option>5</option>
  48 </datalist>
  49
  50 <script>
  51 function change() {
  52     $('dl-empty-valid').innerHTML = '<option>6</option>';
  53     $('dl-valid-empty').innerHTML = '';
  54     $('dl-disappear').remove();
  55     $('dl-no-id-then-added-pre').id = 'dl-no-id-then-added';
  56     document.body.offsetLeft;
  57     testRunner.notifyDone();
  58 }
  59
  60 window.onload = function() {
  61     document.body.offsetLeft;
  62     setTimeout(change, 0);
  63 };
  64 testRunner.waitUntilDone();
  65 </script>
  66 </body>
  67 </html>