tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

select-selectedOptions.html (4584B)

      1 <!DOCTYPE html>
      2 <html>
      3 <head>
      4 <meta charset="utf-8">
      5 <title>HTMLSelectElement.selectedOptions</title>
      6 <link rel="help" href="https://html.spec.whatwg.org/multipage/forms.html#dom-select-selectedoptions">
      7 <script src="/resources/testharness.js"></script>
      8 <script src="/resources/testharnessreport.js"></script>
      9 </head>
     10 <body>
     11 <div id="log"></div>
     12 
     13 <select id="select-none-selected">
     14  <option>One</option>
     15  <option>Two</option>
     16  <option>Three</option>
     17 </select>
     18 
     19 <select id="select-one-selected">
     20  <option>One</option>
     21  <option selected>Two</option>
     22  <option>Three</option>
     23 </select>
     24 
     25 <select multiple id="multiple-select-none-selected">
     26  <option>One</option>
     27  <option>Two</option>
     28  <option>Three</option>
     29 </select>
     30 
     31 <select multiple id="multiple-select-two-selected">
     32  <option>One</option>
     33  <option selected>Two</option>
     34  <option selected>Three</option>
     35 </select>
     36 
     37 <select id="select-named-selected">
     38  <option>One</option>
     39  <option>Two</option>
     40  <option id="named-option" selected>Three</option>
     41 </select>
     42 
     43 <select id="invalid-select">
     44  <option selected>One</option>
     45  <option selected>Two</option>
     46  <option>Three</option>
     47 </select>
     48 
     49 <select id="select-same-object">
     50  <option>One</option>
     51  <option selected>Two</option>
     52  <option>Three</option>
     53 </select>
     54 
     55 <select multiple id="select-same-object-change">
     56  <option selected>One</option>
     57  <option selected>Two</option>
     58  <option selected>Three</option>
     59 </select>
     60 
     61 <script>
     62 "use strict";
     63 
     64 test(() => {
     65  const select = document.getElementById("select-none-selected");
     66 
     67  assert_array_equals(select.selectedOptions, [select.children[0]]);
     68  assert_equals(select.selectedOptions.length, 1);
     69 
     70 }, ".selectedOptions with no selected option");
     71 
     72 test(() => {
     73  const select = document.getElementById("select-one-selected");
     74 
     75  assert_array_equals(select.selectedOptions, [select.children[1]]);
     76  assert_equals(select.selectedOptions.length, 1);
     77 }, ".selectedOptions with one selected option");
     78 
     79 test(() => {
     80  const select = document.getElementById("multiple-select-none-selected");
     81 
     82  assert_equals(select.selectedOptions.item(0), null);
     83  assert_equals(select.selectedOptions.length, 0);
     84 }, ".selectedOptions using the 'multiple' attribute with no selected options");
     85 
     86 test(() => {
     87  const select = document.getElementById("multiple-select-two-selected");
     88 
     89  assert_equals(select.selectedOptions.item(0), select.children[1]);
     90  assert_equals(select.selectedOptions.item(1), select.children[2]);
     91  assert_equals(select.selectedOptions.length, 2);
     92 }, ".selectedOptions using the 'multiple' attribute with two selected options");
     93 
     94 // "A select element whose multiple attribute is not specified must not have
     95 // more than one descendant option element with its selected attribute set."
     96 // - https://html.spec.whatwg.org/multipage/forms.html#the-option-element:the-select-element-6
     97 
     98 // "If two or more option elements in the select element's list of options
     99 //  have their selectedness set to true, set the selectedness of all but
    100 // the last option element with its selectedness set to true in the list of
    101 // options in tree order to false."
    102 // - https://html.spec.whatwg.org/multipage/forms.html#the-select-element:the-option-element-21
    103 test(() => {
    104  const select = document.getElementById("invalid-select");
    105 
    106  assert_array_equals(select.selectedOptions, [select.children[1]]);
    107  assert_equals(select.selectedOptions.length, 1);
    108 
    109 }, ".selectedOptions without the 'multiple' attribute but " +
    110   "more than one selected option should return the last one");
    111 
    112 test(() => {
    113  const select = document.getElementById("select-named-selected");
    114 
    115  assert_equals(select.selectedOptions.constructor, HTMLCollection);
    116  assert_equals(select.selectedOptions.namedItem("named-option"), select.children[2]);
    117 }, ".selectedOptions should return `HTMLCollection` instance");
    118 
    119 test(() => {
    120  const select = document.getElementById("select-same-object");
    121  const selectAgain = document.getElementById("select-same-object");
    122 
    123  assert_equals(select.selectedOptions, selectAgain.selectedOptions);
    124 
    125 }, ".selectedOptions should always return the same value - [SameObject]");
    126 
    127 test(() => {
    128  const select = document.getElementById("select-same-object-change");
    129  const before = select.selectedOptions;
    130  assert_equals(before.length, 3);
    131 
    132  select.selectedOptions[1].selected = false;
    133 
    134  const after = select.selectedOptions;
    135 
    136  assert_equals(before, after);
    137  assert_equals(before.length, 2);
    138  assert_equals(after.length, 2);
    139 
    140 }, ".selectedOptions should return the same object after selection changes - [SameObject]");
    141 </script>
    142 </body>
    143 </html>