third_party/WebKit/LayoutTests/fast/forms/select/select-with-display-none-options.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <script src="../../../resources/js-test.js"></script>
   5 <script src="../resources/common.js"></script>
   6 </head>
   7 <body>
   8
   9 <select id="select1" size=3>
  10 <option selected>a</option>
  11 <option style="display: none">b</option>
  12 <option>c</option>
  13 <option>d</option>
  14 </select>
  15
  16 <select id="select2" size=3>
  17 <option selected>a</option>
  18 <option id="select2-b">b</option>
  19 <option>c</option>
  20 <option>d</option>
  21 </select>
  22
  23 <select id="select3" size=3>
  24 <option selected>a</option>
  25 <option id='select3-b' style="display: none">b</option>
  26 <option>c</option>
  27 <option>d</option>
  28 </select>
  29
  30 <select id="select4" size=3>
  31 <option selected>a</option>
  32 <option>b</option>
  33 <optgroup label="**cd**">
  34     <option style="display: none">c</option>
  35     <option>d</option>
  36 </optgroup>
  37 </select>
  38
  39 <select id="select5" size=3>
  40 <option selected>a</option>
  41 <option>b</option>
  42 <optgroup label="**cd**" style="display: none">
  43     <option>c</option>
  44     <option>d</option>
  45 </optgroup>
  46 <option>e</option>
  47 </select>
  48
  49 <script>
  50 document.getElementById('select2-b').style.display = 'none';
  51 document.getElementById('select3-b').style.display = 'block';
  52
  53 description('Tests for select not showing option element with display: none');
  54
  55 var select1 = document.getElementById('select1');
  56 select1.focus();
  57 shouldBeEqualToString('select1.value', 'a');
  58 eventSender.keyDown('downArrow');
  59 shouldBeEqualToString('select1.value', 'c');
  60
  61 var select2 = document.getElementById('select2');
  62 select2.focus();
  63 shouldBeEqualToString('select2.value', 'a');
  64 eventSender.keyDown('downArrow');
  65 shouldBeEqualToString('select2.value', 'c');
  66
  67 var select3 = document.getElementById('select3');
  68 select3.focus();
  69 shouldBeEqualToString('select3.value', 'a');
  70 eventSender.keyDown('downArrow');
  71 shouldBeEqualToString('select3.value', 'b');
  72
  73 var select4 = document.getElementById('select4');
  74 select4.focus();
  75 shouldBeEqualToString('select4.value', 'a');
  76 eventSender.keyDown('downArrow');
  77 eventSender.keyDown('downArrow');
  78 shouldBeEqualToString('select4.value', 'd');
  79
  80 var select5 = document.getElementById('select5');
  81 select5.focus();
  82 shouldBeEqualToString('select5.value', 'a');
  83 eventSender.keyDown('downArrow');
  84 eventSender.keyDown('downArrow');
  85 shouldBeEqualToString('select5.value', 'e');
  86
  87 </script>
  88
  89 </body>
  90 </html>